2022-7-22 純純
如何讓自己的產品在保證基本的可用性和易用性的同時,還能讓界面看起來柔和、更富有親和力?一個產品能留住用戶的雖然是內容本身的質量與吸引力,但一個小小的細節卻能夠阻止用戶的流失,成為內容轉化的最后一道防線,讓人眼前一亮,值得借鑒。
076.「百度地圖」出行前的“極端”天氣預報
077.「搜狗輸入法」“跨界”復制/粘貼
078.「支付寶」螞蟻森林/莊園-模擬現實世界的自然規律
079.「躺平」趣味化的“擊掌”點贊
080.「QQ音樂」導入外部歌單-不同的設備/賬號歌單無縫對接
081.「微信」簡便且高效的圖片翻譯功能
082.「橙」不一樣的的登錄方式
083.「高德地圖」桌面一鍵導航-出行更高效
084.「愛奇藝閱讀」性別選擇-更明確的指引和提示
085.「餓了么」合適的時間、合適的提醒
086.「搜狗輸入法」教你少打字、多開掛
087.「美團」垃圾分類-解決餐后垃圾分類之憂
088.「優酷」個性化彈幕設置-看劇調侃兩不誤
089.「隨便走」AR導航-“傻瓜”式操作,老少皆宜
090.「微信讀書」模擬現實的行為動作
076.「百度地圖」出行前的“極端”天氣預報
產品體驗:
使用百度地圖,導航路線規劃后,會出現當日的天氣提醒,點擊進入即可查看每個時段的天氣預報。
設計思考:
“賭博看運氣,出行看天氣”,任何時候,大家如果優先知道天氣情況就可以提前做好準備,這對人們的生活方便起到很大的作用。尤其是出行,天氣的變化是影響我們是否攜帶雨傘、交通工具選擇、保暖問題的重要因素,所以提前預知天氣的重要性可想而知。
使用百度地圖APP,導航路線規劃后,出行方式的下方會提示最近可能影響到出行問題的天氣變化,便于用戶選擇更合理的出行方式及交通工具,避免受到惡劣天氣變化的影響。還可以通過點擊進入,查看每個小時的天氣詳情,對于時間不是很敏感的用戶來說,為了錯開惡劣的天氣,提前或延遲出行也是一種不錯的選擇。
077.「搜狗輸入法」“跨界”復制/粘貼
產品體驗:
電腦和移動端都使用搜狗輸入法,且在同一個賬號登錄的情況下,電腦端出現文字復制的操作后,可在移動端設備任何位置的輸入框內直接粘貼,非常便捷。
設計思考:
輸入法給大部分用戶的第一感覺就是用來輸入文字的,哪個好用用哪個,一旦習慣了使用某個輸入法,基本就成了忠實用戶,不會隨意去改變。不過有時候輸入法只是輔助作用,并不需要直接使用,比如:我們在電腦網頁看到自己喜歡的文案語錄時,想發個朋友圈,就需要先復制,再用電腦端微信發到手機微信,最后從手機微信復制再到朋友圈粘貼,雖然很麻煩,用戶還是可以接受的,不然通過自己碼字就會浪費大量的時間。
搜狗輸入法的黑科技一直都很多,比如圖片英文翻譯、智能助手、文字掃描提取等,都是非常實用的功能。最近發現了一個新的設計細節,讓人驚呼。當電腦和手機端都使用搜狗輸入法且登錄同一個賬號時,在電腦端復制文字后,打開手機端任何輸入窗口,即可看到在電腦上復制的文字,直接粘貼即可,由被動輔助變為主動攝取,再也不用通過聊天工具發送到手機端進行二次復制的繁瑣操作了,實現“跨界”復制/粘貼,非常方便。可以看出團隊站在用戶體驗的角度上,對于輸入法使用場景的串聯考慮是非常貼心的,不僅能再次俘獲一大批新用戶的芳心,也能提升老用戶的使用忠誠度。
078.「支付寶」螞蟻森林/莊園-模擬現實世界的自然規律
產品體驗:
在支付寶螞蟻森林/莊園里,白天和夜晚分別使用了不同的場景,模擬現實世界中的自然規律,白天晴空萬里、且有陽光照射,夜晚滿天繁星、且有流星劃過,頗具真實感。
設計思考:
幾年前QQ牧場養殖、農場偷菜,如今演變卻變成了支付寶的螞蟻莊園養小雞、森林偷能量,將以前的純游戲思維轉變成了如今的游戲+公益的形式,不僅滿足了用戶小游戲的需求,還能促進公益事業的發展,同時用戶也會得到心理上的滿足和成就感。螞蟻森林/莊園小游戲對用戶產生的粘性除了其模式的新穎,也離不開產品團隊日夜刻苦鉆研所提升的用戶體驗。
螞蟻森林/莊園的視覺場景跟隨著白天、夜晚的環境變化,產品遵循現實世界慣例來呈現信息,更具真實感,便于用戶在使用中將現實中的體驗不經意間帶入到游戲場景,可使其更加投入,通過用戶的現有認知,以促成情感化的體驗,使產品更具親和力。
079.「躺平」趣味化的“擊掌”點贊
產品體驗:
在躺平APP對其他用戶的發表的動態推薦時,使用了擊掌圖標,且有光彩線條圍繞著掌心向四周擴散的動效樣式,趣味性十足。
設計思考:
推薦是對其事件/事務認可的一種表達行為,最早可追溯到上古時代的堯舜禹時期,那時候如果對某件事或人,高度認可時就使用鼓掌(慢速且有節奏)的方式來表達;到后面慢慢演變成了簡單的一個字“彩”;再到如今皆可用鼓掌、豎大拇指或直接言語...表達。基于互聯網的發達,為了讓更多人發現其內容資源的優質性,80%以上直接沿用了豎大拇指樣式來表達對內容的認可及贊許,即使有區別于其他產品,也是在局部或動效樣式上做出一點改變。
躺平APP的點贊樣式較為新穎,使用了擊掌的圖標,并且使用了光彩線條圍繞掌心向四周擴散的動效樣式,相比豎起大拇指則更加強烈,意味著喝彩,表達了對內容的高度認可,相較于同質化嚴重的情況下作出了創新, 在過渡的時間差中,進行了趣味化的表達,更具視覺沖擊力。
(“擊掌”的點贊方式適合用于類似躺平、動漫、B站等二次元或個性化的產品中,如果用于工具、新聞、電商等類型產品,可能會對用戶產生干擾,慎用)
080.「QQ音樂」導入外部歌單-不同的設備/賬號歌單無縫對接
產品體驗:
在QQ音樂我的頁面,使用“導入外部歌單”功能,根據提示,即可把其他音樂應用里歌曲添加到QQ音樂歌單。
設計思考:
現在聽歌早已不像以前,一張內存卡或一根數據線就可以把手機里的歌曲轉移它處。基于人們生活水平的提高,數據流量套餐相比以前更是翻了百倍不止,WiFi基本人手普及,所以大家更傾向于在線聽歌,無需下載(除非深山老林或地洞沒有信號)占用手機內存,創建一個歌單,把自己喜歡的收藏起來,即時聽歌,非常方便,如果沒有特別的情況,成為了一款音樂應用的忠實用戶后,基本不會頻繁轉移。
QQ音樂的導入外部歌單功能,可將其他音樂APP的歌單添加到QQ音樂自己的歌單里。對于導入外部歌曲,很多用戶沒有什么概念,感覺自己用不上,別忘了蝦米音樂“尸骨未寒”,很多事情不是沒有可能發生,當一旦需要時,這個功能就是“救命稻草”,可以想象,如果通過手動把以前的幾百首歌曲一首一首的添加到歌單,不知道會不會“抽筋”。除此之外,還可以將歌單在朋友之間相互分享添加,這也是一種不錯的音樂交友方式,實現不同設備、賬號的音樂歌單無縫對接。
081.「微信」簡便且高效的圖片翻譯功能
產品體驗:
在微信的聊天對話框中打開英文圖片,點擊下方的翻譯功能按鈕,即可翻譯圖片上的外文,并以中文顯示。
設計思考:
在我們的生活中,有時候多多少會遇到一些英文,比如進口食品包裝、藥物說明、護膚品等,其中就有一部分是純英文說明,無論自己多么博學多才,但不見得都能理解英文。記得之前有一次,我自己的電腦藍屏,出現的全是英文,雖然自己也是一直提倡用互聯網解決問題,且也有一些拍譯軟件,但一想著需要下載注冊,沒準兒還要先看廣告或收費,且天生對英文有一種與生俱來陌生感,還未開始便放棄了,于是成了伸手黨,去請求別人幫助。
微信的圖片翻譯功能就是專為解決這一問題而生。通過在對話框中點擊圖片直接翻譯,看到一道綠色的光由上而下掃過之后,圖片中的英文就變成了中文,著實方便,比起以前通過第三方或先提取圖片中的文字來翻譯,操作簡單且效率還提升了很多,可以說是一個非常實用的小功能。
082.「橙」不一樣的的登錄方式
產品體驗:
在橙APP的登錄頁面,區別了常見的登錄界面樣式,使用對話聊天的方式按流程提示用戶完成登錄,界面流程方式新穎,濃厚的社交行業屬性。
設計思考:
在任何應用中,要想有自己的“私密”領地,都繞不開登錄/注冊的流程,但凡手持智能手機又想玩的開的用戶,對登錄的流程是非常熟悉的,比如手機號+驗證碼、一鍵登錄、第三方登錄,無外乎這幾種常規的登錄方式,如果想來點“刺激”的,無非就是加個logo、貼個插圖、來點動效等,見怪不怪了。
橙APP的登錄方式雖然同樣是手機號+驗證碼登錄,但在流程樣式上卻非常新穎。鑒于應用本身屬于社交行業,通過對話詢問的方式讓用戶按照流程輸入了手機號和驗證碼,給用戶造成這不是對使用該APP設置門檻的錯覺,降低用戶的防備心理(很多產品用戶量的增長都被擋在了登錄之門外),讓用戶不知不覺在聊天過程中完成了登錄流程操作,其方式非常友好且登錄的過程是愉快的,同時還兼帶了濃濃的社交行業屬性,通過更直觀的登錄場景感受,拉近用戶跟產品之間的距離,使用戶的印象更加深刻。
083.「高德地圖」桌面一鍵導航-出行更高效
產品體驗:
通過高德地圖的收藏夾,點擊收藏地址右側的功能菜單,在彈窗中將該地址“添加快捷導航到桌面”,后續就不用每次輸入常用的目的地了,直接通過桌面的圖標入口即可一鍵導航。
設計思考:
對于在外的工作人員,導航算是手機必備的軟件,以前只是純粹的導航認路,而隨著汽車量的增長,各地交通逐漸開始變得緊張,那么不管我們是否知道路線,駕駛之前都會習慣性打開地圖導航,隨時觀察路線擁堵情況來思考是否有更換更優路線的需求,于是就按照慣例打開導航、錄入目的地、選擇路線......等一系列的常規操作,日復一日,似乎沒有覺得什么不妥。
高德地圖的桌面一鍵導航功能,為長期有駕駛需求的用戶提供了更為便捷的操作,將經常使用的目的地添加的收藏夾,再添加到桌面以生成目的地導航便捷入口,有需要時桌面點擊即可,系統將自動規劃最優路線,通過最便捷的方式一鍵導航,再也不用日復一日的重復之前的操作了。站在設計師的角度,在解決用戶需求時,操作越復雜、步驟越多,用戶的選擇條件、視覺負擔及時間成本就越多,出錯的情況也越多,故而用戶流失的可能性就越大。高德地圖通過一鍵導航簡化操作流程,通過合理的操作路徑,降低用戶時間成本,有效提升了使用頻率及粘性。
084.「愛奇藝閱讀」性別選擇-更明確的指引和提示
產品體驗:
首次進入愛奇藝閱讀APP,在性別選擇頁面中,男生和女生的頭像通過動畫的形式反復左右替換,用強視覺提醒的方式推動用戶進行選擇操作,以便于提供更匹配的內容資源。
設計思考:
大部分新聞或閱讀類型的APP,在用戶首次進入應用時,都有類似性別、行業、愛好之類的選擇,其主要目的是確定用戶的屬性,并提供更加匹配該屬性的內容資源來提升用戶的滿意度。其流程也是千篇一律,以建議性的提醒用戶去做選擇,如無需要直接跳過即可。
愛奇藝閱讀首次即進入APP時,以動態的性別頭像插圖反復左右切換的動效方式來提示有用戶選擇性別,相比常見的靜態按鈕直接顯示在那里會更加友好,不會過于生硬、冷冰冰,其動畫視覺樣式給予明確的指引和提示,更能引起用戶的注意,通過強烈的視覺提醒促使用戶更高效的完成當前任務。
類似這種選擇且非強制性的前置頁面,很多設計師只是按部就班當做一個流程,其實要想做好并非僅僅如此,可以通過趣味化、情感化、動效等方式增強用戶去選擇的欲望,以提高操作幾率,用戶一旦選擇,進入應用之后所看的內容定然更符合自身的需求,也能提高用戶的滿意度,其滿意度的高低能決定用戶的去留及轉化,所以應用中,用戶的前置選擇對產品的重要性可想而知。
085.「餓了么」合適的時間、合適的提醒
產品體驗:
如果在餓了么有正在進行中的訂單,再次進入應用時,右下角會提供一個查看的快捷入口,點擊可快速進入該訂單查看進度或騎手配送狀態。
設計思考:
隨著外賣行業的普及,給我們的生活帶來了很大的便利,尤其是一日三餐,我們只需花幾分鐘的時間在外賣平臺上下單,其他的事情交給商家和外賣小哥,很大程度上縮短了我們去店途中和店里的等待時間,特別是對上班族來說,真的是太便利了。不過外賣平臺不像京東淘寶-人們可以無憂無慮的逛上幾個小時,通常都是目標明確的用戶,在短時間內完成自己的需求,要么下單、要么查看配送進度。
如果在餓了么有訂單存在,再次進入首頁,右下角會提示配送信息,點擊直接進入查看詳情。從表面上看,右下角的入口雖然提供了快捷通道,但似乎不太友好,總是會遮擋部分內容。其實并非如此,是因產品根據用戶的使用場景進行行為預判而設計的快捷入口,在正常情況下,從下單到完結一般在30分鐘左右,如果用戶存在未完結訂單且在短時間內再次進入平臺,80%以上的用戶此時需求為查詢配送進度,因此,右下角的進度提示正是在合適的時間給予用戶合適的提醒,根據用戶的場景需求提供了最為便捷的解決方案,由此可見、利大于弊。
086.「搜狗輸入法」教你少打字、多開掛
產品體驗:
進入搜狗輸入法的設置中,可開啟開掛模式,里面的三連發、回聲、重要的事情說三遍分別對應不同的效果。
設計思考:
搜狗輸入法在業界雖不敢說是最牛,但一定是數一數二的存在,發展至今,不僅僅是在滿足用戶的基本需求,還提供了讓用戶感到驚喜的功能,而現在更是研發了很多“黑科技”。
從搜狗輸入法左側的logo中進入工具選項,在設置中即可選擇開掛模式(真實效果見上圖)。正如字面的意思,搜狗輸入法通過智能幫助用戶自動完成一些列的復制粘貼工作,瞬間讓打字刷屏的手速快到逆天,且操作簡單、輕松完成,方便用戶在開懟、賣萌、刷屏過程中直接碾壓對方的打字速度。開掛功能可謂是實用性與趣味性兼備,讓我們在日常中,面對不同的社交需求時帶來貼心的改變。
(凡事有一個度,刷屏如果沒有用對場景,可能會遭到對方的反感,事在人為。就像之前的“拍一拍”功能面世,卻有人在上班時間拿去拍領導、拍老板,后果就不說了,刀可切菜亦可傷人)
087.「美團」垃圾分類-解決餐后垃圾分類之憂
產品體驗:
美團我的頁面,推薦工具的“垃圾分類”功能,能幫助我們進行識別因外賣產出的垃圾類型,便于跟線下對應的垃圾桶“對號入座”,減少不必要的垃圾混合而增加清潔工人的工作量。
設計思考:
外賣平臺的興起,給我們的生活帶來了很大的便利,同時也產生了一些危害,首當其沖就是環境的污染。比如包裝盒、包裝袋、餐具等大量生活垃圾的產出,確實在外賣行業普及后,亂扔垃圾的情況跟隨著瘋速增長,雖然這些屬于個人情況,但也有部分用戶因不知垃圾如何分類,而將所有垃圾聚集在一起,然后就成清潔工的事情,最終無端增加垃圾分類的工作難度。
美團的“垃圾分類”功能對衛生環保方面增添了一份力量,當用戶不知道自己產出的生活垃圾是何種類型時,可通過查看常見垃圾類型提示或搜索來確定類型,方便用戶按類型將垃圾丟入對應的垃圾桶,解決餐后垃圾分類之憂,幫助養成良好的垃圾分類習慣,助力垃圾分類落地。還能消除用戶對“外賣垃圾分類麻煩”的顧慮,利用線上垃圾類型的普及,為綠色發展及環境保護貢獻自己的一份力量。
088.「優酷」個性化彈幕設置-看劇互動兩不誤
產品體驗:
在優酷APP開著彈幕看片時,可通過彈幕設置調整字體的不透明度、行數、大小及速度來設定最適合自己樣式。
設計思考:
彈幕,用戶非常熟悉的一個詞,很多時候在看影片時,彈幕里面的內容遠遠要比影片帶來的樂趣多很多,除了能從中獲得群眾的陪伴增加愉悅感外,還可以帶動視頻的觀看氛圍,讓活躍的用戶有了表達自我的動力和熱情。但對于“鍵盤俠”來說,僅僅在上方顯示的幾行彈幕根本無法滿足自己看影片互動及調侃的需求。
優酷的彈幕設置中,可以根據自己的實際需求對彈幕字體大小、透明度、區域等參數進行設置,針對喜好調侃互動的用戶來說,使用滿屏半透明度字體樣式的彈幕無疑是最好的選擇,互動看片兩不誤。
089.「隨便走」AR導航-“傻瓜”式操作,老少皆宜
產品體驗:
使用隨便走導航,全程利用AR實景,通過3D立體形式的方向引導,幫助我們找到周邊的任何一個地方。
設計思考:
導航是我們出行必備的工具,目前高德和百度在該領域各自獨霸一方,看似很牛叉,但并不是萬能的。比如老人操作起來有一定的難度,經常各種功能找不到還說不好用;又比如我們在陌生的重慶市,可能你從這南面1樓進去,北面就在20樓,毫不夸張,如果通過常規的地圖導航去找人,我建議你最好吃個早餐再出去,等找到人之后就可以吃夜宵了;再比如......不比了。
隨便走APP是一款便捷式輕量導航工具,主打“讓生活樂趣一目了然”。利用“AR全息實景”的展現方式,改變了必須要有地圖的模式,對于我們找周邊的美食、酒店、公交、廁所、景點等需求,進行穿透式3D立體指引,操作簡單,不管前、后、左、右、上、下都有非常明顯的視覺引導,只有你想不到,沒有它找不到,對于長期生活在大城市的用戶,交通復雜、道巷縱橫,很可能我就在你“隔壁”,你卻找不到我“老王”。此外,隨便走APP操作簡單,學習成本基本為零,對家中老人而言,也是一款不錯的導航工具。
090.「微信讀書」模擬現實的行為動作
產品體驗:
在微信讀書的書架頁面,點擊書籍以及書本翻頁,都使模擬了現實生活中較為自然且真實的從書架拿書、及各個角度翻頁的效果。
設計思考:
看書APP雖然眾多,但真正能堅持下去、養成習慣的沒有幾個人能做到,站在平臺的角度思考,畢竟書本的內容是平臺無法修改的,除了提供優質的資源并給予方向指引外,其他便是通過設計體驗來提升用戶的好感度了,
微信讀書APP從書架的拿書動作到書本的翻頁,都模擬了現實生活中用戶看書的行為動作,大家都知道,真正喜歡閱讀的人,是不會在意這些所謂的橫豎及交互效果的,但前面都說了,這種人畢竟在于少數。因為受眾的差別,模擬現實其最主要的作用就是為了吸引眼球,模擬用戶的實際行為,將其代入真實的情境中,使用戶對產品產生深刻的認同感,則看著更加舒心,待用戶提升忠誠且養成看書習慣之后,這些作用就會慢慢變得微不足道。
藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請加ben_lanlan,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系
作者:大漠飛鷹CYSJ 來源:站酷
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。
藍藍設計( paul-jarrel.com )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司