cccc

Refactoring UI

notion image
  • Refactoring UI》,作者 Adam Wathan 也是 Tailwind CSS 的作者,本书是以一名开发者而不是设计师的角度,从头开始讲述如何设计、重塑 UI 设计,从布局、间隔、文字、色彩、阴影、图像等各个角度提出设计的规则和策略,可以看作是 UI 设计的 crash course,可配合 7 Practical Tips for Cheating at Design 食用。
目录即是指南:
  • 从零开始
    • 始于特性而非布局
    • 细节后来
    • 不要过度设计,慢慢深入
    • 设计的气质
    • 限制选择,形成设计体系
  • 等级是一切
    • 元素不平等
    • 不等级关系不要一切都指望字号
    • 有色背景上不要字体颜色不要用灰色
    • 弱化其他,剩下那个即被强调,不要强上加强
    • 标签是最末一招,尽量不用,或者融入或者弱化
    • 区分文档等级和视觉等级
    • 平衡 weight 与 contrast (这二者还需再琢磨
    • 语义是次要的
  • 布局与空间
    • 让元素有适当的空间呼吸
    • 建立尺度的体系,不要乱七八糟的尺寸
    • 不要填满屏幕
    • 格栅被高估了
    • 相对尺寸并不等比例缩放
    • 别用不明确的间隔
  • 设计文字
  • 色彩
  • 创造深度
  • 图片
  • 触摸
  • 升级
badge