產品細節剖析,讓你看看大廠是如何做設計的(2021-04)

0 評論 3910 瀏覽 13 收藏 29 分鐘

編輯導語:大廠在產品細節這方面,往往有著獨特的想法和考慮,如果我們去細心的觀察以及親身體驗和總結,就能發現常人所不能發現的一些提升體驗感的小細節,這樣可以提升我們的設計能力,增強用戶的粘性,實現產品的最大價值。

作為設計師,在拿到產品需求的時候,所要做的不僅僅是完成產品的設計工作,更重要的是要思考如何通過設計的的手段去推動產品背后的商業價值達到最大化,提升視覺體驗、增強用戶的粘性以達到用戶轉化的目的。

不需要我們設計的有多么復雜,可能是一個步驟的簡化、一句打動人心的文案、貼心的提示、趣味的動效…

46.「微信」朋友圈視頻靜音播放-減少噪音污染

1. 產品體驗

在微信朋友圈,長按選中視頻,然后從彈出的選項中選擇“靜音播放”,跳轉到視頻播放頁面后是沒有聲音的。

2. 設計思考

朋友圈作為現在獲取好友信息的主要場所之一,很多的用戶都會在朋友圈發布圖文、短語、視頻等類型信息。

我們通常習慣性的每隔一段時間就想去朋友看看,當看到非常感興趣的視頻時,就激動的忍不住點了進入,沒想到突然來了一段勁爆的音樂,此時地鐵上的人都詭異的看著你、正在午休中的同事在仇視你、上班中的領導皺著眉頭看向你,就問你,尷不尷尬?

其實在微信朋友圈看視頻,很早就設計了這樣一個細節,長按該視頻,選擇“靜音播放”跳轉到視頻播放頁面,此時播放視頻時沒有聲音的,如果擔心視頻里的聲音影響到自己或他人,可以使用靜音播放。

雖然事前把手機音量減到最低也可以解決這個問題,但可能導致忘記將音量調回來而造成來電或其他聲音通知的信息遺漏。靜音播放還能方便“摸魚黨”在上班時間給自己來一個小小的放松,避免眾目睽睽之下太過張揚給自己帶來不必要的麻煩。

47.「餓了么」趣味/情感化-有溫度的交流

1. 產品體驗

在餓了么騎手信息頁面,點擊藍騎士頭像,頭頂的藍色竹蜻蜓會旋轉2秒,且配有玩味性質的toast文案,趣味性十足,時而引發會心一笑。

2. 設計思考

眼尖的細心網友可能已發現,之前我們在餓了么點外賣,待騎手送到去取餐時,騎手頭盔上有個藍色的竹蜻蜓,這個不僅僅是裝飾作用,更是對優秀騎手的一種激勵政策。

竹蜻蜓不僅是騎手身份的象征,還因“皮膚”的創意讓外賣騎士職業在社交平臺攢了一波人氣,隨后美團也在頭盔上增加了袋鼠耳朵、美猴王的“鳳翅紫金冠”等。

如果你在線下沒有看到,沒關系,餓了么已經把竹蜻蜓搬到了線上,儼然已成了餓了么的品牌形象。在騎手的個人信息頁面,點擊頭像,竹蜻蜓會轉動,利用toast彈窗配合文案提示,趣味性十足。

用戶在常規的APP頁面交互過程中本來只為滿足一個需求而經過的必要流程,用趣味化的方式體現,雖然沒有實質上的幫助,但會給用戶帶來驚喜,讓整個操作過程感到放松、愉悅,也是情感化設計的體現,用戶偶爾暖心一笑,讓冷冰冰的頁面變成了有溫度的交流,極大的提升了用戶體驗。

48.「高德地圖」長途信息-途中所需一覽無余

1. 產品體驗

在高德地圖路線預覽時,點擊長途/沿途信息,即可查看路線所經過的加油站、衛生間及服務區等沿途信息。

2. 設計思考

有網友說,好多次想在開車的過程中去加油,又不想繞路,又特別的想找中石化而不是中石油,每次遇到這種情況都覺得導航軟件不夠人性化。其實不僅如此,在開車途中,有時候也有餐廳、汽車維修、取款等方面的需求。

高德地圖的沿途/長途信息,可讓用戶在出行之前把需要了解的信息一覽無余,提前會有心理預期,當我們行駛在高速路上,需要知道接下來距離加油站、餐廳或汽修還有多遠時,高德地圖的沿途搜索功用恰好能夠處理用戶的當務之急,考慮周全且人性化。

49.「愛奇藝」導航標題字-貼心的界面環境適配

1. 產品體驗

愛奇藝首頁頂部導航切換時,主題背景跟隨切換后,標簽文字也使用跟主題背景相近的色值,讓視覺更柔和。

2. 設計思考

在我們用過大多數的APP中,常見的大標題都是主題色、深色或白色,所以在不同的背景色環境中顯示,視覺的舒適度總是沒有那么高,也驗證了一句話“合格的設計千篇一律,優秀的設計百里挑一”。

愛奇藝首頁頂部導航切換時,其標簽文字的色值會跟隨主題色一起切換,讓文本逐步接近背景色,視覺上更加柔和,相比常規性的“千篇一律”舒適度更高,提升了視覺體驗,還能起到降低視覺疲勞、保護眼睛的作用。

這是一個很容易被設計師忽視的好功能,可以看出來,愛奇藝的團隊對界面環境體驗的考量是很貼心的。

50.「蝦米音樂」橫屏磁帶效果-滿滿的回憶殺

1. 產品體驗

使用蝦米音樂聽歌,在播放頁面橫屏時,界面會變成早起的音樂播放工具“磁帶”樣式,頗為復古,上滑彈出多種場景音效選擇,并用不同顏色的“磁帶”外觀區分,點擊“磁帶”的兩個孔可切換上/下一曲。

2. 設計思考

《荊軻傳奇》電視劇中最讓我記憶最深刻的一句話是“這個故事雖然已經過去了2200多年,但依然會留在我們的心中,代代相傳”,而今天的蝦米音樂也將成為歷史。

相信所有蝦米粉都收到一則即將停止運營的線上通知,且啟動頁也變成了告別畫面,讓用戶一陣心酸,啟動頁的那一聲告別,最后的希望也將破滅。

  • 2021年1月5日10點:停止賬號注冊、會員充值、蝦幣充值、專輯購買等服務;
  • 2021年2月5日0點:停止所有歌曲試聽、下載、評論等所有音樂內容消費場景,停止個人資料導出或下載;
  • 2021年3月5日0點:運營停止,關閉服務器,屆時及以后將無法登錄……

當看到這則消息時,蝦米粉們有些淚目了,頗有壯士一去不復返的悲壯之感,蝦米音樂從上線到至今都沒有讓用戶失望過,尤其是音樂實驗室一直都是音樂界里的黑科技。雖然即將成為歷史,但有的設計細節仍值得我們記住。

使用蝦米音樂聽歌,將播放頁面橫屏,畫面變成轉動的磁帶效果,其中還隱藏了幾個交互手勢,點擊磁帶的左右兩個孔可切換上/下一曲,上滑選擇場景音效,頗為經典的復古效果給用戶來了一波滿滿的回憶殺,通過突出的視覺樣式,給用戶帶來美好的回憶,達到增強用戶記憶的目的。

讓用戶用一款產品很容易,記住一款產品卻很難,蝦米音樂的磁帶效果真正起到了畫龍點睛的作用。

51.「酷狗音樂」個性化的歌詞設置

1. 產品體驗

在酷狗的歌詞頁面,點擊左下角的“詞”入口,即可對歌詞進行字體、字號、顏色、動感等一系列的個性化設置。

2. 設計思考

面對“百年”一成不變的歌詞頁面,用戶早已產生視覺疲勞。對于視覺效果樣式較為單一的設計形式,早已無法攬住用于的心了,用戶喜歡的是要讓更多的選擇由自己來控制,其內心會產生一種成就感,也會間接對產品產生信任。

酷狗音樂的歌詞設置算是有心了,通過一系列個性化設置歌詞樣式,讓用戶隨心所欲,滿滿的成就感。比如女生喜歡可愛萌萌的樣式,可以通過選擇較為卡通的字體、粉粉的歌詞顏色來滿足少女心;男生可以選擇剛硬有力的字體、開啟動感歌詞來滿足力量和節奏感。

個性化設置可以根據用戶的不同偏好及瀏覽行為進行自行調整,讓界面看起來和同類產品截然不同,有特色的產品更容易讓用戶記住,提升使用粘性。

52.「快手」交互手勢-兩個需求“一箭雙雕”

1. 產品體驗

在快手的精選視頻欄目,頁面左滑后,以單列的卡片樣式把該創作者的所有作品顯示在設備右側,方便用戶上下滑動選擇,且不會打斷當前播放的視頻。

2. 設計思考

短視頻類型的APP我們用過很多,因為其互動性很強,所有隱藏了很多交互手勢,較有代表性的莫過于抖音和快手。

左滑是比較常見的手勢類型,在視頻播放頁面,用戶都知道通過左滑可以查看該創作者更多的作品,但頁面的跳轉會中斷當前正在播放的視頻,要么看完左滑,要么再次回來重新觀看,別無選擇。

快手APP將當前視頻創作者的作品選擇換了一種方式展示,頁面左滑后,所有作品都會顯示在設備右側,用戶可上下滑動進行選擇,且不打斷當前視頻的播放,可謂是“一箭雙雕”。

在同時滿足用戶多種需求的情況下,節約用戶大量的時間成本,提升產品易用性,以便用戶在最短的時間內、用最簡單的操作滿足自己所需。

53.「高德地圖」導航語音包-拉近“距離”一鍵完成

1. 產品體驗

在高德地圖的導航設置中,可選擇各種語音包,比如明星、網紅、地區方言等,設置成功后,在接下來的導航行程中,所選擇聲音將一路伴隨用戶進行語音播報。

2. 設計思考

從目前的網紅、明星直播帶貨中就可以看出,追星族對明星的追捧到底有多么瘋狂,近似失去理智的將每個月收入都盡數投入到明星產品中,甚至入不敷出,所買的可能是一堆連自己都不知道為什么要買的東西,TA們不會放過任何一個能與明星虛擬接觸的機會,這也讓很多互聯網的線上產品找到了營銷機會點。

高德地圖在導航過程中的語音播報,就很好的利用了這個機會點。在導航設置的的語音包里選擇自己的喜歡的明星進行語音播報。

可以設想,在旅途中自己喜歡的明星一直在給自己引路,會有一種近距離接觸的錯覺,這似乎比聽明星的歌曲、看電視劇更有親近感,能間接滿足自己小小的虛榮心,平臺也能通過此種方式增加用戶粘性。

另外對于有思鄉之情的用戶,選擇家鄉的地區方言播報, 在回鄉的旅途中也可以拉近與家鄉的距離感(每個人都有自己喜歡的人或事物,追星族亦是如此,上方舉例只是部分說明,至于是理性消費還是感性消費全憑自己的內心決定,勿杠)。

54.「喜馬拉雅」更具親和力的語音簽名

1. 產品體驗

在喜馬拉雅的個人設置頁面,可以錄制一段語音作為簽名,系統提供了部分文案語錄參考,錄制完成并選擇性別后,其他用戶就可以在我的個人主頁收聽語音簽名了。

2. 設計思考

從我們最早玩的QQ開始,一直到現在,在很多應用里,用戶都喜歡用一句話設置個性簽名。

有人說,個性簽名是自己對每個階段的一種感受,其實也不僅僅如此,有些人常年用一句話,有的卻頻繁更新,這個功能就像一塊空地,用一句簡短的話語代表自己的心情、特意的人設、表面的性格或者渴望有心的人發起交流。

喜馬拉雅APP則是一改常態,使用了區別于常規的文字個性簽名,即語音簽名。通過個人中心設置喜歡的名人名言或勵志語錄,其他用戶進入自己的個人主頁點擊即可收聽。

語音簽名更具有親和力,并非僅僅是文字的理解,能拉近人與人之間交流的“距離”,更像是情感互動,這種互動體驗通過情感化的方式會給用戶帶來驚喜,讓其感受到產品的溫度與團隊的用心,加強用戶對產品的印象,是鞏固用戶粘性與忠誠度十分巧妙的方式。

55.「微信」炸彈表情-炸壞了手機的鋼化膜

1. 產品體驗

微信8.0版本升級后,表情包版塊調整的雖然很多,但最讓用戶驚訝的莫過于炸彈表情的“爆炸”效果了,活脫脫上演了微信版的“敘利亞戰爭”。

2. 設計思考

可以確定的是,微信每一次大的版本更新都沒有讓用戶失望,雖然偶爾的一個細節會讓用戶吐槽,但整體來說用戶的滿意度還是非常高的。

本就沒有任何一個產品能100%滿足所有用戶的需求,至于部分瑕疵,只能通過不停的探索與研究逐步改善。從之前的拍一拍、青少年模式、修改微信號等,到現在的8.0版本,幾乎都是在很短的時間內發生了巨大的變化,所以微信一直占據社交主流寶座不是沒有道理的。

微信8.0新版本自上線以來一直都是好評不斷:首先啟動頁風格更加精簡,這本就是在預料之中;其次懸浮窗優化升級,不用說,視覺體驗提升了一大截;然后新增個人狀態,我們在QQ、釘釘等應用中都已經熟悉了;再者就是表情包發送之初的動態效果,早就在其他應用玩過已不陌生了。

這次微信8.0一系類新功能中,最吸引眼球的莫過于動態表情,其重中之重給用戶印象最深的就是炸彈表情包發送之后的爆炸效果了,有很多網友表示玩嗨了。

向對方扔炸彈表情,會在屏幕區域范圍內出現較大的爆炸視覺效果,設備還會跟著震動,讓聊天變的更生動,增強互動的趣味性。不過炸彈表情雖然好玩,但是發送之前需要考慮是否打擾好友,避免弄巧成拙。

我曾經試過將幾個人拉倒微信小群,大家不停的發炸彈表情,痛痛快快的炸了一番,場面一度堪比線上版的“敘利亞戰爭”,玩罷之后,甚至懷疑手機鋼化膜的損傷是否為炸彈表情所致……

56.「微博」點贊-不僅僅是“點贊”和“取消”

1. 產品體驗

長按微博的點贊圖標,會彈出微笑、哭泣、生氣、驚訝、點贊五個大表情包,用戶可根據自己的感受,用表情包對微博進行不同態度的點贊,且上方會顯示已有的表情包點贊數量統計。

2. 設計思考

點贊功能是很多應用不可缺少的功能了,不僅可以激勵內容生產者產出更加優質的內容,還能幫助平臺篩選出更符合用戶偏好的內容。

新浪微博的界面設計我是一直都不敢恭維,一種風格長期使用,跟自身在該行業中的壟斷地位息息相關,不管好壞,大家沒得選擇,另一方面可能考慮到用戶的龐大,涉及男女老少,其改版之后會增加用戶的學習成本,一不小心就會導致用戶流失。

縱然如此,微博在部分細節上依然讓用人出乎意料,帶來驚喜之余,也提升了用戶體驗。

微博的點贊功能設計的算是比較有心了,除了常規的單擊點贊/取消之外,還隱藏了一個彩蛋,長按點贊圖標,會彈出五個表情包,用戶可以選擇對應的表情包對當前的點贊行為表達不同的態度,再次長按后點擊該表情即可取消。

動態的大表情包能在不經意間帶給用戶驚喜,通過趣味化的方式將點贊心態傳達的既準確又生動自然,帶來更好的互動體驗。且展示已有表情包點贊的數量統計,?利用羊群效應,讓新進用戶將此想法和行為在相當程度上受到周圍人的影響,降低用戶的思考時間,提高點贊轉化效率。

57.「QQ」QQ相冊-幫助用戶制造回憶氛圍

1. 產品體驗

進入QQ空間的相冊,在圖片上下翻動的同時,右上角的日歷圖標會跟圖片列表時間的月份一致,對應變化。

2. 設計思考

QQ是80、90一代用戶的回憶,即便有部分人不用了,但確實伴隨了我們前后十幾年,其QQ空間的說說和相冊更是由遠及近記錄了我們曾經發過的閑言碎語和回憶,再次使用起來依然倍感親切。

最近在QQ空間發現一個不錯的小細節:進入QQ相冊,上下翻動圖片列表的同時,右上角日歷圖標中的數字以月份方式顯示,并對應列表中的圖片發布時間,通過反復強調增強用戶視覺感知,圖標中的月份上下銜接滾動顯示,體現出時間的游輪,用更明確的視覺展示帶用戶更快的進入回憶中,利用回憶氛圍方便用戶抒發自己的情感。

58.「菜鳥」既貼心又實用的代取快遞功能

1. 產品體驗

在菜鳥裹裹的取件Tab頁,可通過添加親友,幫助其跟蹤物流信息或代取快遞,尤其是家庭之間非常實用。

2. 設計思考

有時候因為不方便經常需要別人幫忙取快遞或者幫助別人取快遞,一般都是通過截圖把取件憑證(取件碼/開箱碼)用微信發給對方,或者需要幫助家中老人跟蹤物流信息,也要先索取物流單號,操作非常麻煩,一不留心可能就會忘記,給自己或親友帶來不便。

現在好了,菜鳥的“添加親友”功能可以完美的解決這個問題。

如果需要幫助親友代取快遞或跟蹤物流信息,可通過添加親友的手機號碼(最多4個),對方確認后,就能隨時查看該手機號碼相關包裹的物流信息了,非常方便,解決常規的轉發取件碼可能存在失誤的問題,減少溝通成本,還能幫助家中老人因不熟悉APP操作的原因,協助跟蹤物流信息。

另外,若不想讓親友看到自己的包裹信息,可通過權限設置屏蔽自己的包裹。不得不說,站在用戶的角度,添加親友功能考慮周全且人性化,貼心又實用,為相互代取快遞的用戶提供了很大的便利。

59.「騰訊視頻」自動切換畫質-降低流量超額風險

1. 產品體驗

在WiFi環境下高畫質觀看騰訊視頻時,若WiFi突然中斷變成流量觀看,系統會自動切換到低畫質流暢觀看,屏幕上方還會彈出“清晰度切換成功”提示。

2. 設計思考

眾所周知,無論是聊天、購物,還是聽音樂,其耗費流量的程度遠不及視頻用的快,尤其是在5G網絡嶄露頭角的今天,若是點錯了某部電影進入觀看,可能在極短的時間內就已經使用流量緩存完畢,就算是返回都來不及了。

騰訊視頻在非WiFi環境下,對觀看視頻的數據流量做了一定的控制。當用戶在WiFi環境下觀看視頻時,因某些原因突然斷網,系統會自動切換到低畫質流暢播放,節約用戶的數據流量。

頂部通過彈出的清晰度切換成功提示,對用戶起到警醒作用,便于用戶考慮自己剩余流量的多少來決定是否需要繼續觀看,雖然可以設置在數據流量環境下低畫質播放,但用戶容易沉浸在看視頻的氛圍中,如果沒有可視化的提示,可能會導致數據流量超額帶來經濟損失而受到用戶的心理抵觸。

60.「QQ音樂」定時關閉-再也不擔心手機“罷工”了

1. 產品體驗

在QQ音樂的設置中,設置一定的時間后開啟定時關閉,計時結束后,系統會立即自動關閉音樂播放,再也不擔心聽歌聽到手機沒電了。

2. 設計思考

90%的用戶手機中都安裝了音樂應用,上班累了戴上藍牙耳機聽一曲、在擁擠的公共/地鐵上無聊時聽一曲、晚上睡不著就開著音樂邊聽邊入睡。

不過最令人尷尬的是歌曲播放了一整晚,電量用完沒發現,等上班到了地鐵站才發現根本用不了乘車碼,連買票都沒法支付,心中有一萬匹馬在狂奔,emmm……

QQ音樂有的定時關閉功能,不知道大家有沒有用過。設置一定的時間開啟定時關閉,計時結束即可自動關閉音樂播放,實現了喜歡每晚聽著歌曲入睡的用戶再也不擔心早上起來發現電量用完的情況,對用戶起到了實質性的幫助。

有時候換一種思考方式做解決少數用戶可能碰到的問題,對用戶的留存也能起到關鍵性的作用。

結語

設計師需要養成體驗產品的好習慣并將優秀的產品細節記錄下來,加強自己的記憶,不僅能提升自己的語言組織和總結能力,也為日后輸出優秀的作品當鋪墊,對自己的能力提升以及未來的職業發展帶來便利。

 

作者:大漠飛鷹;公眾號:能量眼球

本文由 @大漠飛鷹 原創發布于人人都是產品經理,未經許可,禁止轉載

題圖來自?Unsplash,基于 CC0 協議

專欄作家

大漠飛鷹;公眾號:能量眼球,人人都是產品經理專欄作家。致力于產品需求的驅動、產品體驗的挖掘,利用設計的手段為受眾用戶帶來更好的體驗,即好看、好用。

本文原創發布于人人都是產品經理,未經許可,禁止轉載。

題圖來自 Unsplash,基于 CC0 協議。

該文觀點僅代表作者本人,人人都是產品經理平臺僅提供信息存儲空間服務。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發揮!