對于產品設計師來說，在同質化的環(huán)境中我們需要具備突破創(chuàng)意的思維，這樣才能輸出差異化的設計方案。而創(chuàng)意離不開優(yōu)秀作品的靈感啟發(fā)，發(fā)現(xiàn)有意思的設計細節(jié)也能提高我們的設計思維。
今天黑馬哥將會繼續(xù)為大家?guī)硪恍﹥?yōu)秀的設計細節(jié)，我們一起來反思一下，這樣的設計想法為啥自己沒有想到呢？
分享目錄
一、營造頂部區(qū)域視覺感與情感化
二、主題化配圖增強視覺感
三、彈幕式標簽提高關注度
四、IP 強化底部標簽欄圖標設計
五、強化動態(tài)發(fā)布的引導設計
六、連貫性的插畫突出卡片特色
七、動態(tài)表情化的評價設計
八、場景化的推薦設計
九、上下輪播的 Banner 設計
十、情感化的氛圍營造
一、營造頂部區(qū)域視覺感與情感化
產品頂部區(qū)域的視覺感是吸引用戶的關鍵，在一些功能單一的產品中，強化視覺表現(xiàn)力也是提升產品豐富度的有效形式。
比如麥當勞 App 首頁的設計中，頂部區(qū)域結合溫馨的場景插畫進行表達，讓你早上打開麥當勞就有種心情愉悅感。動態(tài)的太陽微笑畫面給你一天好心情，情感化的設計不僅增強了視覺感，也帶給用戶美好的產品使用體驗。
二、主題化配圖增強視覺感
封面圖在產品規(guī)范中相對比較難約束，通過構圖、比例、固定元素和配圖質量等，在一定程度上可以提高感官體驗。如果是在重點突出的內容上面，結合主題化配圖也可以增強視覺感。
之前在使用優(yōu)酷 App 時，當時在重點突出熱劇的設計中，就將主題化的內容融入到宮格的配圖中。以統(tǒng)一的畫面風格和設計表現(xiàn)形式填充封面，增強了視覺表現(xiàn)力，以此突出熱劇的吸引力。
三、彈幕式標簽提高關注度
在固定的結構布局中如何提高局部內容的關注度，我們需要在不改變結構的前提下進行創(chuàng)意融入。比如動態(tài)畫面、突出視覺感、內容特異化等等，而最近發(fā)現(xiàn)彈幕式標簽也是一個不錯的選擇。
在體驗優(yōu)酷 App 時，在動漫欄目中針對推薦的熱播新番，想要突出的動漫結合了彈幕式標簽進行強化。動感的節(jié)奏會提高用戶的關注度，在不改變當前結構的基礎上，不失為一種有效的解決方案。
四、IP 強化底部標簽欄圖標設計
底部標簽欄圖標是產品設計師經常發(fā)揮的場景，在一些節(jié)慶主題或者活動中都會定制設計。
優(yōu)酷 App 在元旦促銷活動期間，就將底部標簽欄圖標設計與 IP 形象結合，默認以促銷主題文字展示，點擊狀態(tài)以 IP 形象顯示。圖標與活動相結合，不僅突出圖標視覺表現(xiàn)，也營造了活動氛圍感。
五、強化動態(tài)發(fā)布的引導設計
對于靠內容吸引用戶參與度的產品來說，提高用戶發(fā)布動態(tài)的意愿度至關重要，突出動態(tài)發(fā)布的吸引力也能起到促進作用。
會玩 App 在動態(tài)發(fā)布的引導設計中給出了不錯的思路，未發(fā)布動態(tài)時會以形象化的空狀態(tài)設計進行引導。動態(tài)發(fā)布的按鈕旁以俏皮可愛的形象進行引導設計，提高了按鈕的吸引力，讓用戶有種參與的沖動。情感化設計的引導不僅可以增強感官體驗，也更容易攻破用戶的防備心理。
六、連貫性的插畫突出卡片特色
卡片式設計已經成為主流的產品設計趨勢，信息的歸納感可以提高識別效率。探索卡片設計的表現(xiàn)特色尤為重要，重點在于卡片造型和內部視覺表現(xiàn)力的發(fā)揮層面。
麥當勞 App 在主內容的卡片設計上運用了配送場景插畫，連貫性的插畫突出了卡片特色。插畫場景結合了品牌圖形，增強了麥當勞的品牌曝光度；白天和晚上還以不同配色風格和細節(jié)進行差異表現(xiàn)，無論是想法還是設計細節(jié)都非常不錯，是一個挺有創(chuàng)意的案例表現(xiàn)。
七、動態(tài)表情化的評價設計
用戶評價可以反饋服務的質量，進而做出產品迭代或者服務調整的思路。如何提高用戶參與評價的積極性，需要產品設計師多多探索啦！
最近在使用順豐速運小程序時，完成快遞業(yè)務之后進行評價，表情化的星級評價非常有意思。不同等級以不同的表情呈現(xiàn)，動態(tài)表達非常形象生動，讓人不由的挨個體驗。動態(tài)表情的形式提高了評價的關注度，情感化的表達讓用戶更愿意參與評價，提高了評價的體驗度。
八、場景化的推薦設計
針對電商類產品來說，商品/店鋪推薦模塊出現(xiàn)頻次較高，吸引用戶關注度自然成為了設計的首要目標。
在體驗 Mars App 時，在生活超市推薦的設計中，模擬了便利店的場景形象。真實感的場景表達帶給用戶親切自然的購物體驗，同時也提高了用戶對于該模塊的關注度。
九、上下輪播的 Banner 設計
輪播 Banner 圖算是產品設計中最常見的模塊，在移動端的設計中通常左右輪播為主，最近體驗到上下輪播的案例，打破常規(guī)也不失為一種新的設計思路。
在 Mars App 的首頁 Banner 圖以上下輪播進行交互，左側固定展示定位城市的天氣等信息，提高了 Banner 位置的利用率。Banner 與金剛區(qū)懸浮在特定的背景上，帶給用戶沉浸式的感官體驗。
十、情感化的氛圍營造
情感化的設計可以讓產品更有溫度，增加用戶對產品的好感度。配合傳統(tǒng)節(jié)日或者節(jié)氣主題進行表達是相對比較普遍的形式，會在產品主題和視覺區(qū)域進行氛圍營造。
在清明節(jié)期間體驗飛豬旅行 App 時，頂部區(qū)域以踏春的場景營造氛圍感，還在搜索區(qū)域以青團（青團是江南人家在清明節(jié)吃的一道傳統(tǒng)點心）替代搜索按鈕。情感化的設計營造不僅體現(xiàn)了產品的溫度，也帶給用戶對于節(jié)日的場景體驗。
小結
禁錮我們思維的不是我們的技術，而是我們的眼界和設計感知。發(fā)現(xiàn)優(yōu)秀的設計并總結和轉化，才能讓我們打開禁錮的思維，在優(yōu)秀的基礎上輸出更好的設計解決方案。
本文對于設計的理解闡述屬于個人見解，不足之處歡迎大家留言補充，我們互相進步。
作者：黑馬青年（vx: heimaux）
本文由 @黑馬青年 原創(chuàng)發(fā)布。未經許可，禁止轉載。
