文章為58招聘自助商城的改版總結(jié)，希望從這份總結(jié)中你可以有所收獲。

首先，向大家介紹一下本次改版的項(xiàng)目——58招聘自助商城。什么是招聘自助商城呢？它是提升招聘效率，減少人員成本的線上自助化會(huì)員套餐售賣平臺(tái)。簡(jiǎn)單來(lái)說(shuō)，就是招聘自助商城可以幫助用戶快速招到好人才。

改版原因?

舊版商城模塊只做了一個(gè)簡(jiǎn)單的購(gòu)買頁(yè)面而沒(méi)有商城屬性，并且用戶體驗(yàn)較為刻板，有部分bug需要修改?，F(xiàn)需對(duì)商城進(jìn)行豐富優(yōu)化，讓用戶提高產(chǎn)品感知和產(chǎn)品認(rèn)識(shí)，提高用戶操作效率，方便監(jiān)控用戶行為。最終提煉改版關(guān)鍵字：商城屬性與操作效率。

針對(duì)關(guān)鍵字聚焦改版思路，擬定改版三部曲：

• 發(fā)現(xiàn)問(wèn)題：舊版商城轉(zhuǎn)化率一直比較低迷，是邏輯問(wèn)題還是界面展示有什么問(wèn)題？在視覺(jué)方面會(huì)給用戶帶來(lái)什么的體驗(yàn)困擾；
• 分析問(wèn)題：從流程和布局分析用戶在使用場(chǎng)景中的心理狀態(tài)是什么樣子的？依據(jù)這些能夠清晰的分析出問(wèn)題所在；
• 設(shè)計(jì)方案：優(yōu)化體驗(yàn)，使用戶體驗(yàn)更加流暢，提高用戶操作效率，希望用戶能在最短的時(shí)間里對(duì)招聘自助商城有快速的了解。

發(fā)現(xiàn)問(wèn)題

首先看看舊版有哪些問(wèn)題？

• 框架布局亂：舊版采用左右結(jié)構(gòu)，商品信息和支付信息混雜在一起，視覺(jué)動(dòng)線雜亂，影響用戶操作；
• 操作次數(shù)多：讓用戶一直在做篩選，沒(méi)有呼吸感，同時(shí)在操作上被打斷次數(shù)也比較多；
• 信息無(wú)層次：信息平鋪，閱讀成本大。

調(diào)整后的新版界面框架圖如下：

模塊清晰，視覺(jué)流暢。整個(gè)列表頁(yè)分為五個(gè)模塊，分別是運(yùn)營(yíng)區(qū)、篩選區(qū)、商品區(qū)、客服區(qū)以及頁(yè)碼區(qū)，從原型圖的劃分上不難看出商城的商品是最重要的信息

分析問(wèn)題

商品是靠用戶來(lái)消費(fèi)的，所以接下來(lái)看看招聘自助商城究竟針對(duì)哪些人群？只有了解用戶訴求，才能推動(dòng)設(shè)計(jì)方案更加精確的產(chǎn)出。招聘自助商城主要針對(duì)于兩種人群，第一種是企業(yè)Boss，第二種企業(yè)HR人員，他們的購(gòu)買特點(diǎn)就是招聘周期短和花錢較少。

針對(duì)對(duì)購(gòu)買用戶的大致了解，下邊制定購(gòu)物場(chǎng)景。當(dāng)用戶在特定的購(gòu)物環(huán)境里會(huì)有怎樣的心理？
首先，通過(guò)線下購(gòu)買場(chǎng)景模擬線上購(gòu)物場(chǎng)景，線下商城或超市的核心賣點(diǎn)是商品本身，那么線上自助商城也是同理，我們需要做到的是不管是線上，還是線下的商品它們都要具備自我營(yíng)銷的能力。其次，模擬線下用戶到商場(chǎng)購(gòu)買商品的場(chǎng)景，當(dāng)用戶挑到自己滿意的商品會(huì)先關(guān)注商品的價(jià)格，之后會(huì)看是否有優(yōu)惠，最后是看商品的核心賣點(diǎn)。

設(shè)計(jì)方案

通過(guò)線下購(gòu)物場(chǎng)景還原線上商品本質(zhì)，我們需要突出商品賣點(diǎn)，所以本次改版針對(duì)自助商城的商品卡片進(jìn)行打散再重組，使其突出賣點(diǎn)，抓住用戶心理訴求，使用戶在有限的時(shí)間里可以將注意力更集中在商品信息上。

重新組合的卡片信息分為四個(gè)層面，分別是運(yùn)營(yíng)信息（套餐主文案與賣點(diǎn)文案）、價(jià)格信息（主價(jià)格與優(yōu)惠價(jià)格）、商品檔位（時(shí)間標(biāo)簽區(qū)分）與輔助信息（多少人想買），最終實(shí)現(xiàn)以下效果：

同時(shí)通過(guò)不同色相的標(biāo)簽潤(rùn)滑一下用戶枯燥的心理，最終打造出全年、半年、季度的商品。

關(guān)于配色：

由于本次改版只針對(duì)于列表頁(yè)與詳情頁(yè)進(jìn)行改版，剩余支付功能未做改變，所以在配色方面還是以藍(lán)色為主，商務(wù)藍(lán)看起來(lái)比較沉穩(wěn)和安全性比較強(qiáng)。并且保持列表頁(yè)與支付頁(yè)的統(tǒng)一性。

最終呈現(xiàn)出來(lái)的列表頁(yè)：

項(xiàng)目上線成果：

上線之后提單率提升25.8%，并且提前完成了2017年的年度任務(wù)。

總結(jié)?

設(shè)計(jì)的工作恰恰是在有限的時(shí)間和格局里進(jìn)行突破，創(chuàng)造出屬于事物本身的場(chǎng)景感。從始至終參與整個(gè)招聘自助商城的項(xiàng)目，除了對(duì)產(chǎn)品界面思考之外，更多的是和部門之間的溝通和協(xié)作能力，在溝通的工作中不斷的完善用戶體驗(yàn)，使其流程更加流暢。

作者：田曉紅，視覺(jué)設(shè)計(jì)師

本文來(lái)源于人人都是產(chǎn)品經(jīng)理合作媒體@58用戶體驗(yàn)設(shè)計(jì)中心（微信公眾號(hào)@58UXD），作者@田曉紅

題圖來(lái)自Pixabay，基于CC0協(xié)議