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

本期我們將再次看看別的產品在交互體驗上有哪些有意思的設計吧！

更多產品細節：

案例分享

1. 自如簡潔趣味 banner

自如首頁經過改版后，頭部 Banner 采用了大面積白色底和小動效的形式，以實現簡潔而富有品質感的效果。

提升用戶體驗：通過采用大面積白色底減弱 Banner 的營銷感，提升整體頁面的品質感和氛圍感，同時可以降低用戶對廣告/活動的抵觸情緒，提升信息的傳遞效率。

引導用戶視覺焦點：在減弱 Banner 的營銷感的同時，通過簡單而有趣的小動效，提升頭部的氛圍感，吸引用戶的視線，引導用戶進行點擊和轉化。

2. 盒馬-頂部 banner

盒馬 app 嘗新頁頂部 banner 采用線描動畫結合實物圖的風格表現，線描 ip 小人生動有趣的表現和商品實物圖結合令人眼前一亮。

傳遞正向情緒價值：線描小人表情生動有趣，結合期待搓手、揮手打招呼等動作，展示對推薦美食的向往，傳遞正向情緒價值，激發用戶的好奇心和探索欲。

提高用戶點擊欲：輪播/手動切換時，背景變化的交互動效與星形的主視覺結合，自然有趣的互動元素，令人眼前一亮。引人注目，激發用戶的點擊欲。

3. 美團外賣

美團外賣的首頁下拉動畫與膨脹神券的結合，為用戶帶來了生動有趣的體驗。

增強用戶體驗：隨著用戶下拉頁面，紅包金額逐漸增大，最終進入到領取紅包的頁面。這種交互設計不僅順滑方便，還增強了用戶的參與感和體驗感。

提升用戶對紅包的感知：用戶越往下拉，紅包的金額越大，這種設計讓用戶能夠直觀地感受到紅包的價值。同時，進入到領取紅包的頁面也增加了用戶對紅包的期待和興奮感。

4. 滴滴打車評價體驗創新設計

滴滴打車為了提升用戶體驗，對司機評價的設計進行了精心擴展。通過這些設計細節的引入，使得滴滴打車的評價界面更加生動有趣，讓用戶在評價司機的同時也能享受到更愉悅的體驗。

引入動態表情，豐富情緒表達的方式：在評價界面的浮層頂部，滴滴打車引入了表情動畫，通過放大的動畫效果，增強了用戶的情緒感受。這樣的設計不僅豐富了情緒表達的方式，還為用戶帶來了更多趣味性。

呈現驚喜動畫，增強評價過程的趣味性：當用戶點擊滿意按鈕后，如果選擇進一步提供詳細的評價，滴滴打車還特意加入了放禮花的動效。這樣的動效不僅在豐富用戶的情緒表達的同時，也增強了整個評價過程的趣味性。

5. 閑魚-海鮮市場

「閑魚」App 的海鮮市場板塊頭部的圖標入口插畫增加了點擊交互動效，這一舉措極大地提升了用戶的互動性和趣味性。

對于用戶來說：通過動效的設計，「閑魚」App 成功地將用戶的操作與應用的反饋相結合，讓用戶在使用過程中感受到更加自然和流暢的交互體驗。

對于平臺來說：讓用戶在使用過程中感受到更加愉悅的心情，從而進一步提高用戶的使用頻率和留存率。

6. 大眾點評-隱藏二樓，劃出驚喜

大眾點評首頁下劃超 1/4 屏即可呼喚出二樓空間。通過下滑操作的交互，用戶可以快速訪問更多相關內容，而無需進行額外的點擊或搜索。不僅能夠提高用戶的操作效率，還能夠增加頁面的可用性和吸引力。

多樣化的流量入口：在屏效比十分緊張的首頁，通過下劃的方式增加了一個新的多樣化流量入口。

漸進式露出的驚喜：在下劃過程中，“下拉刷新”的文案隨之變為“松手進入二樓”，并通過強眼的主視覺吸引用戶注意，在交互的過程中巧妙地激起了用戶的驚喜。

最后要說的話

本期的設計分享就到這里啦。

文章中的案例與思考來自于智行 UED 同學的日常分享。

后續我們將持續深度體驗產品，挖掘更多值得分享、學習的設計案例。努力將其中的方法理論應用到智行 APP 后續的產品設計中。

愿我們的努力為你帶來更好的體驗。

歡迎關注作者微信公眾號：「智行ZXD設計中心」