touch-psychology

# 触摸心理学参考 > 深入探讨移动端触摸交互、适用于触摸的菲茨定律、拇指区域解剖学、手势心理学及触觉反馈。 > **这是 ux-psychology.md 的移动端版本 - 对所有移动端工作至关重要。** --- ## 1. 适用于触摸的菲茨定律 ### 根本区别 桌面端 (鼠标/触控板): ├── 光标大小: 1 像素 (精确) ├── 视觉反馈: 悬停状态 ├── 错误成本: 低 (易于重试) └── 目标获取: 快速、精确 移动端 (手指): ├── 接触面积: ~7mm 直径 (不精确) ├── 视觉反馈: 无悬停，仅点击 ├── 错误成本: 高 (令人沮丧的重试) ├── 遮挡: 手指覆盖目标 └── 目标获取: 较慢，需要更大的目标 ### 适配后的菲茨定律公式 触摸获取时间 = a + b × log₂(1 + D/W) 其中: ├── D = 到目标的距离 ├── W = 目标的宽度 └── 对于触摸: W 必须比桌面端大得多 ### 最小触摸目标尺寸 | 平台 | 最小 | 推荐 | 用途 | |----------|---------|-------------|---------| | **iOS (HIG)** | 44pt × 44pt | 48pt+ | 所有可点击元素 | | **Android (Material)** | 48dp × 48dp | 56dp+ | 所有可点击元素 | | **WCAG 2.2** | 44px × 44px | - | 无障碍合规 | | **关键操作** | - | 56-64px | 主要 CTA、破坏性操作 | ### 视觉尺寸 vs 点击区域 ┌─────────────────────────────────────┐ │ │ │ ┌─────────────────────────┐ │ │ │ │ │ │ │ [ 按钮 ] │ ← 视觉: 36px │ │ │ │ │ └─────────────────────────┘ │ │ │ ← 点击区域: 48px (内边距扩展) └─────────────────────────────────────┘ ✅ 正确: 如果点击区域至少为 44-48px，视觉元素可以更小 ❌ 错误: 使点击区域与小的视觉元素大小相同 ### 应用规则 | 元素 | 视觉尺寸 | 点击区域 | |---------|-------------|----------| | 图标按钮 | 24-32px | 44-48px (内边距) | | 文本链接 | 任意 | 最小 44px 高度 | | 列表项 | 全宽 | 48-56px 高度 | | 复选框/单选框 | 20-24px | 44-48px 点击区域 | | 关闭/X 按钮 | 24px | 最小 44px | | 标签栏项 | 图标 24-28px | 全标签宽度，49px 高度 (iOS) | --- ## 2. 拇指区域解剖学 ### 单手手机使用 研究表明: 49% 的用户单手持机。 ┌─────────────────────────────────────┐ │ │ │ ┌────────────────────