2022-9-16 ui設(shè)計分享達人
Wonder是一款面向Z世代群體信息獲取的探索型產(chǎn)品，雖然我們在產(chǎn)品探索的路上沒能走的更遠，但作為設(shè)計師非常珍視參加創(chuàng)新產(chǎn)品探索的機會，創(chuàng)新本身就是一種積累，在產(chǎn)品搭建過程中深入了解用戶需求，設(shè)計上自我突破、追求極致。以下歷程和設(shè)計經(jīng)驗想與大家分享。
首先從了解我們的年輕用戶開始。通過桌面、田野用戶調(diào)研，我們了解到，在信息內(nèi)容消費方面，Z世代群體更偏向于個性化、多元化、高顏值的信息內(nèi)容體驗。再進一步拆解訴求，我們發(fā)現(xiàn)用戶大致可以分為效率型及消遣型兩大類，效率型用戶偏向于便捷易用、信息聚焦的消費形式，而消遣型用戶更期望有豐富的內(nèi)容讓他們逛起來、刷起來。針對兩大類不同的用戶訴求，我們進行了區(qū)隔化設(shè)計。
在框架搭建上，我們利用面板可變性和固定性兩個維度來定義框架，首先是首頁場景面板，它具有可變性，可以承載不同的內(nèi)容例如搜索、信息流場景。再次，定義了位居二層的搜索面板，作為核心場景，具有固定性，是恒定不變的功能位于可變場景之上。最后，兩處功能區(qū)具有固定性，頭部承載基礎(chǔ)功能，底部承載兩大消費場景。最終將框架轉(zhuǎn)化為具體設(shè)計，分別承載了豐富的興趣內(nèi)容分發(fā)場景和簡單的聚焦場景。
搜索框位于內(nèi)容之上跨內(nèi)容恒定存在，形成了搜索框置底的首頁雙層面板交互形式，和滿足首頁逛起來的內(nèi)容消費場景、聚焦搜索的簡單搜索場景來滿足用戶的不同訴求。加上兩處固定的功能區(qū)域，頭部基礎(chǔ)功能，底部bar承載左效率、右娛樂兩大內(nèi)容場景，構(gòu)成了差異化首頁框架。冠以興趣內(nèi)容躁模式、簡單搜索禪模式姓名，炫酷的交互手勢切換模式加持，最終構(gòu)成了首頁雙模式、可承載多元場景的框架設(shè)計。
同時，頭部留有Doodle品牌區(qū)域，在豐富的節(jié)日運營活動中，檸檬精通過不同的裝扮和道具，和用戶進行互動
隨著我們對用戶的深入了解，有了更細致的解讀。根據(jù)用戶調(diào)研我們發(fā)現(xiàn)Z世代群體更傾向于基于興趣圈層的信息消費形式，愿意為興趣買單、尋找同好，并致力于為興趣圈層貢獻價值。因此我們對整體的框架和布局進行了體驗升級探索。
我們將用戶訴求拆解為可落實的設(shè)計目標(biāo)，并聚焦「體驗統(tǒng)一」「快速篩選」「特色感知」「重點突出」4個核心設(shè)計目標(biāo)。框架層面，我們依托星球形象設(shè)計，運用頭部循環(huán)交互框架形式，使內(nèi)容直觀清晰呈現(xiàn)，不同星球凸顯不同內(nèi)容特點，又保證了6大內(nèi)容體驗統(tǒng)一。
底bar定義為基礎(chǔ)功能承載，語音核心能力固定不變，消息作為社區(qū)互動重要基礎(chǔ)能力、個人中心便捷用戶快速回訪社區(qū)資產(chǎn)。在頁面的架構(gòu)上，根據(jù)金剛位運營模塊特性，將模塊設(shè)計為可組合、可靈活配置，以支持隨時更替的運營訴求。
對于重點互動場景，運用動態(tài)入口設(shè)計吸引互動，并在二級頁打造全場景的沉浸式互動氛圍。
最后，將UGC無限流至于信息層級底部，打造縱向瀏覽、逛內(nèi)容體驗。
在項目正式啟動前，組織腦暴會開展年輕化設(shè)計語言提煉，結(jié)合用戶研究團隊調(diào)研報告，通過Image board建立設(shè)計理念和模型表達，通過收集、歸納、提煉、總結(jié)路徑，提煉設(shè)計語言基因。
圈定關(guān)鍵頁面、核心控件開展帶有年輕化設(shè)計語言基因的方案探索，并擴大覆蓋到重點頁面驗證、聚焦、收攏，最終確定產(chǎn)品的年輕化設(shè)計語言。
檸檬精是Wonder App的官方IP形象。取自「我酸了」流行語，以檸檬為基礎(chǔ)原型，設(shè)計保留了檸檬最突出的特征，色彩以品牌色—檸檬黃為主色調(diào)，整體造型擬人化、年輕化以增強形象的延展性及實體化后的可動性。IP形象與業(yè)務(wù)屬性及產(chǎn)品氣質(zhì)也較吻合，同用戶互動場景應(yīng)用打造差異化記憶點。
不斷完善形象在各種場景中的應(yīng)用及延展，制作系列表情，用更多元的表現(xiàn)形式將檸檬精的性格描繪得更加豐滿，為品牌注入更多親和有趣的情感，拉近與用戶的距離。
伴隨產(chǎn)品興趣圈層的升級，3D檸檬精也結(jié)合星球概念，差異化造型與興趣內(nèi)容對應(yīng)，去賦予不同興趣星球特色，幫助年輕用戶找到社區(qū)、身份歸屬感，增強人與社區(qū)鏈接感。
大星球塑造中，通過不同星球的特色元素構(gòu)建場景，同用戶產(chǎn)生行為共鳴，吸引用戶進入圈子。
設(shè)計一定不是“拍腦袋”的想象，更多是基于用戶特性、訴求、使用場景的一步步推導(dǎo)、演進的結(jié)果。設(shè)計也并不局限于最終的界面效果呈現(xiàn)，整個產(chǎn)出過程都在設(shè)計，也都有設(shè)計發(fā)揮的空間。記得在日常的設(shè)計中多挖掘用戶訴求、洞察機會點，并抱著提供解決方案而非一次性結(jié)果的視角，動態(tài)的、可延展的看待、設(shè)計事物。
隨暫別應(yīng)用市場，依然感謝大家的閱讀，期望這趟年輕化設(shè)計之旅能夠帶給設(shè)計師們一些啟發(fā)。期待看到更多有趣的、創(chuàng)新的、別出心裁的年輕化設(shè)計。
作者：百度MEUX
轉(zhuǎn)載請注明：站酷
藍藍設(shè)計( www.b186.net )是一家專注而深入的界面設(shè)計公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)、UI設(shè)計公司、界面設(shè)計公司、UI設(shè)計服務(wù)公司、數(shù)據(jù)可視化設(shè)計公司、UI交互設(shè)計公司、高端網(wǎng)站設(shè)計公司、UI咨詢、用戶體驗公司、軟件界面設(shè)計公司
藍藍設(shè)計的小編 http://www.b186.net