共计 2347 个字符，预计需要花费 6 分钟才能阅读完成。
边距、间距
准则：边距（左右）要大于间距（高低）。
模块边距
10px、12px、15px、16px
15px 罕用
10px 最小，要展现更多的内容才用
模块间距
8px、10px、15px、16px、20px
罕用 10px 15px 20px
内容间距
5px 10px 15px
内容边距
5px 10px 15px
列表
最小高度 40px
单行 53px 55px 66px
全局规定
图片比例
16:9、4:3、3:2、1:1 和 1:0.618（黄金比例）。
字体
准则：在同一个零碎的 UI 设计中先建设体系化的设计思路，对主、次、辅助、题目、展现等类别的字体做对立的布局，再落地到具体场景中进行微调。少即是多，在视觉展示上用尽量少的款式去实现设计目标。防止毫无意义的应用大量字号、色彩、字重强调视觉重点或比照关系。
字重，只呈现 regular 以及 medium 的两种字体分量，别离对应代码中的 400 和 500，在英文字体加粗的状况下采纳 semibold 的字体分量，对应代码中的 600。
字号抉择在 3-5 种之间，放弃克服的准则。
行高 1.4
- 12px 提醒语
- 14px 主文字
- 16px 题目
- 18px 大题目
- 20px 最大题目
色彩
确定主题色，定义好字体、背景、禁用、线条边框、红橙黄绿蓝等色值。
每种色值最多配有 2~3 种浅谈变动，比方文字可有主、次、提醒等三种（#333 #666 #999）。
应用的大色彩品种不可过多，罕用的有黑、白、主题色、绿 - 胜利、红 - 失败、黄 - 正告。
暗影
离高空越远的物体，产生的暗影色彩越淡、含糊度越高、面积越大；反之则色彩更深、含糊度越低、面积越小。
暗影向下：次要利用于组件外部或组件自身，是比拟惯例场景的用法
暗影向上：次要利用于底部导航或工具栏等
暗影向左：次要利用于左边导航栏、抽屉组件或固定表格栏
暗影向右：次要利用于右边导航栏、抽屉组件或固定表格栏
一级暗影
@shadow_1_down:
0px 1px 2px -2px rgba(0, 0, 0, 0.16),
0px 3px 6px 0px rgba(0, 0, 0, 0.12),
0px 5px 12px 4px rgba(0, 0, 0, 0.09);二级暗影
@shadow_2_down:
0px 3px 6px -4px rgba(0, 0, 0, 0.12),
0px 6px 16px 0px rgba(0, 0, 0, 0.08),
0px 9px 28px 8px rgba(0, 0, 0, 0.05);三级暗影
@shadow_3_down:
0px 6px 16px -8px rgba(0, 0, 0, 0.08),
0px 9px 28px 0px rgba(0, 0, 0, 0.05),
0px 12px 48px 16px rgba(0, 0, 0, 0.03);文案
语言文字的表述须要精心斟酌，认真设计。清晰、精确、简洁的文案设计可能让界面领有更好的可用性，同时让用户体验更加敌对。
以用户为核心
文案以用户为主体来写作。比方：当用户向后盾反馈问题、提出倡议或申述时，应用「咱们」是正当的语境，例如「咱们将会审核你的申述」。
精简语句
省略无用词汇，不反复用户已知事实；在绝大多数交互场景下，都无需界面形容出全副的细节。尽量提供简短、易于疾速获取的内容。比方：保留而不是保留批改。
应用用户相熟的语言
站在用户的角度，说用户相熟的话。应用简略、间接、易于了解的词汇，让内容和批示更容易被用户承受和了解。间接、暧昧含糊的说法，生僻和过于「斯文」的用词，会减少用户的认知负荷，所以该当尽量避免应用这类用户无奈辨认的词汇。
表述统一
- 形容同一个事物的词汇要放弃对立；
- 上下文的语法、语种、语序要放弃对立；
- 操作的名称和指标页面题目的名称保持一致。
用词精准残缺
通用根本用词要标准，不要写错字，词语表白要残缺。
业余用语要精准，并是所属行业认可通用用词；工夫的表述必须明确。
比方：其余（其它 x）、道歉（对不起）、验证码（4 位或多位数字或字母图片）、校验码（手机收到的 6 位数字，验证用户的身份）、登录（登陆 x）。
语气
间接应用「你」、「我」来和用户对话，与用户建设密切感。防止应用「您」，让用户感觉太过疏远。
不要在同一个句式中混用「你」和「我」，交互中指代凌乱会让用户相当纠结。
多给用户反对与激励，不要命令和强制用户，比方：请输出字母数字组合而不是不能输出字符。
大小写和标点符号
- 产品名称全称，首字母大写。产品名称缩写须要全副大写，如：ESC、SLB 等；
- 正确应用专有名词的大小写标准 iOS Android；
- 全英文的题目，标签，菜单项等等都要遵循英文句式中首字母大写的标准；
- 统计数据应用阿拉伯数字，你有 3 条短消息；
- 审慎应用感叹号。
优化事项
重点突出
每个页面都应有明确的重点，以便于用户每进入一个新页面的时候都能疾速地了解页面内容。在确定了重点的前提下，应尽量避免页面上呈现其它与用户的决策和操作无关的烦扰因素。
流程明确
为了让用户顺畅地应用页面，在用户进行某一个操作流程时，应避免出现用户指标流程之外的内容而打断用户。
异样可控，有路可退
在设计任何的工作和流程时，异样状态和流程往往容易被疏忽，而这些异样场景往往是用户最为丧气和须要帮忙的时候，因而须要分外留神异样状态的设计，在出现异常时予以用户必要的状态提醒，并告知解决方案，使其有路可退。
要杜绝异样状态下，用户莫名其妙又无处可去，停滞在某一个页面的状况。
表单报错，在表单顶部告知谬误起因，并标识出谬误字段提醒用户批改。
缩小输出
因为手机键盘区域小且密集，输出艰难的同时还易引起输出谬误，因而在设计小程序页面时应尽量减少用户输出，利用现有接口或其余一些易于操作的抉择控件来改善用户输出的体验。
缩小期待，反馈及时
页面的过长时间的期待会引起用户的不良情绪，当呈现加载和期待的时候，须要予以及时的反馈以舒缓用户期待的不良情绪。
数据加载：进页面、下拉刷新、上滑申请。
部分加载：点击提交按钮，减少、删除、批改数据。
