起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識設計沉思錄：「薪資大揭秘」H5項目總結
一次H5項目的設計總結，其中不乏一些可以借鑒學習的點，希望對你有益。
?項目背景
『薪資大揭秘』活動上線前，58招聘業務線下屬某產品運營活動模式較單一，微信關注量較少，為了增加微信活躍度，將老用戶分組， 便于后期精細化運營。那么對于不經常關注的用戶來說，一個有趣的H5形式的活動，肯定會吸引這類用戶參，于是“薪資大揭秘”油然而生。
?前期風格推導
項目初期，在了解了活動背景后，我們進行了頭腦風暴，對該H5的風格進行了推導，并歸納總結出四個關鍵詞：文藝、風格、幽默、走心。
根據關鍵詞的引導，我們又看了一些同品類及相關的H5視覺，分析了其表現手法與風格，找出了幾款比較有代表性的方案。確定了手繪風格。因為是如今傳達感情慣用手法之一，我們覺得手繪能較好的表達出情懷。
眾所周知，薪資不是隨便能問的，多數人都是談錢色變，那么，如何用手繪的形式輕松的將“薪資”這個沉重話題，輕松化處理呢？帶著這個問題，更深入細致的探討了一些具體執行方案。與對風格定位，走可愛風，還是擬物風，其實主要取決于你想要表達什么。于是，我們摒棄了以往的寫實風，游戲風，采用了圓珠筆手繪風。我們覺得圓珠筆這種手繪風格它的記憶點多一些，而且比較有質感和年代感，它的紋理就很隨意，讓人感覺很輕松，會讓人想到上學時語文書上各種涂鴉，從而把“薪資這個沉重話題輕松化”。
結構梳理
確定了設計風格后，我們梳理了一下整個H5的層級和交互頁面邏輯，縱觀整個活動原型，我們把H5活動頁面大致歸納出5部分：loding頁、測試頁、估值頁、測試結果頁和二維碼頁面。
根據測試結果，本次嘗試了兩個方向展示：
- 圍繞職位的縱向結果為導向，主打職業特色風格來展示；
- 橫向5種結果為導向結果之上。
經討論和調研，多數人對測試類的活動，還是比較在意其測試結果，而并非職業特點。所以最終我們還是采用以結果為導向方案，職業特性加之氣氛烘托和點綴。
角色設定
我們根據吃穿住用行歸納總結出，各行業、各結果的關鍵詞，從而推出我們人物角色設定和結果頁的表現方式。
按測試結果：
- 屌絲：沒人愛、吃土，落葉、泡面、補丁、窮
- 奮斗青年：正能量、熱血、獨立、打雞血、爆發、拳擊手套、小喇叭
- 逼格青年：小資、文藝、coffee、麗江、小提琴、相機
- 中產階級：life、品質、買買買 、mini、調性、悠閑
- 土豪：主要看氣質、有錢任性、出境游、大捆錢、大金牙、大金鏈子、鉆石、約么
按職業提取元素：
- 物流：快遞員、快遞車、紙箱、快遞袋、快遞車、紅綠燈、小太陽、秤砣、電子秤、天氣
- 銷售：出租車、禮物、數據圖、KPI、合同、印章、筆、手提包、公文包、計算器、電話、郵件。
- 普工：錘子、安全帽、鉗子、板刷、工具箱、錐子、
- 服務員：飲料、盤子、端盤子、圍裙、西式餐廳帽、馬卡龍、菜、菜單、
- 客服：電話、耳麥、電腦、郵件、網絡、聲音符號、對話icon
- 導購：口紅、眼影、工卡、女鞋、購物小票、打折信息、價格、計算器、VIP
比如屌絲因為“沒人愛”，所以他是沮喪的，不高興的；因為“窮”，所以給他打滿補丁。奮斗青年則是激昂的，沒跟頭發都散發著熱情；再比如，土豪形象，就給他鑲上了大金牙，帶上金鏈子，讓他悠閑地坐在沙發上抽煙。
設計實現
以物流行業為例：首先，我們將結果頁提取的關鍵詞進行模版化處理，然后，我們提取了物流行業相關的視覺元素，如快遞車，膠帶，快遞袋，紅綠燈等等，并運營了換衣秀的方式覆蓋各行業，使答題結果頁面更加精細化和走心。
相關數據
活動上線前微信日活量為8%左右，活動上線后微信日活大幅度提升了32%左右的成績。我們在今后的設計生涯中，應沉淀一下用戶的關注點，什么角度能夠更加吸引用戶，跳出固有思維，做更有趣的設計。
本文來源于人人都是產品經理合作媒體@58用戶體驗設計中心（微信公眾號@58UXD），作者@ 劉瑒
求地址觀摩一下