1价值观

1. 自然
2. 确定

2原则

1. 亲密性
   1. 标准间距-亲密性通过间距来确定间距可以分为小间距，中间距，大间距三种
   2. 非标准间距 - 通过基本间距（8px）为单位增减
   3. 栅格系统
2. 对齐
   1. 小文案对齐 - 标题和内容对齐
   2. 表单对齐 - 冒号对齐
   3. 数字对齐 - 小数点对齐
3. 对比
   1. 主次关系对比 - 强化重点项目/弱化次要项
   2. 总分关系对比 - 用排版决定 字体大小显示总分
   3. 状态关系对比 - 静态/动态 对比
4. 重复
   1. 相同的元素在整个界面中不断重复，不仅可以有效降低用户的学习成-本，也可以帮助用户识别出这些元素之间的关联性。
   2. 重复元素可以是一条粗线、一种线框，某种相同的颜色、设计要素、设计风格，某种格式、空间关系等。
   3. 本质上而言是保持设计风格统一性
5. 直接
   1. 用户应该可以通过所见到的元素直接交互（不要新启页面或者弹窗）
   2. 如果易读性为主则编辑按钮不应该太远
6. 足不出户
   1. 用户因该更少的转换场景
   2. 用弹出框完成输入
7. 简化操作
   1. 实时可见工具
   2. 悬停即现工具
   3. 开关显示工具
   4. 增大按钮点击范围而不是按钮可见大小
8. 邀请-用户提示

   1. 静态提示

      文本邀请-白板邀请-未完成邀请

   2. 动态提示

      鼠标悬停 - 推断 - 更多内容

9. 及时反映
   1. 定时更新
   2. 加载进度
   3. 反馈模式
   4. 自动完成

3视觉

1. 色彩-（系统级-产品级）
   1. 品牌色
   2. 功能色
   3. 中性色
2. 布局 - 秩序之美
   1. 统一画板（无用）
   2. 适配（灵活）
   3. 栅格
3. 字体

   1. font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

   2. 主字体和高

      font-size	12px	14px	16px
      line-height	20px	22px	24px

      line-height = font-size+8px

   3. 字重 通常为400 500 600三种

文案

1. 表明立足点
2. 精简语句
    不用提示用户已经知道内容
3. 表述一致
4. 重要类容对比度
5. 标点
    感叹号-强烈的语境

补充

张鑫旭大神的一些原则 无宽度原则 20px高度原则