小互 AI 学院
← TRAE Work 实战:从杂乱简历到可运行的招聘工作台 第 3 章 · 3.2
课程地图0/12
TRAE Work 实战:从杂乱简历到可运行的招聘工作台当前:Design 第一单:把页面说明变成三个看得见的设计方案
跟做课30 分钟

现在要解决

Design 第一单:把页面说明变成三个看得见的设计方案

打开工具,照着完成这一单。一次只做当前动作。每一步都告诉你在哪里操作、应该看到什么,以及看不到时怎么处理。

做完后,你会留下三个招聘工作台方向 + 选定原型 + 设计选择说明.md
开始跟做 →4 个学习动作

第 3 章 · 问题 2:第一版原型不一定是最好的一版

如果只说“做得专业一点”,Design 可能给你一张漂亮但不好用的图。怎样一次看三种方向,再用任务现场选?

知识库的产品经理案例明确建议:先搭核心面板,再一次生成 3 版交互逐个比较。选择理由要回到用户任务,而不是“我比较喜欢这个颜色”。

01先体验三种信息组织方式

DIRECTION A · 推荐

先让负责人看清“今天要决定什么”

上方是待决定事项,中间是候选人进展,右侧是缺资料与待安排,更贴合招聘周会。

招聘运营工作台本周决定 · 候选人漏斗 · 待办与风险

02要求三版真的不同,而不是只换颜色

DESIGN · 三个可比较的原型

请读取 01_Work成品/三模式交接单.md,为“招聘运营工作台”生成 3 个差别明显、可比较的页面方案。A 围绕每周招聘会议:先展示本周要决定的事;B 围绕数据分析:先展示招聘漏斗和岗位分布;C 围绕逐人跟进:先展示候选人卡片和下一步。

每版都要有:顶部概览、候选人列表、岗位或状态筛选、资料缺失提醒、面试待办、来源与更新时间。展示桌面和手机布局思路。联系方式必须脱敏;未确认薪资和到岗时间不能伪装成确定值;先生成完整预览和选择理由,不写代码。

03用 5 个真实问题评审,不看“高级感”

  1. 10 秒内能看出今天先处理谁吗?如果不能,层级就不对。
  2. 缺失和歧义是否醒目但不喧宾夺主?不能把未知藏到脚注。
  3. 三个方案的信息结构是否真的不同?只换颜色不算三版。
  4. 手机上还能完成筛选和查看下一步吗?不是把桌面缩小。
  5. 是否守住隐私和事实边界?不展示完整联系方式,不出现假录用结论。

04选定 A 后,把理由和规则写成 Code 看得懂的文件

DESIGN · 收口与交接

采用 A“招聘周会”方向。请根据评审调整:首屏先显示 3 个待决定事项;候选人列表支持岗位和状态筛选;缺资料使用明确标签;手机端单列;所有联系方式脱敏。

把最终选择、放弃 B/C 的原因、页面模块顺序、状态颜色含义、桌面与手机规则、交互说明、仍待确认内容,保存为 02_Design成品/设计选择说明.md。重新打开并列出 Code 必须遵守的 8 条要求。

知识库依据《由需求直接生成原型图》与产品经理 60+ 轮迭代案例 ↗直接使用“多版方案比较、三块核心面板、可切换场景、继续迭代、写清交付清单”的原始方法。
Design 已交付你不是得到一张“好看图片”,而是得到三版可比较方案和一份有理由的最终选择。

下一课让 Code 只按选定方案创建真实网页,并实际点击检查。

下一课:Code 做可点击网页 →

最后验收

不要只确认“AI 说做完了”,请打开真实结果检查。

三个招聘工作台方向 + 选定原型 + 设计选择说明.md