使用者
需要快速了解我的方向、核心能力和主要项目的招聘者。
← 返回作品 
当前系统 · Desktop / Light
Digital product casePortfolio System已上线 · 持续迭代
Information architecture · Content strategy
个人作品集系统设计
把产品、实体和视觉设计经历重新整理，让招聘者先看懂我主要做什么，再通过具体项目继续了解我的能力。
核心问题
产品、实体和视觉作品放在一起时，很难一眼看出我主要做什么，以及哪些项目能证明对应能力。
设计约束
中文求职语境；历史截图不完整；同时要兼顾快速浏览和深入查看。
核心决策
主身份只保留产品设计师；首页先说重点；具体过程留在项目页；Light / Dark 和不同屏幕共用同一套布局规则。
交付结果
完成一套可以直接用于求职展示的作品集，并适配 Light / Dark 和不同屏幕宽度。
状态
已上线 · 持续迭代
01 · Context
作品很多，不等于招聘者能快速理解我是谁。
我手上的内容其实不少：产品设计专业背景、实体设计经历、LootPilot、ShadePilot，以及视觉和三维作品。问题反而是这些东西同时放出来以后，很难马上看出我的主方向。所以网站首先要解决的不是展示更多，而是把重点排清楚。
已有材料
- 产品设计教育背景
- 奖牌、奖杯与生产交付
- 两个公开 Windows 产品
- UI、平面与三维表达基础
需要解决的阅读问题
先让人知道我现在主做产品设计，再通过具体项目看到产品判断、体验设计和落地能力。
02 · Positioning
先把主身份说清楚，AI放到工作方式里。
早期页面同时写了 AI Product Designer 和 Product Design Engineer。信息虽然更多，但在国内招聘语境里反而容易让人搞不清我到底在找什么岗位。后来把主标题收回到“产品设计师”，AI只保留在工作方式和实现能力里。
Before
多个职业标签并列
AI Product Designer / Product Design Engineer
职位标签太多，而且 Product Design Engineer 在国内很容易被理解成结构或机械方向。After · current
产品设计师
数字产品 · AI 辅助产品实践
AI 继续用于实现和迭代，但不再占据职位名称。Decision
主标题只保留“产品设计师”。
Why · 招聘者首先需要知道我在找什么岗位。职位标签太多只会增加理解成本。
Impact · 首页、About和Resume使用同一套职位表达。
03 · Information architecture
首页先说重点，项目页再讲过程。
早期首页同时放了 Evidence、How I Ship 和多组身份说明，很多内容其实在重复表达同一件事。后来把这些模块合并或下沉：首页只保留定位、核心作品和主要经历，具体过程放进对应的 Case Study。
01Hero我是谁 / 做什么
→02Selected Work作品与能力
→03Capabilities / Experience能力与经历
→04About / Resume继续了解与联系
Before
- Hero 身份 + 定位
- Evidence 独立证据区
- Selected Work
- How I Ship 方法说明
- Capabilities
- About
- Resume
Current
- Hero职业结论
- Selected Work核心作品入口
- Capabilities / Experience
- About
- Resume / Contact
这些页面用于说明结构如何收敛；浏览器外框和联系方式已从展示素材中裁去。
Decision
首页给结论，Case Study 给过程。
- Why
- 如果首页把所有过程、技术细节和验证都展开，真正重要的作品入口反而会被淹没。
- Change
- 删除独立 Evidence 和 How I Ship；重复的 AI 说明合并；具体项目过程全部回到对应 Case Study。
- Result
- 现在打开首页，先看到我是谁，再看到 LootPilot 和 ShadePilot，之后才是能力、经历和简历。
04 · Visual system
视觉上要有个人识别度，但不能抢掉产品本身。
我不想把它做成 SaaS 官网，也不想只做成一套平面作品集。页面需要有自己的视觉特征，但 LootPilot、ShadePilot 这些真实界面仍然应该是最重要的内容。
Warm Light
暖米白背景、浅色人像和低对比边框。
Deep Dark
深色背景配冷紫强调色，同时保留与浅色版相同的信息层级。
Editorial hierarchy
编号、栏目名、标题和正文保持固定层级。
Project surfaces
项目截图统一使用圆角、边框和背景，让不同案例保持同一展示方式。
草影和 Diamond / Pixel 只负责全站氛围；正文、项目截图和 Case Study 则使用统一的容器、圆角和边框。
05 · Hero iteration
Hero一开始塞得太满，后来才把重点收回来。
Hero前后改了几轮。最开始我想同时讲清身份、方法和作品，结果第一屏的信息太多，人物和产品也在抢注意力。后来逐步减少身份说明，让人物负责建立个人识别度，让LootPilot和ShadePilot负责展示实际产品。
Retrospective structure
IdentityMethodProfileProjects
基于早期源码整理信息型 Hero
姓名、职位、方法、Profile和作品同时出现，第一眼不知道该先看哪里。
Retrospective structure
HeroWork indexCapabilities
基于早期源码整理重新整理第一屏
这一阶段开始减少Hero里的内容，同时重新安排作品入口，并处理窄窗口下的重叠问题。
人物 + 产品预览
人物成为主要视觉，LootPilot和ShadePilot缩成辅助预览；手机端直接去掉浮动卡片，优先保证正文和人像。
前两个阶段用结构复盘图呈现信息关系，当前阶段使用真实首页截图。
06 · Responsive system
桌面版好看不够，窗口一缩也不能散架。
最明显的问题出现在窗口变窄以后：左侧文字会继续收缩，但人物和浮动卡片还停在原来的位置，两边很快就会分开。后来把文案、人物和几个浮动元素放进同一个响应式布局里，让它们一起变化。
保留人物、两张产品卡和 Decision 的完整关系。
整体收紧右侧视觉组合，而不是单独移动每一张卡。
改成上下布局，文字在前，人物视觉在后。
隐藏浮动项目卡，只保留核心文案和人物。
Decision
人物和浮动卡片一起响应，不再逐张补位置。
Why · 原来的文字和右侧视觉不是按同一套布局变化，所以窗口变窄后会直接分开。
Impact · 现在从宽桌面缩到平板和手机时，Hero 会逐步从双栏变成单栏，不会再出现文字留在左边、人物掉到右下的问题。
07 · Editing as design
能删掉的说明就删掉，把位置留给真正影响判断的信息。
这一轮改动里，很多提升其实来自删东西，而不是继续往页面里加内容。
减少重复身份说明
AI、Human-led / AI-assisted 等说明不再在首页、About 和 Resume 反复出现，只在真正需要解释的地方保留。
把项目细节放回项目页
首页只保留结果和入口；OCR、性能、DPI、用户反馈和版本过程留在 LootPilot、ShadePilot 的 Case Study 里。
统一个人实践身份
Pilot Studio 统一写成“个人独立产品实践”，不再使用容易被理解成正式公司的表达。
去掉重复的身份卡
姓名、职位和主标题已经能说明身份后，额外的 Profile / Identity 卡只会重复信息，所以直接删除。
Before
职位标签太多
Evidence 重复
AI 说明重复
After
一个主身份
两个核心作品
项目细节回到 Case Study
08 · Result / current system
现在打开网站，可以更快看懂我是谁、做过什么。
现在这个网站已经正式上线，并会随着新项目和经历继续更新。
统一主定位
首页、About 和 Resume 统一使用“产品设计师”，AI 不再作为职位名称出现。
阅读顺序更清楚
先看定位，再看 LootPilot 和 ShadePilot，之后再进入能力、经历和简历。
不同屏幕都能正常阅读
宽桌面、窄桌面、平板和手机使用同一套内容，并分别调整布局；Light / Dark 保持相同的信息结构。
正式上线
首页、Work、三个数字案例、传统设计、Resume 和主要项目链接都可以独立访问。
Technical appendix
实现
Astro 静态路由、共享组件、Tailwind CSS，以及 Light / Dark 与 Responsive 系统。
AI 协作
AI-assisted implementation 用于快速实现、CSS 调试、响应式施工与验证。
历史依据
关键阶段参考 Git 提交记录和早期源码；无法确认的内容不写入正文。
指标边界
LootPilot / ShadePilot 的点赞、收藏和 GitHub Stars 属于对应产品的公开反馈，不作为 Portfolio 访问量或用户指标。
Decision
这个网站会继续更新，而不是做完就停在这一版。
- Why
- 作品和经历会继续增加，如果每次新增内容都需要重新设计首页，这套结构就没有意义。
- Change
- 首页、Work、Case Study、主题和媒体都使用共享组件；新增项目时沿用现有结构即可。
- Result
- 现在它同时负责展示个人信息、整理作品入口和承载完整案例，新项目也可以继续往现有结构里增加。