靈感、方案、審美、眼界皆來源于日常儲備。本文為産品體驗日記系列第三篇，每期都将為大家分享10個優秀設計及1個思考。

1. 網易雲音樂

設計點：通過使用場景定制頁面，找準用戶當前最需要什麼。

“網易雲音樂”在有網與無網狀态下打開應用的跳轉頁面是不同的。因為對于用戶而言，隻有在有網絡的場景裡才會在線聽歌，當播放器處于無網狀态下能夠播放的隻有本地音樂。所以設計團隊根據用戶具體的使用場景，設定用戶在有網狀态下打開App會進入“發現”的音樂首頁，而在無網場景裡會直接跳轉到“我的音樂”頁面。

音樂首頁便于用戶發現最新音樂資訊與歌單推薦，在線聽歌；而“我的音樂”方便直接打開“本地音樂”列表，離線聽歌。好的體驗永遠離不開場景特征與需求，區别化的頁面跳轉為用戶縮短了行為路徑，節省了操作步驟，讓使用體驗更貼合具體使用場景。

2. 虎嗅網

在“虎嗅網”閱讀文章資訊的時候，看到某些點切中要害難免要去看一下其他用戶的評論。點擊評論圖标，頁面會快速略過中間頁面滾動到評論區域，評論圖标也會變成文章圖标。

“滾動”的行為和圖标的變化其實在無形中可以起到暗示用戶再次點擊可以返回的作用。不管閱讀到文章或評論的哪個位置，這樣的切換都能定位到你剛剛閱讀的位置，省去了來回上下閱讀切換的時長。這也是我一直閱讀長文的時覺得麻煩的地方，對于資訊類應用來說虎嗅在這點上做的很棒。

3. 知乎

設計點：輸入前有引導、輸入中有補全、輸入後有反饋。

知乎的提問功能有2個小細節值得稱贊，一個是輸入時會将輸入的文字和已有提問的關鍵字進行匹配，然後展示出來，讓提問者可以快速閱讀到自己想要的回答；二是問題輸入後點擊添加問題描述時，問題會自動增加結尾問号，比起未輸入時提醒用戶更加智能、方便。

4. 今日頭條

設計點：細節在思考之後、圖形表達需要包含場景。

在“今日頭條”未登錄的情況下,tab欄的文案顯示為“未登錄”且圖标是表示睡覺含義帶有“ZZ”細節的圖形。登錄後tab欄的文案變成“我的”，體現睡覺含義的人形圖标也變成了普通的狀态。

“未登錄”與“未醒”都具有“不在線”的意象,這裡很巧妙的将兩者聯系起來進行設計。tab欄的icon對應登錄狀态有不同的視覺體現，能更直觀的讓用戶明确自己目前的登錄狀态與所處位置。

5. 即刻

設計點：截圖後的圖片與“産品使用中的體驗”關聯性不大，畢竟截圖後怎麼使用該圖片，屬于産品之外的場景了。所以，品牌與體驗之間的取舍，在該場景上 選擇了保留品牌性。

為圖片添加水印是每個平台宣傳自己最簡單直觀的一種方式，但加了水印的圖片會破壞視覺效果影響體驗，引起用戶的不爽（特别是強迫症用戶）。如何拿捏宣傳品牌與顧及用戶感受之間的平衡，就是考驗各家團隊聰明才智的時候了。

“即刻”app利用了iPhone手機劉海屏的視覺盲區，巧妙的将自家的水印藏在了劉海屏之下。用戶進行截屏操作時并不會看到任何水印添加的痕迹，隻有在查看已完成的截屏圖片時才會發現界面頂部中間的水印。團隊裡面個個都是人才，說話又好聽~

6. 支付寶

設計點：比起那些炫酷的“點贊”動效，更貼合實際的微交互，也能做到差異化。

今天有被“螞蟻森林”生活号文章評論區的“點贊”交互萌到爆。和其他産品的點贊icon設計不同，“螞蟻森林”的點贊按鈕在點贊前是呈現大拇指被握住的樣子，好像在為點贊的動作做準備。

點贊後才會變成我們印象裡表示贊許的豎起大拇指的形象。用微交互惟妙惟肖地展現出我們為他人點贊時動作的全過程，很容易引起内心共鳴。看着已經握着大拇指躍躍欲試想要點贊的圖标，你會不會想要點個贊幫它豎起大拇指呢？

7. 餓了麼

設計點：場景細分能發現更多的設計點。

在“餓了麼”點餐後，app會用可視化的信息展示從店家配餐到騎手接單、取餐、配送的全過程。讓點單者對自己的外賣是如何送達的每個步驟都清楚明了，用信息的透明化獲得用戶的信任。

除此之外，展示外賣配送信息的頁面還有情感化設計的小巧思：商家接單時，圖示會在地圖中顯示店鋪的卡通形象；騎手接單後，信息會定位到騎手，畫面展現騎手騎車趕往商家的樣子。當騎手到店去店内取餐了，你還能看到卡通形象的送餐摩托車上空無一人停靠在餐廳邊上的情景。

針對不同情景的信息展示，設計不同的可視化形象，整個配送過程都變得生動有趣了。

8. 網易雲音樂

應該很多人都未發現，在用“網易雲音樂”聽歌時直接拖拽右上角的在播曲目可直接将其添加至自己的歌單。

通常我們都會在歌曲播放頁面執行添加歌曲到指定歌單的操作，所以這個設計隐蔽的手勢交互可能隻是快捷操作的替換方案（“彩蛋”型設計），并沒有明顯的引導提示。雖不易被發現，但實用性還是很強的。

9. 哔哩哔哩

注冊各種應用的時候，用戶名和頭像的選擇都是讓人糾結的問題（“糾結”産生了一個用戶訴求）。小電視家為你貼心的準備了随機頭像的解決方案。在“帳号資料”界面，選擇頭像編輯可以看到“随機”的選項。

“随機”按鈕是可以多次使用的，如果對被分配的頭像不滿意，可以一直切換随機頭像。系統提供的頭像形象都是2233的搞怪表情，有趣的同時也為品牌提升了記憶點。

10. 騰訊理财通

設計點：金融/理财/支付的設計要嚴謹考慮，幫助用戶記憶的同時，也降低了檢查導緻的時間成本。

在“騰訊理财通”裡輸入理财金額時，超過四位數金額顯示的數字第一位就會自動标注“萬”、“十萬”、“千萬”這樣的計數單位。這個貼心的提示設計，能方便用戶立即識别金額，避免輸入錯誤。

其實很多的理财類應用為了方便用戶查看金額，會使用“千分符”來對數字進行劃分。但以三位數為單位劃分的“千進制”畢竟是西方文化的産物，并不符合國人的思維習慣（“文化”差異）。所以從設計邏輯上而言，這個細節的設計是很贊的。

本期思考：什麼是好的産品？

對使用者：

滿足用戶的需求、解決問題是最最基本的條件。必須經曆從可用→易用→好用的叠代過程。不同的人對同一款産品感受也不同。但是，達到“好用”境界的思路卻是共通的，那就是不斷發掘用戶的使用場景，提高産品在不同使用場景下的服務水平。

産品設計的話題非常廣泛，如果用易感知的架構層、表現層概括的話：首先，産品的功能架構要清晰合理，符合用戶心理預期，這樣有利于提高用戶的易通性。

其次，交互設計的流程需要高效、簡潔、直接，服務用戶完成任務時，不要拖泥帶水（性能差、反饋遲、流程亂、感知難、界面醜）。

再者，界面布局要為信息做設計，不能拿來既用，整體調性要符合目标用戶的認知。話說回來，我們目的就是讓産品變的更聰明。

對設計者：

最基本的是産品的商業價值，比如說盈利、為其他産品引流等等。産品喪失了商業性，我不認為是一個好産品。就像“視覺服從于功能、功能服從于商業”的道理一樣。

同時，對設計者也有情感層面的交際，好的産品能帶給設計者一種認同感、滿足感，甚至是達成某種成就。這種情感上的寄托和慰藉我覺得也是非常重要的，因為它比物質上的獎勵更加能激發人的熱情（雖然我喜歡錢，但對行業的熱情就是隐形的印鈔機）而熱情又能投入到産品設計過程中，形成良性互補。

對企業：

企業相比個人而言，會站在一個更加宏觀的角度去看待一個産品對企業，乃至對社會帶來的價值、份額。

比如，好的産品可能不僅僅是局限于該産品本身，還可以有相關的衍生品。就像QQ這款國民級産品，還促進了相關文化産品的熱賣。

對行業：

好的産品能帶來行業的蓬勃發展，甚至為上下遊行業帶來發展紅利。比如iPhone是一款優秀的、成功的産品，這是不可否認的事實。

iPhone的誕生開啟了智能手機的時代，打開了智能手機行業這一千億美元的市場蛋糕。同時，iPhone也促進了屏幕、芯片、代工等行業的發展。

希望對你有所幫助，下期再見~

往期知識點，了解一下：

《産品體驗日記 | 發現優秀的設計-01期》

《産品體驗日記 | 發現優秀的設計-02期》

《用戶訪談 | 深度解析，你需要離用戶更近一些 (附模闆) 》

《産品體驗報告 | 要深度分析，不要表面賞析》

《用戶角色模型 | 拒絕“我認為”的設計》

《用戶體驗旅程圖 | 概念&實操&模闆》

作者：h梓暄，公衆号：UXD筆記

本文由 @h梓暄 原創發布于人人都是産品經理。未經許可，禁止轉載

題圖來自Unsplash，基于CC0協議

,

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!

查看全部