Back to works

让作品集记住决策:从静态展示到持续生长的产品叙事

我不想把这个作品集做成项目截图合集。它需要解释一个混合型角色:产品思考、UX/UI、AI SaaS 工作、SEO 内容、数据复盘和代码协作。所以我从 0 到 1 搭了一个双语作品集,用暗色 editorial 界面、可复用 case-study 结构和本地 memory 文件,避免后续迭代越改越散。

Role产品定位、UX/UI、内容策略、前端协作
Product个人作品集网站
Scope首页、案例页、简历页、视觉系统、双语文案、本地 memory
产物网站页面、设计规则、内容规则、当前状态 memory、backlog
3核心页面:首页、案例页、简历页
2通过一个内容层规划双语模式
8可复用 case-study 段落结构
5指导未来迭代的 memory 文件

01. 项目背景

我的工作不太适合被放进纯 UI 作品集里。很多工作发生在页面结构、SEO 系统、模型更新、产品决策、数据复盘和开发交接里。

如果只展示最终界面,最重要的工作会被藏掉。我需要一个网站,既能呈现产品思考、上线结果和设计品味,也能表达我与 AI 和代码协作的能力,同时避免变成普通模板。

02. 核心问题

最难的是定位。我不想只呈现为 UI 设计师,也不想让网站像一份排版更漂亮的产品经理简历。它必须同时让人看到两面:产品判断和视觉执行。

03. 产品策略

我把这个网站当成一个小产品来做。首页只有一个任务:让访客快速理解我是谁,并尽快进入最有说服力的证据。

案例页负责放慢阅读节奏,解释具体工作。简历页则保持足够朴素,方便快速扫描。

首页快速定位,并突出最强项目证据,而不是拥挤项目网格。
案例页用证据导向的叙事解释背景、决策、系统和结果。
简历页给招聘者一条文本优先的快速扫描路径。
Memory 层用本地规则和当前状态文件保持未来迭代的一致性。

04. 体验设计

首页为快速浏览而设计。它从紧凑的身份展示进入精选案例,而不是堆满项目网格。这样能把注意力集中在最强的证据:aitryon.art 产品体验重构。

案例页采用稳定结构,让未来案例不需要每次重新发明叙事方式。它也避免我把 case study 写成松散的过程日记。每一段都有明确任务:解释业务背景、产品决策、设计动作和结果。

背景先解释产品和市场情况,再展示设计工作。
问题把分散痛点整理成清晰产品挑战。
策略展示重构背后的决策逻辑和取舍。
结果把视觉和产品变化连接到可衡量或方向性的影响。

05. 视觉系统

我有意避开明亮的 SaaS 模板感。这个网站需要更专注,也稍微锋利一点,因为我希望读者先看工作,而不是先被装饰吸引。所以我选择了 dark editorial 方向、克制对比,以及少量酸性黄绿色强调。

设计系统保留 Syne 做标志性展示标题,用 Space Grotesk 处理更长的案例标题,并用 regular IBM Plex Sans 承载正文和 UI。字号层级有意保持克制。早期迭代在详情页上过于海报化,所以当前系统更偏向冷静标题、可读正文和更严格的间距纪律。

一致性首页、案例页和简历页共用一套视觉语言。
克制强调色只用于 active 状态、证明点和关键操作。
节奏稳定图片比例和紧凑排版保护 editorial 阅读节奏。

06. Memory 系统

真正让这个网站后续更好维护的,是 memory 文件。它们记录当前状态、字体选择、内容规则、双语决策和 backlog。

下次我再借助 AI 继续改时,不需要重新解释同一批设计决策,也不用提醒它为什么这个网站不能变成普通模板。

CURRENT_STATE.md记录网站当前状态和未来会话优先读取的上下文。
design.md定义当前视觉方向、字体、布局逻辑和设计边界。
CONTENT_RULES.md让文案、案例叙事、指标和双语规则保持一致。
BACKLOG.md跟踪待补视觉资产、证据、打磨项和未来结构决策。

07. 从 0 到 1

Dimension 起点 形成的系统
定位 需要把 UI、产品、AI 和增长能力组织成一个可理解身份 形成 AI / Growth Product Designer & PM 的清晰定位
首页 需要一个让访客快速进入重点证据的首页 用身份、精选案例、关于和联系构成第一屏到证据的路径
案例页 需要一种能持续复用的项目叙事方式 建立 8 段式 case-study 结构,并和首页共享同一套 dark editorial 系统
内容 需要让设计和内容判断能跨多次 AI 协作延续 用当前状态、设计规则、内容规则和 backlog 指导每次迭代
语言 需要同时服务中文和英文读者 已上线双语切换,并用内容规则让英文和中文文案成对维护

08. 结果

更清晰网站把产品设计、AI SaaS、增长、SEO 内容和上线工作连接成一个身份。
更统一首页、案例页和简历页现在共享一致的 editorial 系统。
可复用案例结构可以支持未来项目,不需要从空白页面开始。
可持续Memory 层让设计决策能被未来 AI 协作继续使用。

这个作品集本身也变成了一个 case study:先定义定位,再搭结构、定视觉规则,并留下足够的 memory,让下一次迭代能从同一个地方继续。

09. 下一步