中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

為了在“金三銀四”搶占先機，向本站導(dǎo)流，最重要的，是為了向廣大藍領(lǐng)招聘群體營造有趣、可信的平臺，輸出趕集優(yōu)秀的設(shè)計價值和體驗，我們3個設(shè)計師進行了各個維度的配合。

項目背景

不論從人員流動，還是公司調(diào)整，亦或是市場行情來看，歷年的三、四月份都是求職的黃金期，即所謂的“金三銀四”。該段時間也是求職類網(wǎng)站全年中流量爆發(fā)和搶占市場的黃金期。為了滿足用戶節(jié)后返城求職的需求，趕集網(wǎng)在年前策劃了“2017年春季招聘節(jié)”，這也成為藍領(lǐng)和廣大求職者新的一年中尋找機會的開年大餐。

2017年度趕集招聘節(jié)主打職位多、類目全。因涉及的行業(yè)范圍較廣，最終確定以“主會場+分會場”的形式來承載各個類目的招聘企業(yè)。為了讓不同求職目標的用戶精準的找到自己所需行業(yè)的職位，最終確定了8大類行業(yè)作為分會場，其中涉及112個精選類目。

視覺風(fēng)格確定

由于本次活動前期準備（項目定位，涉及商戶的交涉及其他策劃事宜）流程較長，接到成型需求后所剩時間有限。在和產(chǎn)品同學(xué)多次溝通后，我們明確了產(chǎn)品的主要訴求：熱鬧有年味→招聘類目全／職位多→代言人露出以烘托氛圍的初步構(gòu)思。（2017年趕集網(wǎng)更換了新的代言人——SNH48，希望增加曝光）

趕集網(wǎng)作為一個本地服務(wù)類的網(wǎng)站，C端用戶人群主要集中在95后新藍領(lǐng)，他們是接觸新事物成長起來的新人類，喜歡潮流和跟風(fēng)，但又對復(fù)古逆潮流而動的事物充滿好奇。所以在風(fēng)格設(shè)定上，我們可以引入90年代復(fù)古的游戲設(shè)計元素，再結(jié)合95后人群的特點：活力、個性又好玩，色彩上先聲奪人，鮮艷奪目。

相信大家在學(xué)生時代都被吉卜力的電影——《哈爾的移動城堡》感動過，那充滿了魔法與神奇的城堡不剛好契合了趕集網(wǎng)神奇集市的特性嗎？結(jié)合我們的項目，在多次溝通后我們確定了設(shè)計方向：為招聘企業(yè)和求職者打造吸引人們駐留探索的“招聘之城”。

《哈爾的移動城堡》中的城堡場景

幾乎所有網(wǎng)吧必裝的PC游戲——《紅色警戒》

主體場景繪制

Step1 確定2.5D的場景風(fēng)格

想要打造一座招聘之城并不簡單，由于時間的緊迫，技術(shù)條件以及設(shè)備的限制，我們選擇用2.5D的風(fēng)格來實現(xiàn)“招聘之城”的創(chuàng)意。2.5D俗稱偽3D，能讓受技術(shù)限制的視覺設(shè)計師快速制作出立體風(fēng)格的物體和場景。它起源于建筑和工業(yè)設(shè)計中的軸測圖圖示手法，在擺脫了純扁平風(fēng)格的單調(diào)乏味之余，更加豐富有趣。

注：軸測圖，在軸向上具有可度量性，是一種令二維化的平面或立面呈現(xiàn)立體的技術(shù)圖；通過最小程度的變形整合為三維化圖示，但依然保持其可度量性、作業(yè)指導(dǎo)性的圖示方式。

Step2 重現(xiàn)工作場景，繪制場景組件

確定完設(shè)計風(fēng)格之后就是具體場景的繪制了，由于整個活動包含內(nèi)容廣泛，主題多樣，所以我們決定將運營畫面組件化。我們在前期主導(dǎo)建立視覺風(fēng)格后，快速延展出一個可以復(fù)用的基礎(chǔ)組件，便于多名視覺設(shè)計師和動效設(shè)計師共同協(xié)作，快速搭建復(fù)雜的場景。根據(jù)不同行業(yè)的人物和具體工作場景而繪制了八個模塊，同時繪制了一些增加年味的元素例如：鞭炮、鑼鼓、福字等。以下就是具體繪制過程：

Step3 串聯(lián)各單元模塊

繪制完單個模塊的場景后，我們類比生活中的元素，用各類鏈接物件例如樓梯，臺階，管道等元素，將各個場景串聯(lián)，讓各個場景之間轉(zhuǎn)場平順而自然。

Step4 頁面的多端適配

常規(guī)情況下，鑒于PC端尺寸寬廣，包含內(nèi)容全面，多半情況是先完成PC端，再延展適配移動端。而現(xiàn)在移動端作為最大的流量入口，成為我們本次設(shè)計的重點。在移動端我們遵循了“豎向全景圖”的概念，進行了結(jié)構(gòu)排版；這種對不同平臺附以獨立設(shè)計的方法雖然較為費時，但得益于我們組件化的設(shè)計，pc端可以被快速搭建。同時由于我們采用橫排布局，各個場景在首屏均得以展示。

招聘之城“動”起來

動作賦予人物性格，動作賦予人物靈魂。

在“招聘之城”搭建中期及后期，動效設(shè)計都全程進行了參與。從畫面元素的搭配構(gòu)思，到數(shù)個場景的串聯(lián)動畫，以及每個獨立的主會場內(nèi)的人物動作，我們都進行了協(xié)調(diào)統(tǒng)一。幾幀的動畫，確為整個場景賦予了新鮮感和活力，調(diào)和了每個場景之間的關(guān)系。

在這里面，我們首先依照動畫的基本原理對場景組件進行分層，分別為頂層（云層，為了豐富層次），中層（場景組件層，也是基礎(chǔ)結(jié)構(gòu)和可點擊的GIF動畫與位移動畫的結(jié)合層），以及底層（背景，漸變的城市部分）。這三部分中，第一部分通過幾片云進行連接，在不構(gòu)成干擾底部操作的基礎(chǔ)上交由我們另一位前端工程師進行代碼編輯；而中層和底層分別進行了切圖+GIF結(jié)合的輸出。鑒于物件運動距離較小，便于輸出和編輯的考慮，我們制作了4-8幀不等的GIF動畫。

注：視差滾動（Parallax Scrolling）是指讓多層背景以不同的速度移動，形成立體的運動效果，帶來非常出色的有景深的視覺體驗。作為近年網(wǎng)頁設(shè)計的熱點趨勢，越來越多的網(wǎng)站應(yīng)用了這項技術(shù)。

在方案推進的過程中我們了解到Airbnb的一個開源組件：lottie可以很方便的用AE進行輸出，但礙于開發(fā)與設(shè)計銜接的調(diào)試，我們對此方法進行了保留，不過我們相信隨著這個開源插件的普及，越來越多的場景可以被應(yīng)用，也會有更順暢的動效活躍在58和趕集的界面里。

反思與感悟

參與這次設(shè)計過程道阻且艱，但收獲滿滿。為了在“金三銀四”搶占先機，向本站導(dǎo)流，最重要的，是為了向廣大藍領(lǐng)招聘群體營造有趣、可信的平臺，輸出趕集優(yōu)秀的設(shè)計價值和體驗，我們3個設(shè)計師進行了各個維度的配合。同時也再次感謝前端同學(xué)的得力配合，還原出效果佳體驗好的界面，以及產(chǎn)品同學(xué)為我們營造的寬裕時間。相信隨著磨合的推進以及新技術(shù)的普及，我們會在招聘設(shè)計的探索之路上百尺竿頭，更進一步。

參與本項目的設(shè)計師：

視覺設(shè)計師：小葵 & 晨耀

動效設(shè)計師：Bruce

本文來源于人人都是產(chǎn)品經(jīng)理合作媒體@58用戶體驗設(shè)計中心（微信公眾號@58UXD）