设计原则
源码: 全局设计决策指导原则
核心原则
1. 信任优先 (Trust First)
钱包是用户管理资产的工具，信任是最重要的基础。
透明 (Transparency)
原则: 所有操作都清晰展示细节
| 场景 | 透明设计 | MUST/SHOULD |
|---|---|---|
| 转账 | 显示完整地址、金额、手续费 | MUST |
| 授权 | 显示 DApp 来源、请求权限 | MUST |
| 签名 | 显示签名内容（消息/交易） | MUST |
| 错误 | 显示具体原因，不用模糊措辞 | SHOULD |
可控 (Control)
原则: 用户始终掌握主动权
| 场景 | 可控设计 | MUST/SHOULD |
|---|---|---|
| 私钥 | 永不上传服务器 | MUST |
| 授权 | 可随时撤销 | MUST |
| 操作 | 明确的取消路径 | MUST |
| 设置 | 可调整所有偏好 | SHOULD |
安全提示 (Security Awareness)
原则: 主动提醒潜在风险
| 场景 | 安全提示 | MUST/SHOULD |
|---|---|---|
| 陌生地址 | 首次转账警告 | SHOULD |
| 大额交易 | 二次确认 | MUST |
| 敏感操作 | 生物识别/密码确认 | MUST |
| 异常行为 | 主动告警 | SHOULD |
2. 渐进复杂度 (Progressive Complexity)
原则: 新手友好，进阶可选
入门路径 进阶路径
──────── ────────
创建钱包 (30秒) 导入钱包 (助记词/私钥)
│ │
▼ ▼
查看余额 (一键) 高级设置 (Gas/Nonce)
│ │
▼ ▼
简单转账 (扫码/地址簿) 批量操作 (多签/合约)默认值策略
| 设置项 | 默认值 | 理由 |
|---|---|---|
| Gas 费 | 系统推荐 | 新手无需理解 |
| 地址格式 | 自动检测 | 减少选择负担 |
| 网络 | 主网 | 安全优先 |
| 语言 | 系统语言 | 符合预期 |
进阶入口
- MUST 进阶功能隐藏在二级菜单
- MUST 进阶设置有默认值
- SHOULD 提供进阶功能的简要说明
- MAY 提供进阶教程链接
3. 响应式设计 (Responsive Design)
原则: 适配多种屏幕，优先移动端
断点定义
| 断点 | 宽度范围 | 典型设备 | 优先级 |
|---|---|---|---|
| xs | < 360px | 小屏手机 | 兼容 |
| sm | 360-428px | 普通手机 | 设计基准 |
| md | 428-768px | 大屏手机/小平板 | 适配 |
| lg | ≥ 768px | 平板 | 可选 |
适配策略
typescript
// 布局适配
const layoutStrategy = {
xs: { columns: 1, padding: 12 },
sm: { columns: 1, padding: 16 }, // 设计基准
md: { columns: 2, padding: 20 },
lg: { columns: 3, padding: 24 },
}
// 字体适配
const fontStrategy = {
title: 'clamp(1.25rem, 4vw, 1.5rem)',
body: '1rem',
caption: '0.875rem',
}行为约束规范
MUST (必须)
违反将导致功能缺陷或安全问题：
- 显示完整交易信息（地址、金额、费用）
- 敏感操作需要认证确认
- 私钥永不离开设备
- 提供明确的取消路径
- 错误状态有恢复指引
SHOULD (建议)
不遵守会降低用户体验：
- 提供操作反馈（视觉/触觉）
- 支持减少动效模式
- 显示操作进度
- 提供撤销机会（在安全范围内）
- 记住用户偏好
MAY (可选)
增强体验但非必需：
- 高级自定义选项
- 快捷操作手势
- 数据导出功能
- 主题个性化
设计决策清单
在设计新功能时，检查以下问题：
markdown
## 信任检查
- [ ] 操作是否透明？用户能否理解发生了什么？
- [ ] 用户是否可以取消或撤销？
- [ ] 是否有必要的安全提示？
## 复杂度检查
- [ ] 新手能否在 30 秒内完成核心路径？
- [ ] 进阶选项是否隐藏在二级入口？
- [ ] 默认值是否合理？
## 响应式检查
- [ ] 在 360px 宽度下是否正常显示？
- [ ] 触摸目标是否足够大（44×44px）？
- [ ] 是否支持系统减少动效设置？