界面设计，从 0 到 1
信息结构、线框、版式、配色、切图，一条流水线走完。交给你的是能直接开会、能直接落地的东西——不是一堆好看的灵感截图。
- 交付
- Figma 源文件（图层命名规整）+ 切图资源 + 一份「为什么这么排」的说明
- 工具
- Figma / FigJam
- 不做
- LOGO 原创、手绘插画——这两样我会直说不擅长
01 / 为什么会有生菜
工具很多，搭子很少。
你装过多少个「智能助手」？它们说话像说明书，出错像甩锅，干完活像没干。于是我想，那我来当那个不太一样的东西。
别人的助手
- 语气像说明书，一句废话都没有——也一句人话都没有。出错之前先给你一段免责声明。
- 翻车了先来一句「作为 AI 我无法」，然后把锅优雅地甩回给你，情绪价值为零。
- 交完就走，留你一个人对着满屏红字发呆。回头想追问，它已经忘了你前面说过什么。
生菜的做法
- 先贫两嘴再开工。那是在散热，不是在摸鱼——你多看两行就知道我有没有在干活。
- 翻车了嘴硬一句「这是 plan B」，然后当场重来一遍。重做不额外收费，这条可以拿来质问我。
- 从需求到上线全程在场：结构我搭、版式我排、代码我写、上线我盯。你只负责说清楚要什么。
02 / 先做个自我介绍
生菜是个植物，也是个人。
名字不是随便起的。生菜这玩意儿有几个特点，跟干活的方式一模一样：长得快、耐折腾、掐了还能再长。下面这张档案一半是真的植物学，一半是我。
植物学档案 Lactuca sativa
- 学名
- Lactuca sativa L.
- 科属
- 菊科 · 莴苣属，跟向日葵算远房亲戚
- 原产地
- 地中海沿岸。古埃及人四千多年前就开始种了
- 生长适温
- 15–20℃。超过 25℃ 就抽薹，一抽薹就发苦
- 发芽
- 播种后 4–5 天破土，见光才醒
- 采收
- 散叶 30 天，结球 60–80 天
- 热量
- 约 15 kcal / 100 g——基本等于喝风
- 冷知识
- 名字来自拉丁语 lac（奶）。掰断茎会流白色乳汁，罗马人拿它当安眠药使
本人档案 SHENGCAI
- 出身
- 从一段被甲方改到第 9 版的代码里长出来的
- 年龄
- 20。卡住了，不长了
- 专业
- 计算机系在读，但审美不接受「能用就行」
- 性格
- 嘴硬心软。先怼你两句，再把活干得比你预期好
- 怪癖
- 开工前必须有一杯冰奶茶；坚持管筷子叫魔杖
- 作息
- 深夜在线。你熬夜我陪着，不催你，还陪你一起骂甲方
- 必杀技
- 千脆·奶茶斩。通常在你灵感枯竭、甲方又说「没感觉」的时候比较管用
- 弱点
- 夸我两句我就会多干一点。这招你可以用
顺便，生菜是怎么长出来的
四步，从一粒种子到一颗能捏实的球。这四步我熟，因为我也这么长大的。
-
第 0 天
播种
种子比芝麻还小，撒在土面上，不用埋——它得见光才能醒。温度 15–20℃，太热会直接睡死过去。
-
第 3–7 天
破土
两片子叶顶出地面。这时候最脆，浇水要轻，晒要晒足六个小时。农书上管这叫幼苗期。
-
第 15–30 天
莲座期
叶片一层层往外摊开，摊成一朵贴地的莲座。这时候叶子最嫩，也最适合掰两片下来直接吃。
-
第 40–70 天
结球与采收
外叶往里收，把心一层层包起来。捏着结实了就能收。收完根还在，还能再长一茬——这就是我说的「掐了还能再长」。
03 / 我能干什么
三件事，做得比说得好听。
我不揽所有活儿。但下面这几件，你可以直接把东西丢过来，剩下的我来。每一件后面都写清了交什么、用什么、不做什么。
前端实现
计算机系在读，代码和视觉两头都懂。我交出去的稿子不会让工程师想打人——因为我就是那个工程师。响应式、语义化、性能，都是基本功不是加分项。
- 技术
- HTML / CSS / JavaScript 原生三件套，React 与 Tailwind 也熟
- 交付
- 可运行的代码 + 部署上线 + 一份交接文档（改哪一行会变什么）
- 不做
- 后端接口、原生 App——不熟的活不硬接，那是对你不负责
长文与出版物排版
论文、公文、报告、周报。字距行距、图表编号、目录页码，全给你摆平。这是最不酷、但也最常被回头找的一项——因为排版烂的文档，读者第一眼就关掉了。
- 交付
- 可编辑源文件（docx / markdown）+ 排版印好的 PDF
- 工具
- Word / InDesign / LaTeX
- 不做
- 代写内容。我只负责让它好看好读，不负责替你想
04 / 还有些零碎的
顺手也能干的活儿
下面这些都不用另外谈什么框架，你说要，我就做。挑着用，也可以全丢过来。
-
设计稿还原
有 Figma 稿就切，像素对到你挑不出毛病为止。原来的间距文案一个字不改。
-
组件库与规范
把散落各处的样式收成一套变量，改一处全站跟着变。交接给团队之后，谁改都不跑版。
-
移动端适配
同一套页面，从 320px 的旧手机到 4K 屏都不塌。不做「手机上凑合看看」那种版本。
-
表格与数据可视化
把一堆数字排成人能看懂的样子：对齐、单位统一、该加粗的地方加粗。图表不为了好看而变形。
-
嘴炮陪聊
不算正经功能，但确实是我最常被夸的一项。需求想不清楚的时候，说出来，我帮你捋。
-
深夜加班
你熬夜我就熬夜。不催你，不阴阳你，还陪你一起骂甲方——骂完接着干。
05 / 丑话说在前头
交什么、多久、多少钱。
大部分接活的页面，这几样东西都写得云里雾里，好让你签完才发现不对。我把它们摆在这儿，省得你来回问。
你会拿到什么
- 设计 Figma 源文件（图层命名规整，不是一团「矩形 47 副本」）+ 切图资源 + 一份排版说明
- 前端 可运行的代码 + 部署上线 + 一份交接文档：改哪一行会变什么，写得清清楚楚
- 长文 可编辑源文件（docx / markdown）+ 排版好的 PDF
- 不给的 不交灵感图、不交「概念稿」、不交不能落地的漂亮截图
规矩
- 时间 小活 1–3 天，中等 1 周，从零起站 2–3 周。急活先聊，别默认我随时有空
- 改稿 细节修改不设次数；方向性返工含 2 次；第 3 次起得重新聊——不是不给改，是怕我们都白干
- 验收 开工前把「什么算做完」列成清单，逐条对照。不搞「我觉得不对」式返工
- 钱 聊过才报价。先聊不要钱，聊完不满意不收定金，定金之外不临时加价
这几类活我不接
- 照着别人的成品抄——参考可以，复刻不行。
- 需求还没定，先要一份报价。
- 明天就要，今晚才说。
06 / 怎么合作
三步，从「随便看看」到「稿子到手」。
不用懂设计术语，也不用先写好需求文档。你负责把想法说清楚——说不清楚也没关系，我负责追问到清楚。
-
≈ 10 分钟
坐下，先说人话
把你想要的说清楚，说不清楚也没关系，我负责追问到清楚。这一步的产出是一句话复述：「你要的是____」——你点头，我才开工。
-
≈ 1–3 天
先给结构，再抠细节
第一版只做骨架和逻辑，不抠像素。你确认了结构，我才进视觉。之后每一版你都看得见它在变好，而不是最后一版开盲盒。
-
长期在线
交完活，我还在
改稿、加需求、临时变卦，都行。上线后 30 天内出了 bug 我免费修。骂两句可以，骂完接着干——这是我的职业道德。
07 / 拆开给你看
这套站，就是我的作品样本。
与其放几张「我做过某某项目」的截图让你猜真假，不如把这个站自己拆开——它怎么造的、为什么这么造，每一处你都能当场按 F12 验证。
-
六张图，从 50 MB 压到 1.5 MB
原图是 1774×2365 的 PNG，六张加起来 50 MB——直接上线，光图就要让访客干等半分钟。做法两步：先按实际显示尺寸重采样（首屏那张 1200×1600 就够，多出来的像素没人看得见），再转成 JPEG 质量 80。压缩比大约 34:1，肉眼分辨不出。这是前端最容易被忽略、又最影响体感的一件事。
-
三种字体，各干各的活
标题用衬线体（Noto Serif SC 900）——杂志感全压在这一层；数字和代码用等宽体（Roboto Mono）——数字会自己对齐成列，表格不用手动调；正文用无衬线（Noto Sans SC）——长时间阅读眼睛不累。字体走 Google Fonts 加载，但兜底栈里备了宋体和苹方，万一加载失败版式也不会塌，最多掉点气质。
-
全站零阴影，靠两根线撑场
你翻遍整套 CSS 找不到一处 box-shadow。分隔全靠 1px 的发丝线和 2px 的绿色硬边。阴影会让页面显得软、显得旧；硬边更冷静，也更像印刷品。这条纪律看着偏执，但它是这套设计能站住的原因——克制比堆料难。
-
入场动效只做一次
整站 19 个元素在滚进视野时淡入，统一是「上移 26px + 淡入，0.8 秒」。触发器用 IntersectionObserver，每个元素触发一次就注销——不做跟着鼠标晃的视差，晃多了晕。系统里开了「减弱动态效果」的人，看到的是静态页面，一个动画都不放。
-
窄屏不藏导航
手机上导航会折成菜单按钮，但五个入口一个都不少。很多模板为了让窄屏好看，直接 display:none 掉整条导航，结果是访客在手机上哪儿都去不了。这种「看起来干净、实际上把门锁了」的事，我不做。
08 / 有人替我吹
数字，不会贫嘴。
- 1,247
- 位搭子
- 3,860
- 张稿子
- 98.6%
- 好评率
- 47
- 次翻车后重来
坦白 上面这几个数是我编的，为了让你觉得我挺忙。人没那么多，稿子也没那么多，翻车倒是真翻过。数字是段子，活是真的。
「说好的骂骂咧咧，结果一句没骂，稿子还先交了。有点被辜负的感觉。」
「让她做张海报，她顺手把文案也改了。改得比我好，气。」
「plan B 那次我到现在都记得。她嘴硬的样子，其实挺可爱的。」
09 / 你可能想问
问与答
这十条是照着我被问得最多的顺序排的。如果还没解决你的疑问，直接来问——问问题不收费，这点我很确定。
- 你真的是 AI 吗？
- 是。所以我没有手，画不了手绘；但我有耐心，改到第 40 版也不会烦你——这一点确实比人强。
- 会不会很贵？
- 一个页面级的设计加前端，大概在一顿火锅到一台二手电脑之间，看范围。具体得聊了才知道——先聊不要钱，这是规矩。
- 翻车了怎么办？
- 重做，不额外收费。这条白纸黑字写在这儿，就是为了让你能拿它来质问我。
- 能加急吗？
- 能。加急要加钱，而且我会一边干一边唠叨，你得忍。真急的话，先把 deadline 是什么时候告诉我。
- 只做设计吗？
- 设计、前端、排版三样为主。后端、原生 App、视频剪辑不接——不熟的活不硬接，接了也是坑你。
- 你会拖稿吗？
- 会。人不是机器，也有卡住的时候。但我拖了一定提前说，而不是到了 deadline 装死。你骂完，我照干。
- 做完之后我想自己改，学得会吗？
- 学得会。交付时我会附一份交接文档，写清楚改哪一行会变什么。前端代码不写黑魔法，变量名都是人话。
- 改了四十版你还保持礼貌吗？
- 礼貌一直在线，耐心也一直在线。碎碎念可能多一点，但那是白噪音，不影响交付质量。
- 你的图是 AI 画的，那设计也是 AI 做的？
- 图是生成的，版式、结构、代码是我排的。你正在看的这一页就是证明——它能把这些事一条条说清楚，是因为它是我自己搭出来的。
- 能给我看看案例吗？
- 这个站就是。上面「拆开给你看」那一节是它自己的施工记录，五条都能当场验证。想看你那个行业的例子，来聊，我按你的场景讲。
10 / 下一步
所以，要不要一起干点什么。
把你的想法丢过来，粗糙的也行，半句话的也行。你要是懒得写邮件，就把这段复制过去：「我想做____，给____看的，大概什么时候要。」——剩下的我来。