您的位置:首頁>設計>正文

設計沉思錄:B端簡歷樣式改版總結

偷聽兩個HR妹子私聊引發的設計Case。

改版背景

中華英才網作為白領招聘方面的先驅者, 對建立完備的簡歷庫是很重視的, 而英才的簡歷作為其招聘業務的主要吸引點,

一直是我們主要在挖掘的東西, 對B端用戶來講, 其中主要包括簡歷的品質、簡歷詳情頁的設計樣式。

從設計的角度來講, 簡歷的樣式以及使用者體驗是我們需要著重去考慮的, 由於目前B端、C端的簡歷詳情頁樣式是一致的, 且從拓展性上來講, 目前的佈局略顯不足, 基於此, 我們對B端簡歷樣式進行了改版。

舊版b端簡歷詳情頁樣式

舊版問題 頁面配置的問題導致操作區域不利於拓展;簡歷資訊展示以及區分不明確, 內容區文字顏色單一;部分內容展示不合理(如標籤部分, 作為可操作的區域, 卻放在以查看為主的簡歷內容區, 並且位置太過靠後, 容易被忽視)。 用戶及需求分析

在改版之前, 我們要明確幾個問題:我們的用戶是誰?用戶的主要訴求是什麼?我們能帶給用戶什麼?改版後希望能夠達成什麼目標, 從而在業務層面和邏輯層面進行分析。

用戶分析

通過對用戶群體的分析和業務需求的瞭解, 我們能夠瞭解到, 由於是面向B端的簡歷詳情頁用戶大多都是企業的HR, 而目前企業HR的主要工作就是為所在企業提供人力資源方面的配給和徵召, 通俗來講, 我們的用戶——企業HR與中華英才網的直接接觸就是去查看各種簡歷, 而通過和部分HR溝通, 我們發現, 目前他們的剛需是在每天大量的查閱簡歷的過程中,

盡可能快地獲取所需要的投遞者的簡歷資訊, 快速地知悉該簡歷是否符合所招的職位要求。

回溯之前一次偶然的親身經歷, 某次在坐地鐵歸家途中, 身邊站著兩位貌似企業HR的妹子, 就在我身邊大吐各大招聘企業的B端簡歷流覽與操作中的槽點, 其中談論最多的一點就是不夠方便快捷, 當企業HR進行招聘任務操作時, 每天要流覽大量的簡歷, 他們希望在一屏內能夠看到更多的資訊, 能夠讓她們在最快的時間內對簡歷做出判斷, 在談論此事的過程中, 他們還不時地發出讚歎和埋怨, 這是一次完全偶然的路人對話, 以此管中窺豹, 讓我更貼近了用戶的需求, 設計上也能直擊用戶的痛點。

設計目標

制定並達成設計目標

通過對使用者需求的分析以及舊版的不足, 我們制定出三個設計目標並總結為三個詞:快速、清晰、延展性, 現在具體分析一下這個三個詞。

快速:企業HR在使用過程中能夠快速的查閱一份簡歷中有用的資訊, 並快速完成後續操作;清晰:整體頁面的內容以及功能展示清晰明瞭;延展性:合理分佈內容展示區域, 擴大內容展示以及設計上的可延展性。

其實以上這三點都是互相結合缺一不可的。

佈局結構圖對比

通過明確的區塊化來使內容區域更加清晰,頭像及主要個人資訊區域採取左右佈局,比之前採用的上下佈局要節省一些空間,能讓用戶在首屏內看到盡可能更多的內容。簡歷資訊內的各項內容標題用不同顏色的區別來著重突出,使得內容之間的區隔明確。所有內容的標題文字顏色弱於內容的文字顏色(如:求職意向內、教育經歷),著重突出內容,每行內容之間的間距縮小,通過這樣的設計手法來引導HR能夠更快地看到主要內容。

新版B端簡歷詳情頁頭部區域

由於使用者在填寫簡歷時的自由度較高,除必填選項外,其他非必填選項實際的填寫變化會比較大,那麼頁面的佈局將受到較大影響,分清區域以及主次資訊的擺放能在一定程度上降低頁面的跳躍感。

將簡歷操作區域從舊版的始終懸浮在螢幕下方的條狀操作按鈕區,改變為始終懸浮在螢幕右側作為專門的懸浮操作區域,將標籤等對簡歷的操作內容統一集合在一處,便於使用者直接看到與操作,從佈局和使用習慣上來講,這樣也會提高用戶的使用效率,並且使整體頁面操作的可延展性擴大。新增測評報告內容,加入可切換的TAB區便於主體內容的切換和延展。

新版B端簡歷詳情頁_簡歷資訊區域

B端簡歷詳情頁底部區域

結語

目前改版還在不斷探索新的思路並進行更深入的用戶分析,當然還存在一定的問題,例如,簡歷內容區域的資訊還可以繼續整合,在用戶簡歷填寫較少時會顯得頁面左重右輕,這些都是需要和產品以及交互同學再次溝通且不斷探索的,B端簡歷詳情頁的改版只是我們不斷探索完善的一小部分;解決痛點是我們一直要堅持的事,期望通過我們不斷的探索和持續優化,讓體驗變得更加便捷,能夠幫助求職者找到心儀的工作,幫助企業找到適合的員工是我們最終的使命。

在此也感謝所有為項目付出的同學們~

作者:周奕鳴。視覺設計師

本文來源於人人都是產品經理合作媒體@58用戶體驗設計中心(微信公眾號@58UXD),作者@ 周奕鳴

題圖來自Pixabay,基於CC0協議

擴大內容展示以及設計上的可延展性。

其實以上這三點都是互相結合缺一不可的。

佈局結構圖對比

通過明確的區塊化來使內容區域更加清晰,頭像及主要個人資訊區域採取左右佈局,比之前採用的上下佈局要節省一些空間,能讓用戶在首屏內看到盡可能更多的內容。簡歷資訊內的各項內容標題用不同顏色的區別來著重突出,使得內容之間的區隔明確。所有內容的標題文字顏色弱於內容的文字顏色(如:求職意向內、教育經歷),著重突出內容,每行內容之間的間距縮小,通過這樣的設計手法來引導HR能夠更快地看到主要內容。

新版B端簡歷詳情頁頭部區域

由於使用者在填寫簡歷時的自由度較高,除必填選項外,其他非必填選項實際的填寫變化會比較大,那麼頁面的佈局將受到較大影響,分清區域以及主次資訊的擺放能在一定程度上降低頁面的跳躍感。

將簡歷操作區域從舊版的始終懸浮在螢幕下方的條狀操作按鈕區,改變為始終懸浮在螢幕右側作為專門的懸浮操作區域,將標籤等對簡歷的操作內容統一集合在一處,便於使用者直接看到與操作,從佈局和使用習慣上來講,這樣也會提高用戶的使用效率,並且使整體頁面操作的可延展性擴大。新增測評報告內容,加入可切換的TAB區便於主體內容的切換和延展。

新版B端簡歷詳情頁_簡歷資訊區域

B端簡歷詳情頁底部區域

結語

目前改版還在不斷探索新的思路並進行更深入的用戶分析,當然還存在一定的問題,例如,簡歷內容區域的資訊還可以繼續整合,在用戶簡歷填寫較少時會顯得頁面左重右輕,這些都是需要和產品以及交互同學再次溝通且不斷探索的,B端簡歷詳情頁的改版只是我們不斷探索完善的一小部分;解決痛點是我們一直要堅持的事,期望通過我們不斷的探索和持續優化,讓體驗變得更加便捷,能夠幫助求職者找到心儀的工作,幫助企業找到適合的員工是我們最終的使命。

在此也感謝所有為項目付出的同學們~

作者:周奕鳴。視覺設計師

本文來源於人人都是產品經理合作媒體@58用戶體驗設計中心(微信公眾號@58UXD),作者@ 周奕鳴

題圖來自Pixabay,基於CC0協議

Next Article
喜欢就按个赞吧!!!
点击关闭提示