移动端屏幕空间有限、手指操作、场景碎片化，和网页 UI 差异很大，下面是开发 & 设计都要遵守的关键原则：
1. 触控友好（适配手指操作）
点击热区足够大：推荐最小点击区域 44×44px（iOS 规范），Android Material 建议至少 48×48dp；按钮、图标不要做得太小。
预留间距：可点击元素之间留空隙，防止误触。
避免精细操作：不要求用户点很小的文字、细线；拖拽、滑动控件要容错高。
重要操作放在拇指热区（屏幕中下区域），顶部角落属于难触区域，少放高频按钮。
2. 清晰的信息层级
一页一核心目标，不要堆砌太多信息；优先展示最重要内容。
通过字号、字重、颜色、留白、卡片区分标题、正文、辅助文字。
减少干扰元素，弱化次要信息（说明文字、备注、辅助图标）。
3. 一致性原则
组件统一：按钮、输入框、弹窗、加载动画样式、交互逻辑全 App 保持一致。
平台规范对齐：iOS 遵循 Human Interface Guidelines，Android 遵循 Material Design；不要强行混用两套控件交互习惯。
文字规范、图标风格、色彩体系统一，降低用户认知成本。
4. 可读性优先
正文文字不能过小，移动端正文推荐最小不低于 14sp/dp；
对比度达标（WCAG 标准，正文至少 4.5:1），浅色模式、深色模式都要校验，避免浅色字配浅背景；
长文本适当行高，不要挤在一起；避免大段密集文字。
5. 反馈及时明确（交互反馈）
用户每一次操作都要有反馈：
点击：按压态、变色、轻微缩放；
加载：loading 骨架屏、进度条，避免用户以为没点上；
成功 / 失败：Toast、弹窗、状态文字提示；
禁止 “静默无响应”，尤其是网络请求、提交操作。
6. 轻量化、减少认知负担
简化流程：减少页面跳转、减少表单输入，能选择就不手动输入；
克制弹窗，不随意打断用户；
用词直白，少专业术语；
符合用户心智：用户预期点这个按钮发生什么，实际就发生什么，不要反直觉。
7. 适配与响应原则
多尺寸适配：不同手机屏幕尺寸、分辨率、长短屏；
横竖屏策略：大部分 App 优先竖屏，明确是否支持横屏；
深色模式支持；
适配系统字体放大（系统字号调大后布局不能错乱、文字不截断）。
8. 容错与可控
危险操作（删除、提交、支付）增加二次确认；
支持撤销、返回；表单出错时精准提示哪里错、怎么改，不要只提示 “操作失败”；
网络异常、空数据、报错页要有友好兜底页面（空状态、错误重试）。
9. 视觉简洁，留白合理
不要满屏铺满元素，留白不是空白，用来划分模块、聚焦内容； 克制色彩，主色一般 1 个 + 辅助色，不要五颜六色。
10. 可访问性（无障碍）
图标、图片增加读屏标签（contentDescription）；
支持系统旁白 / 读屏软件；
不靠颜色单独表达状态（比如只用红色代表错误，还要搭配图标、文字）。
补充：和开发相关的额外要点
状态驱动 UI：加载中、成功、失败、空数据、无权限，每种状态单独处理；
动画适度：转场、动效提升体验，但不能过多造成卡顿、耗电；
考虑弱网、离线场景下 UI 表现。
本文原创作者：易君召，详见：https://www.yijunzhao.cn/authors/yijunzhao，转载请注明出处。
原文链接
欢迎访问 小易撩挨踢