10個產品細節剖析，看看高手是如何做設計的！

在生活中我們所使用的軟件范圍并不會很廣，兜兜轉轉還是一些常用的軟件，用多了也就覺得差異并不是很明顯。作為 UI 設計師來說，我們需要刻意體驗更多并不常用的軟件，以此打破固化的思維。通過海量的體驗我們可以發現更多設計解決方案，也能體驗到打破常規的 UI 設計表達。

本期黑馬哥就帶大家一起體驗一下，看看這些產品如何呈現出不一樣的 UI 表達，提升用戶的感官體驗。

一、水墨風打造場景代入感

越來越多的產品在滿足底層需求之后，都在追求更好的感官體驗，強化視覺感和打造差異化的風格至關重要。

最近體驗了長相思 App，以手繪水墨丹青中國畫作為主界面背景，配合宛如清泉流淌的背景音樂。場景人物以絕美國風動畫形式表達，將詩詞情景重現，呈現了一場視聽盛宴。

二、收縮式底部標簽欄設計

底部標簽欄除了在圖標設計層面發揮以外，在模塊背景、造型和交互方式等層面也可以進行設計發揮。

長相思 App 底部標簽欄圖標設計結合手繪水墨風，不僅匹配整體風格，也體現出了圖標風格的差異化。底部標簽欄還進行收縮式交互設計，點擊卷軸可以進行展開和隱藏。該設計表達提高了空間利用率，降低用戶瀏覽過程中的干擾，是一個不錯的設計解決方案。

三、趣味性的下拉刷新設計

通過刷新可以獲得內容更新，刷新動作的設計和延展也越來越豐富，設計發揮的空間很大。

最近在體驗豆果美食 App 時，下拉刷新以不同蔬菜的圖形進行動效演變，以此來體現刷新反饋過程。表現形式新穎且印象深刻，在符合產品屬性的同時，也帶給用戶趣味性的感官體驗。

四、簽到設計的動態演變

簽到是提高用戶黏性的有效形式之一，通過簽到獲取積分或者獎勵等，以此提高用戶的參與度。

在得物 App 簽到設計中，以動態演變來體現簽到前后的變化，讓用戶直觀地看到簽到天數和獎勵機制等。以動效的形式將簽到前的日歷盒子進行演變，提高了用戶對簽到過程的關注度。動效表達流暢自然，視覺感知清晰明了，提升了用戶的簽到體驗。

五、獨特的內容展示形式

不同的內容我們會思考如何以更有創意的方式進行展示，結合內容特征和產品屬性也是一個方向。

長相思 App 在賞析欄目中，根據不同詩詞繪制了不同造型的團扇和場景，以獨特和個性化的方式進行內容表達。不僅幫助產品建立鮮明的品牌形象，也吸引了用戶的關注度。

六、打破常規的引流設計

首頁作為產品功能的聚合地，各類功能都想在首頁強化曝光度，達到很好的用戶引流。如何在不改變當前結構的前提下強化曝光度，是產品設計師不斷創新和思考的方向。

最近淘寶為了給“夜淘寶”引流，在首頁右上角進行了打破常規的設計表達，沒有改變功能結構，通過背景造型變化提高該模塊的曝光度。白天和夜間以不同的天氣圖標進行設計表達，結合微動效視覺效果非常突出。點擊進入詳情頁也會根據晝夜差別展示不同的場景，帶給用戶更好的感官體驗，也讓信息準確地得到了傳遞。

七、有禮貌的瓷片區設計

瓷片區作為非常重要的運營模塊，通過視覺的沖擊力吸引關注度至關重要，而動效的表達也是不錯的方向選擇。

好輕 App 在首頁瓷片區的設計表達中，融入了三維人物形象，進入時還會有打招呼的動作。有禮貌的行為表現不僅吸引了用戶的注意力，也能感受到產品的情感化體驗，進而提高用戶的點擊欲。

八、趣味性的個人中心設計

個人中心的設計已不再是簡單的功能聚合，更好玩的趣味性設計逐步普及，帶給用戶更有溫度的體驗感應運而來。

個人中心設計在頂部區域會結合豐富的視覺表達，比如精美圖片、插畫、動效等，而會玩 App 的個人中心根據性別設計了人偶形象。以動態的形式展示形象青春活潑的性格特征，設計表達新穎獨特，呈現了差異化的視覺感知。

九、互動性的語音搜索設計

搜索已經不只是文字搜索范圍了，可以語音搜索、圖片搜索、色彩搜索等，搜索形式變得更為豐富，而提高搜索的體驗度至關重要。

Wonder App 在通過語音搜索內容時，俏皮可愛的人偶形象增強了搜索的互動性。未開啟麥克風時會比著可愛的手勢進行功能引導，開啟后便會比劃著非常開心的動作等待用戶的語音，也會配合情感化的文案進行提示。這種互動性的設計不僅提高了語音搜索的體驗度，也帶給用戶更為情感化的感官體驗。

十、好玩的動態界面設計

產品在滿足底層需求之后，便會不斷追求更具娛樂性的體驗表達，好玩的設計往往會讓用戶更愿意停留和傳播。

騰訊手機管家 App 在電池管理界面設計中，一只小鴨子在藍色的海洋中游蕩著，隨著手機的傾斜旋轉水面也會傾斜。仿佛手機就像一個水缸，小鴨子就是養在水缸里面的寵物，而電量的多少決定了水的深淺，有一種暗示就是如果你再不充電小鴨子就沒有水可以游泳啦！好玩的動態界面設計體驗感很棒，以娛樂性的形式表達了功能含義，也帶給了用戶趣味性的使用體驗。

小結

好的設計創新就隱藏在我們身邊，善于發現優秀的設計表達，才能積累豐富的設計靈感。優秀的產品設計師需要具備一雙發現的眼睛，也要養成體驗分析的習慣，基于優秀案例之上才能創作出更好的設計解決方案。

本期的分享到此結束，不足之處我們繼續努力改進，我們下一期繼續相約。

歡迎關注作者的微信公眾號：「黑馬家族」