结构先于装饰
先把信息分层、分组、排序，再定颜色和线条。去掉色块和线条之后，页面仍然要读得懂。
STUDIO / PRODUCT DESIGN · 产品设计
霜凌玉嶂
产品设计所
我们做信息密集的产品：把内容整理成能读、能查、能核对的界面。 功能不多，只留每天都用得上的。
01 / DESIGN AESTHETICS
设计理念
这类产品的设计标准很简单：能读下去、读得准、信得过。下面五条按重要性排序。
可读性优先
对比度、行高、行长、字号阶梯决定能不能长时间读下去。视觉上的做法都要给可读性让路。
克制
不用阴影、大面积渐变和毛玻璃。每天都要打开的应用，花哨的东西很快会变成干扰。
动效服务于理解
动画只用来表示东西从哪来、到哪去：翻页是翻面，展开是纵向推开。
可维护的视觉系统
颜色按用途命名，层级用变量表达。换一套配色只改一处。
判断标准：
去掉装饰和动效之后，信息还站得住，这个界面才算成立。
02 / PROCESS
工作方法
四步，每一步都留下能看的东西。
-
01
定义问题
先写清楚谁在什么场景下要用它做什么，再决定要不要画界面。
-
02
结构设计
信息架构、页面层级、数据流向。这一步只出线框和状态表，不做高保真。
-
03
视觉系统
调色板、字号阶梯、间距、圆角、动效时长都落成变量。深色单独配一套取值。
-
04
实现与验证
跨端实现后，在真机、弱光、低端设备和深色模式下一项项验证。