# 招聘平台设计：职位卡如何贯穿申请与聊天

原网页：https://www.jvds.cn/share/ui-design/career-go-application-context-u032
语言：zh-CN
发布：2026-10-12
作者：界达设计工作室（JVDS）

Career GO这套招聘平台设计，把岗位信息反复留在需要判断的位置。申请列表有职位卡，聊天顶部还有岗位条。紫色只强调当前栏目、选择和自己发送的消息，读者可以沿着职位继续处理申请，而不必只凭联系人头像记住是哪次沟通。

## 核心结论

- 阶段标签用于缩小范围，职位卡继续保留公司、地点与工作条件。
- 聊天的岗位摘要让联系人与具体申请形成可见关系。
- 浅色资料页与弹层共用紫色操作规则，真实内容一致性仍需逐项校对。

## 状态标签下面，职位身份还在

My applications页先展示申请数量摘要，再把Offers、Under Review、Chat Negotiations和Interview等阶段排成一行。标签简短，卡片却没有变成只有状态的一串记录，仍显示岗位、公司、地点和薪资范围。

职位名采用较重文字，薪资用紫色，工作方式和经验要求则是小标签。阅读有明显顺序：先认出哪份申请，再看它的条件。Offer卡底部同时有红色Reject和绿色Accept，决定对象仍在按钮上方，很容易重新核对。

界达设计认为，重复职位身份在这里并不多余。处理多份申请时，状态可以相同，公司与岗位却不同。[确认接受或拒绝](https://www.jvds.cn/share/ui-design/destructive-action-confirmation-undo-ux)的下一步也应重复这个摘要，让快速操作时仍有机会检查。顶部接受率只是图中的示例，不能当成平台或个人真实表现。

![Career GO申请页：上方数量摘要与阶段标签，下方职位公司地点薪资卡，Offer卡带红绿按钮](https://www.jvds.cn/upload/2026/1008/d187-tp/u032-i1.webp)

申请页中部｜阶段筛选改变范围，职位资料继续留在卡片里。

## 聊天在人物之下，再加一条岗位线索

聊天布局分成联系人列表和会话区。左边用头像、姓名和最近消息组织联系，选中行铺浅紫；右边顶部先显示联系人，再放Product Designer、Design Studio Pro和Response sent岗位条。人和岗位各有位置，关系比单靠头像明确。

消息气泡用灰色与紫色区分，附件以缩略图出现在正文旁，输入框和发送按钮留在下方。紫色贯穿导航与自己的消息，读者能识别当前位置，也能看出对话里哪一侧是自己的表达。

若同一联系人处理多个岗位，还可以让岗位条切换或返回对应申请。静态图不能确认附件归属与切换规则，但现有位置已经提供了很好的基础。类似招聘聊天界面不宜只沿用通用即时通信模板，岗位这个任务对象值得单独保留。

![Career GO页面拼图：发布职位页、右侧联系人聊天与顶部岗位摘要，下方为申请卡](https://www.jvds.cn/upload/2026/1008/d187-tp/u032-i2.webp)

聊天窗口右上方｜联系人下增加岗位条，把会话对应到具体申请。

## 同一套紫色，让资料编辑容易认出来

资料页头部留出浅紫横幅，头像、姓名和行业放在左侧，下方公开简历用两张卡排列。编辑弹层回到白底，姓名、年龄、性别与行业字段纵向展开，主按钮使用紫色，Skip为浅紫。页面和弹层的任务不同，操作强弱却保持一致。

Age和Gender后面明确标optional，是一个具体好细节。用户能知道哪些资料不是本步必填。进一步可以在保存前说明[显示范围](https://www.jvds.cn/share/ui-design/app-privacy-design)，让填写与公开之间有清楚的预期。

图中的资料人物、年龄与简历卡存在不一致，匹配比例也没有展示计算依据。建议先用一位人物校对整套资料，再解释匹配标签的范围。角色切换同样要同步更新页标题与动作名称，不能仅在侧栏底部换一个选中背景。

![Career GO申请人资料页与Profile Data弹层：头像姓名、两张简历卡、可选年龄性别和紫色继续按钮](https://www.jvds.cn/upload/2026/1008/d187-tp/u032-i3.webp)

资料页与弹层｜字段要求写在标签里，主次操作沿用紫色规则。

## 常见问题

### 招聘聊天为什么需要岗位摘要？

一个联系人可能涉及多次投递或多个岗位。把公司与职位留在会话上方，有助于确认附件和回复属于哪份申请；具体切换规则仍要另外设计。

### 求职者与雇主能共用导航吗？

可以共用视觉框架，但栏目名和操作需对应当前身份。申请、发布和候选人处理各有对象，切换后应让页面标题也说清楚。

## 设计检查清单

- 从任意状态卡说出公司、职位和下一步动作。
- 进入聊天后再次核对岗位与公司。
- 用同一份人物资料校对头像、姓名、年龄与简历内容。

## 招聘产品需要整理申请与沟通？

如果你的平台同时处理职位、候选人和会话，可以先梳理这些对象的关系，再安排状态与页面。界达设计欢迎你带着现有流程讨论UI/UX、网站设计与开发。

界达设计工作室（JVDS）提供UI/UX设计与网站设计、开发服务。

[联系界达设计，聊聊你的项目](https://www.jvds.cn/contact)