58PC职位详情页改版：深入用户，“职位”升级再升级

招聘，作为58的主营业务之一，为上亿用户提供了便捷的求职服务。随着业务属性与用户需求的升级，本着给用户最佳的体验为核心，旧版的58PC职位详情页已无法满足用户的诉求，因而需对PC详情页进行功能及页面的整体体验升级。

改版背景

旧版58PC职位详情页样式比较陈旧，在业务日益升级的过程中，在原有页面中添加了许多功能及类目，使得整体页面内容拥挤、功能不突出、分类不清、逻辑相对混乱、阅读成本过高。由此，我们希望通过对业务内容的重新梳理与归类，将详情页在业务形态需要及重用户体验的方向进行重新设计。

旧版职位详情页

分析用户 定义详情

在设计之初，我们需提出几个问题，来确定改版的方向和目标。用户是谁？用户想要什么？改版希望达到怎样的目的？从业务层面来讲，希望达到怎样的效果？

用户分析

通过对用户的分析及对业务需求的了解，用户大概归类为两种诉求身份，即，用户是蓝领的同时还是求职者。

• 蓝领：是指为城市日常运转贡献力量的基层工作者，包括销售、保安、美容美发师、快递员等职业人群，普遍来讲文化程度较低，对信息的接收能力相对较弱；
• 求职者：需考虑其心理状态和求职场景。求职者在面对众多职位信息的时候，可能会产生焦虑情绪与选择困难的情况。

从业务层面来讲：

• B端用户（各招聘企业）：详情页能够提升自己的品牌形象，提高对求职者的吸引力；
• C端用户（求职者）：提高用户的浏览效率，减轻阅读成本，提高转化效率。

以上，我们对于设计的方向与目标清晰明了了：用强逻辑、清晰化的信息展示，重用户体验方向的设计，提升页面可读性与实用性。

设计目标

因此，我们的详情页希望做到：简单、快速、流畅

1. 简单：简洁明了，对信息一目了然
2. 快速：福利与薪资等用户较关注的核心信息，能够一目了然的呈现，帮助用户在选择职位时能够清晰对比，助其快速选择
3. 流畅：操作简便，流畅，在查看繁多的信息时，无需在操作方面进行过多的思考

职位详情页优化过程

体验内容 打磨设计 职位升级，一期启用

在根据业务需求与页面信息整理后，结合用户类型及特点，整个页面通过卡片的形式将内容区分开来，将信息的划分更加清晰明确，从形式上为用户将信息逻辑梳理开来。

一期的职位详情页如下：

一期改版页面

综合对比数据反馈，明确优化目标

在第一版上线过后，通过一个月的灰度测试，数据有了非常明显的变化。

对比旧版详情页，三个核心转化的指标均有较大的提升。

一期数据反馈

根据线上数据反馈，综合对比功能可行性，深入分析了用户的浏览轨迹与除将功能优化升级的同时，对于页面整体的布局也进行了优化。

优化如下：

（1）在主要基础职位信息区域将福利icon缩小

通过上线后的数据反馈，有很多企业的福利能够到达十个，一期的icon会出现折行的情况（当时反馈十个icon同时出现的情况较少）。

（2）将次要功能弱化及归纳，为主要功能导流

一期的职位收藏功能在申请职位button旁，通过上线数据了解到，目前收藏功能位置较为核心，但用户的使用率较低，因此将收藏、分享、举报等次要功能统一归纳到了右上角部分。

主内容区优化

（3）优化地图功能
将地图功能与工作地址合并，并优化功能，可详细显示路线，并可将路线进行APP及微信引导，更加方便的为用户提供路线服务。

地图功能

（4）增加资讯（58便当）、职位问答及申请记录功能

其中，申请记录功能（即，用户可查看此职位有多少人投递及其投递状态）在新版中认为是非主要功能而去掉了。但根据数据反馈，考虑到用户心理：对于投递者较多的职位更加放心，认为此职位真实有效，因而用户对此功能产生了依赖心理。

上线页面与设计稿的磨合 发现问题，优化设计

在设计的过程中，通常会把页面的各种状态进行预想并输出设计稿，以衡量设计是否可行。但是由于业务的复杂性，以及用户填写内容的机动性，仍有很多状态无法预估到，部分上线页面的部分状态呈现效果差强人意。

因此，通过对灰度上线的页面进行的走查，发现了一些在设计过程中的未预想到过的问题：

在设计中将每个模块分为一个卡片，能够使内容分割清晰明了。

但在上线页面中，有许多公司填写的职位描述与公司介绍非常短，导致此类别的卡片面积较小，在浏览的过程中，卡片反而喧宾夺主，分割感阻断用户的流畅阅读。因此对于此部分进行设计尝试，优化页面。

对于使用白底平铺还是色块分割进行了再次尝试。

横向对比招聘与其他业务线的详情页，如房产，招聘与其有较大区别。招聘的详情页以文字信息为主图片为辅，字段的长短无法控制，如用平铺形式则使信息呈现较为分散、混乱，无法很好的区分出信息的类别区域；而房产和二手车的详情页以图为主字为辅，块面感很强，大部分的图能够自发划分出区域。

白底平铺样式

因而在优化版面形式上，依旧延用了卡片式。但是将信息类别进行划分，同类别的信息在一卡片中，用间隔及与平台规范相符的button作为分割，这样的信息呈现则更加流畅。

优化效果示意图

目前二期页面刚上线，部分功能还在开发过程中，还未有数据反馈，我们会持续跟进页面效果。

二期优化样式

结语

职位详情页的改版优化还在继续，职位升级是我们为提升用户体验做出的一小步，深入用户是我们要持续长久做下去的事，作为能够帮助无数蓝领找到合适工作的我们，期望能够让所有复杂的内容简单化，让体验更加的简便实用，给予用户最佳的感受。我们会持续根据用户反馈，数据反馈及我们的设计师的专业技能，不断的打造出用户体验越来越好的产品。

感谢所有参与过这个项目的小伙伴们～

作者：温磊，UI设计师

本文来源于人人都是产品经理合作媒体@58用户体验设计中心（微信公众号@58UXD），作者@ 温磊