NOTES

和开发聊「还原度」,我现在这样做

更新于:2025-01-09 • 约 4 分钟阅读

做界面这些年,我最怕听到的一句话是:「这个和设计稿不太一样。」

一开始我以为是开发不细心。后来发现,大多数时候是我没有把「什么叫一样」说清楚。

先约定哪些必须一样

不是所有像素都同等重要。开会时我会把页面分成三类:必须完全一致的(品牌色、字号、关键间距),可以有一点弹性的(插画位置、阴影),以及交给开发判断的(极端屏幕下的折行)。

分清楚之后,验收时双方吵的就不是「差了两个像素」,而是「这一条在哪一类」。

把动效写成表格

动画最容易失真,因为设计稿里看不出来。我现在会导出动效,再写一张表:时长、缓动曲线、触发条件。开发照表实现,来回的次数少了一大半。

用设计令牌代替标注

颜色和间距一个个标注,既累又容易错。把它们做成令牌,设计稿里叫什么,代码里就叫什么,改一个值,两边一起变。这件事前期要花两三天,之后每个页面都在还债的反方向,也就是赚回来。

留出验收的时间

最后一条最朴素:在排期里写明「设计验收」这一格。不留时间,验收就变成上线前一晚的赶工,没有人会开心。