產品體驗日記 | 發現優秀的設計-03期
產品體驗系列模組正式啟動啦~
每期分享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也促進了螢幕、晶片、代工等行業的發展。
希望對你有所幫助，下期再見~
往期知識點，瞭解一下：
《使用者訪談 | 深度解析，你需要離使用者更近一些 (附模板) 》
微信公眾號： UXD筆記