Interface & Type

周圣淞

做界面工程,也做视觉秩序。把复杂的信息拆到能一眼看懂,再把代码写到能长期维护。

12年 界面工程实践
40+ 交付上线的产品界面
8套 长期维护的设计系统
3本 未公开的排版手记
85% 经手页面在移动端的首屏完整渲染率

近期条目

ORDERED BY DATE
01

企业级控制台的层级重排

把七大业务模块的入口从平铺改成两级路径,常用操作的前置成本降了一半以上。

02

中文正文字号与行距标定

在三种屏宽下反复比对 14px 与 16px 的阅读节奏,最终落在随视口浮动的方案上。

03

组件库的语义颜色收口

把散落在各处的色值收进一套变量,界面改动从此只需要动一层配置。

04

弱网环境下的加载体验

先用骨架屏守住布局,再让内容分批就位,避免页面在加载时来回跳动。

05

橄榄绿配色的可读性验证

深绿作标题、草绿作强调、浅草白作底,三种底色下都把对比度拉到可放心阅读的位置。

06

手记与写作

把每次取舍的理由写下来,日子久了,这些段落比代码更清楚当时在想什么。

关于

周圣淞的工作长期落在界面工程与视觉设计的交叉处。接手一个产品时,他习惯先把信息层级拆清楚,再决定颜色、字号与留白怎么落位;写代码时也保留同样的顺序,先让结构成立,再谈动效。

他不太相信一次性的大改版,更在意能持续的小修整。一套界面被用上三年,中间总会遇到新的业务、新的屏幕、新的内容长度,扛得住这些变化的,往往不是最初那版漂亮的稿子,而是留了余地的规则。

三条自我约束:先做减法,能删掉的一律删掉;每个决定留痕,方便半年后的自己接手;交付可读的代码,让别人改得动。

关注的方向

设计系统的长期维护。组件不是画完就结束的东西,命名、状态、边界情况、废弃流程,都要有人持续打理,否则半年后它就成了一堆没人敢动的旧件。

以性能为先的页面实现。首屏能多快就多快,脚本按需到位,动画只做屏幕上真正发生的变化。用户不会称赞加载得快,但一定会记住卡顿。

中文排版在移动端的可读性。汉字没有词间空格,一行能放多少字、字与字之间的呼吸留多少,直接决定了长文的耐读程度,这件事值得反复调。

工作之外,他整理笔记、读旧书、偶尔写点与项目无关的短段落,也把这些零散记录留在自己的域名下,慢慢攒成一份可回溯的轨迹。

设计系统 中文排版 前端性能 可访问性 界面语义 长期维护