用超多案例,為你詳細解析簡化設計經典四策略

簡化產品是優化用戶體驗的第一生產力,且是設計師值得關注的一個永恆的命題。本文將帶你領略簡化產品的策略技巧,準備好了嗎?

提升體驗的一個核心命題就是如何簡化任務與交互,提高用戶完成任務的效率,之後才是愉悅感乃至其他情感化內容。本篇文章要講述的就是經典的簡約四原則,閱讀本文,你將瞭解簡化產品的四個策略,並且收穫超多案例講解。

用超多案例,為你詳細解析簡化設計經典四策略

也許你對這四個明確的簡化策略的定義並沒有很清晰的認知,事實上這些原則都被我們潛移默化的運用在日常設計中,甚至潛移默化的影響我們生活中處理任務的各種行為方式。例如產品會分期迭代一步步實現,複雜的問題會無意識被拆解為零碎的部分逐一解決。尤其是設計師,在進行平面、用戶界面等內容的組織排版時,一直在使用此類提高內容傳達效率,簡化理解難度的方法。

而作者賈爾斯科爾伯恩把這些人類逐漸內化的經驗技巧(無意識的簡化任務的處理方式),和多年在互聯網行業耕耘所積累的解決問題的經驗相結合,總結提煉出了簡化策略的四個原則,這四個原則就是簡單的四個詞,但潛藏在背後的卻是極其高效易用,極易被複制在我們產品設計流程中的方法論。

這四點分別是:刪除、組織、隱藏、轉移,單刀直入直接開始講解。


查閱超10 萬字資料,總結了這份「簡約設計」深度思考

本文為筆者經過漫長時間的準備,查閱超10萬字的資料後,結合自己閱歷經驗進行的「簡約設計」思考總結,一起來聽聽這段「簡單」的故事。

閱讀文章 >>


刪除原則

刪除原則應當作為簡化的第一原則,首先它實行起來相對容易——刪除功能砍掉交互比添加功能要容易得多,當然這是從技術和成本角度。其次,刪除是簡化操作中優先級更高的原則,能從源頭上減少複雜性。功能/內容都砍掉了,其他的簡化原則自然都不需要了。

所以從這一點角度考慮,其核心就是重新審視產品,結合對用戶需求、場景的洞察,來判斷哪些功能是完全沒必要可以捨棄的。產品設計中做加法是最容易的,產品經理等設計人員往往希望產品能囊括全面的功能,希冀某個功能能夠成為爆點,又害怕遺漏了某個功能導致影響體驗。在這種斟酌和糾結中,設計人員往往更擔心風險而選擇大而全的方案。而最佳的方案必然是突出核心打造爆點,將次要功能和內容模塊弱化做輔助作用。

另有一種情況,創業公司或臨時項目,處於快速敏感迭代期間的產品,則需要根據工期需求,進行重要性和緊急性兩象限方法(附圖)的判定。選擇「偽刪除」,也就是推遲,以保證產品快速上線測試。

用超多案例,為你詳細解析簡化設計經典四策略

當然,刪除並不侷限於功能需求,從生活到設計到各個方面都在潛意識下使用刪除的簡化原則。例如我們的生活中每一秒的記憶中都包括很多無效記憶,即對成長、生存沒有什麼意義的記憶,大腦會自動將其刪除。人的認知、記憶複製的能力也有限,為了減輕負荷也會刪除一些次要記憶。你吃到的美味的或難吃的記憶很可能被保存下來,它給了足夠刺激且具有一定意義——在未來幫助你尋找美味的食物,避免難吃的食物。這就類似產品設計中的有效功能。而你吃到的普通味道的食物,可能會很快忘記,因為沒有足夠刺激(對應產品就是沒有令人驚喜和意外的體驗)、也沒有足夠的意義(對應產品中並不能解決什麼實際問題的功能),它們理應被刪除。

然而在工作中,想要簡化產品經常會遇到這樣或那樣的阻力,有可能來自你自身,作為設計師不想讓自以為是的設計流產,過度重視美觀或者創新的設計方案,過度重視投入設計方案中的精力而導致難以抉擇,不願刪除本沒有必要的功能或元素。當然,更多的可能是來自所謂的評審團隊,如果你讀過烏合之眾(一聽就不是什麼好詞哈哈),你就會明白,群體決策是一種十分低效的方法,除非是像頭腦風暴那樣有專門的 leader 以及規範的流程(頭腦風暴有規範化的流程,這塊知識缺失的同學可以去查閱一下相關資料),否則最終只可能是一群嘴炮的狂歡。一旦涉及到刪除,你就會聽到一群人這樣說——

假如用戶……但我們的用戶想要……

用超多案例,為你詳細解析簡化設計經典四策略

這兩個問題其實是一個問題——不理解用戶的真實需求。以假如開頭的話,如果中文過關的話應該能明白,這只是一種猜測,來自產品經理或者設計師的主觀猜測、當然我們不能否認這種猜測的行為,因為產品設計流程中,必然涉及到設計人員假設自己為用戶初學者,來增加共情,理解用戶的環節。但問題是,此類猜測往往演變為臆測。


6個步驟,從零開始教你繪製同理心地圖

想做好用戶體驗,同理心必不可少。而同理心地圖就是鍛鍊同理心的有力工具之一。

閱讀文章 >>


「假如」會引起設計人員的恐懼,這種無端的猜測最終主導了評審會議,促使我們追求大而全的方案。下次再遇到有人說假如,反思一下用戶是否真的需要這個功能,尋找主流用戶調研一下,不要讓無端的猜測浪費開發與設計成本。

「但我們用戶想要」則是陷入另一種誤區——太被動,上個問題是太主觀,而這個問題則是太被動,作為設計人員應當有自己的評判標準,根據產品整體的風格、定位、業務目標,戰略層目標來進行決策。在你將用戶真正需要的產品擺在他面前之前,用戶壓根就不知道自己想要什麼,他也不能準確敘述自己想要什麼,不然要你產品經理設計開發幹什麼。學會排除噪音,專注於主流用戶的主流需求。

下面來看一些例子。

1. 體驗文案的優化

對體驗文案的簡化策略就是砍一半,再砍一半。一般來說,我們講的體驗文案主要是功能闡述、系統說明等範疇的文案。例如按鈕文案可以這樣優化:立即刪除文件——刪除文件/立即刪除——刪除。


3000字乾貨+實例,我總結了這份體驗文案注意事項大全

通讀不同系統和行業的體驗文案指南後,作者結合自己實際項目的經驗,整理出這篇文章和大家進行探討。

閱讀文章 >>


文案傳達的含義仍然清晰易懂,但文字的數量減少了 2 倍,且突出了用戶將要執行的「操作」,而弱化了基於場景很容易判斷的次要內容,即用戶喚起了刪除操作,不考慮誤觸的情況,這短短几秒鐘用戶不會忘記他們的操作來源——從文件長按而喚出的刪除功能。

如下圖中,體驗文案的優化流程,不侷限於刪減字體,刪除的主要目的是使文案清晰、簡潔,易於理解,在此基礎上,預測用戶的行為,反思用戶的場景從而推導用戶可能遇到的問題,然後給予對應的解決方案。

用超多案例,為你詳細解析簡化設計經典四策略

2. 常規底部tab欄的捨棄

伴隨我們許多年的底部 tab 的設計經驗已經趨於頂點了,傳統的文字 +icon 的形式統一了視覺呈現,統一了用戶審美,也創造了一致性的體驗,但設計師是否思考過,有沒有更好的方案?答案不能肯定,但我們確實看到一些優秀的探索方案,其中一些上線方案,我自認為不比傳統的 tab 樣式差比如小紅書,當然,不同產品對用戶行為和經驗的判斷才是決定因素,這樣我們才能決定 tab 中哪些內容可以被簡化。

用超多案例,為你詳細解析簡化設計經典四策略

首先入場的是第一代 tab 樣式,拿我們又愛又恨的淘寶舉例。很經典的 icon 加文字樣式,雖然在 hometab 有一定的創新,但我們依然將它劃定為第一代 tab 欄,包括近兩年流行的動態 tab 欄,事實上他們都隸屬於第一代 tab,我的定義標準是 icon 和文字的組合,視為第一代 tab。不論你增加底部 tab 的快捷方式,還是添加趣味生動的動畫,它都避免不了一個事實——內容與模塊原封未動,依然是 icon+ 文字來傳達產品的信息架構。

後來從事設計的小夥伴(比如我)可能已經把這種樣式當作天經地義了,他的優點是美觀,清晰,但不夠簡潔,起碼沒有做到最簡潔。於是有了第二代 tab 設計。我們來看第二排入場的小紅書和 Instagram。兩者踐行了我們本章節的主題,刪除原則,一個刪除了 icon,一個刪除了文字。表面上看就是簡單的刪除,但其實背後有深入的思考。

小紅書的設計方案選擇捨棄了擁有眾多創作機會的 icon,選擇呈現最簡潔的文案來幫助用戶分辨不同 tab 對應的模塊。捨棄了視覺美的創作機會但贏得了體驗之美,排除了 icon 元素的干擾,一方面提升了底部 tab 的辨識、操作效率,一方面使用戶聚焦於 app 的內容本身(小紅書的定位也恰恰是內容電商,因此這裡有業務層的考慮,我都能想到設計組與產品和老大撕逼,爭取這個設計創新的場景了)。

我們經常聽到一圖勝千言的理論,但注意,它並不適用於 icon 領域,icon 雖美觀,但除了一些使用頻率極高的 icon(如刪除的垃圾桶 icon),大部分 icon 都需要文字來輔助解釋,更真實的情況是 icon 只是文字的配角。假設你隨便打開三個 app,把他們的 tab 中的文字去掉,你還能夠理解哪個 tab 對應哪個模塊嗎?彆嘴硬,你別拿常用 app 說事,脫離設計師的經驗,假設為應用的初學者後你會發現,準確識別 tab 內容的關鍵是文字而不是 icon,尤其對於新用戶來講。

用超多案例,為你詳細解析簡化設計經典四策略

那麼 INS 為何刪除了文字只保留了 icon,這豈不是與上面的案例相悖。你自己不會分析一下?要學會思考呀少年。

要講 INS 可以用微信做例子。他們都擁有較大用戶量,且用戶習慣穩定、產品使用經驗成熟。這得益於其短時、高頻交互的產品形態。主流的使用場景就是,打開軟件回覆一個消息,打開軟件刷一會圖片 feed,使用頻率極高,用戶對底部 tab 的使用經驗足以支撐他們「盲選」。因此無論選擇哪種形態,都要慎重的考慮用戶習慣經驗以及業務目標,知己知彼後就可以放心地使用刪除原則來簡化產品啦。

除了上面的兩種線上方案,我們也可以看到一些其他探索方案,設計上的探索從來都是百花齊放,但我們需要明確的是,優化底部 tab 是為了讓其更簡潔易用,而不是為了單純的視覺上的創新,因此無論是使用刪除原則,還是像下面這樣使用隱藏原則,都需要以用戶體驗為先。

用超多案例,為你詳細解析簡化設計經典四策略

3. 刪除用戶犯錯的可能——typeC

消除產品中的錯誤是簡化產品的一個永恆命題,對於功能,設計人員可能會因為這樣或那樣的擔憂而難以抉擇,但對於錯誤,任何情況下都應該刪除(然而在越來越注重業務和收益的當下,這個原則也受到了挑戰)。我們都知道在啟發式評估中有一個重要原則——防錯與糾錯。解決錯誤的最優解其實是防止錯誤,用戶研究及收集的各種用戶反饋都可以幫助我們理解用戶常犯的錯誤,然後通過設計去提前避免之。

例如手機充電接口,由 Mini USB 到 TypeC 的過度無疑是極為正確的一個設計簡化,用戶不必盯著接口來調整方向,也不必擔憂盲插時會被迫中斷,停下來再去盯著接口審查一遍,更避免了錯誤使用插頭方向導致的接口損壞。從本質上講,設計師刪除了插頭的異形,從而刪除了用戶可能執行的另一種操作——錯誤操作,反向插頭。預測用戶的錯誤或者經過研究來收集用戶常犯的錯誤,這是最基本的用戶研究功用,用研不是為了那幾頁報告,而是為了發現真正困擾用戶的問題痛點。

用超多案例,為你詳細解析簡化設計經典四策略

當然有時候產品錯誤並不一定要刪除,即便它影響體驗,此時有讀者會想,這作者瘋了吧,不配做設計師。實際上很容易理解,有時候,體驗需要為業務讓路。以網易雲音樂為例,我估計很多人有過和我一樣的經歷,妥妥地被安排。在某次更新之前的版本,在「我喜歡的音樂」常用列表中,頂部位置是操作頻率極高的播放全部按鈕,直到某次更新,用 VIP 開通按鈕代替了播放全部按鈕原有的位置,這不可能是無意的,因為這造成的後果就是,短短一個月我每天要點進開通頁不下兩次,比如上班下班路上。有些無意識的行為,尤其是培養了超過一年的習慣,是很難在短期改變的,比如位置記憶(你進入家門習慣性地摸開關的記憶)。

於是我每天都在重複誤觸,開會員,誤觸開會員。這麼明顯的錯誤沒有被糾正只可能是業務導向,所以大家不要問候設計團隊,反而應該學習到這其中對於業務層面的思考,太毒了,想必轉化一定出奇的高。

用超多案例,為你詳細解析簡化設計經典四策略

排列和組織原則

大家都有在超市採購的經歷,有沒有仔細觀察,超市不同種類商品的擺放,蔬菜區和水果區挨著,入口處和結賬處擺放高頻消費商品。這和我們設計用戶界面原理一樣,都涉及到對內容/商品的組織和排列,為何要這麼做?因為混亂和無序帶來的劣質體驗將導致用戶流失,降低收益。而經過研究排列和組織的內容有更大概率留住用戶。

這種組織和排列的原則在工作和生活中都很常用,不侷限於產品設計。 該原則融入人類生存、社交等基本需求和行為中,甚至融入我們世界觀和意識形態中。 例如對動物、植物、蟲子的種類劃分幫助我們更好地理解世界。對於普通朋友/好朋友/情侶/同事/上下級 等人際關係的分類梳理幫助我們更好地處理社會交往。


五帽架設計原則:歷史證明最高效的信息組織方式

Lisa :我們的設計必須顯示展現出組織性良好的信息,這樣用戶才能很容易的理解所顯示的內容。這是提供良好用戶體驗的關鍵。在大量顯示數據的方式中,有一種經受了時間的考驗,並證明...

閱讀文章 >>


排列組織原則在產品設計中的應用十分常見,高屋建瓴來講就是交互與信息架構。產品定位,戰略規劃是其靈魂,而交互設計,尤其是信息架構設計則是其骨架,直接影響著產品形態,影響著用戶如何與之交互。設計思維中推薦的「空間飽和地圖」方法(一種把整理的內容元素、功能寫在便利貼上,鋪滿整個牆面然後歸納其聯繫,並對其進行分類的方法)以及思維導圖工具都是對這種原則的運用。概括來說,組織的本質就是分類與聚類,某種程度上與格式塔原理重疊。

除此之外,僅僅從用戶界面設計角度講,排列組織原則也是一個聖盃原則,對內容的排列和組織影響到產品的外觀呈現,產品外觀也同樣影響著用戶體驗,經過排列組織的界面並不一定是最美觀的,但一定擁有較高的易用性。下面來看一些案例。

1. 倫敦地鐵圖——使用顏色

倫敦地鐵圖的案例真的可以稱得上最經典(爛大街)的例子了,這是設計簡化產品的一次偉大的創新,在其中我們能看到刪除原則(刪除了真實地圖的曲度,改用更清晰的直線來表達)下圖左,更能看到排列和組織原則下圖右。且設計師在簡化產品時,運用的是最簡單的手段,例如僅僅通過線路顏色的變化來區分不同線路的地鐵。

用超多案例,為你詳細解析簡化設計經典四策略

我們最常用的組織手段是空間、時間,但顏色其實也是一種組織手段。以產品設計舉例,PC 端的按鈕設計通常有多個狀態,常規態、hover、按下態。 hover 我們往往添加 10 個百分點的白色,來暗示用戶此刻鼠標正懸浮在這,並且暗示了此區域可操作。按下時則會添加一些深色,來模擬現實中物理按鈕按下的效果,沉入、變暗。表面上看,他們都是通過添加反饋來提升用戶體驗,使用戶清晰的瞭解到自己所處的位置以及操作的結果,但另一個角度講,設計師實際上通過顏色的分類和組織,賦予每個顏色不同的含義並映射到用戶的不同交互行為,這就是顏色作為組織手段的一個典型案例,其他的例子比如安全產品將紅色與綠色用來區分危險和安全兩種狀態,此類例子不勝繁多,就不一一列舉了。

用超多案例,為你詳細解析簡化設計經典四策略

2. 空間飽和地圖

全稱是「pace Saturate and Group and Affinity Diagrams」,翻譯過來就是空間飽和——群組關係圖。其實這種工具的準確名稱就是群組關係圖,而空間飽和這個前綴是為了強調它的工作形式。說白了就是便利貼方法。 將記錄有我們的見解、對問題的理解,內容、元素、模塊、功能等相關內容的便利貼 鋪滿牆或者畫板,然後尋找不同內容之間的內在聯繫,對問題、記錄信息、用戶研究與觀察、用戶反饋等內容進行聚類整理,為相關的內容繪製連接,以呈現其關係。

「飽和」一詞描述了整個團隊用其集體的圖像,筆記,觀察,數據,經驗,訪談,思想,見解和故事來覆蓋或飽和顯示的方式,以創建一堵信息牆以告知問題定義過程。後將有可能在這些單獨的元素或節點之間繪製連接,以連接各個點,並開發出新的更深入的見解,從而有助於定義問題並開發潛在的解決方案。換句話說:從分析到綜合。

這個工具將組織原則發揮到極致,當然它主要是從空間角度來組織的,我們將相關的內容聚類,並將不同類別分類,拉開空間,站在信息牆前,我們能清晰的獲知產品的內容或功能是如何被劃分的,從而也更自然更方便地探索出如何對內容或功能進行排列。

用超多案例,為你詳細解析簡化設計經典四策略

3. 筆記類產品的側邊欄

用超多案例,為你詳細解析簡化設計經典四策略

無論是印象筆記、有道筆記等筆記類產品,還是 xmind 類思維導圖產品。都屬於組織原則的常規應用形式,即按層級規劃內容,採用嵌套的形式,例如我的文章層級嵌套方式為筆記本/設計總結/2020 文章輸出/交互設計/本文章。包括思維導圖工具,都是使用這種樹狀圖的形式來組織內容,這點就不用詳細講解了。重點講解一些其他細節。首先,印象筆記側邊欄並沒有提供排序功能,經常寫作的人應該很清楚這是一個多大的痛點,在我的筆記主題分類很多的情況下(我可能有十多個筆記分類),沒有排序的話,篩選目標內容的效率很低。後來我去官網求助,結果發現原來印象筆記將排序功能隱藏起來了,或者說定義了自己的一個組織原則。

通過給分類添加數字 01、02,側邊目錄就會按照這個順序排序,當時我真的是驚為天人,原來還可以這樣設計,知道什麼叫潤物細無聲的設計了吧,我們這幫彩筆設計師。它沒有提供常規的排序功能,比如拖動,比如彈出菜單調整順序,它只是把我們常識中的數字排序內化的經驗結合在菜單欄的排序功能上,然後自然而然,問題就這麼解決了。

現在我們反思下,為什麼這麼設計,且為什麼體驗會優於傳統的方式。

首先,排序不是高頻操作,我說的痛點主要是在最初使用產品時,用戶需要調整一個比較舒服的姿勢,需要按照自己的喜好,以及內容優先級、使用頻率來自定義左側目錄的排序,但排序完畢之後,很長一段時間基本上不會再使用,這是其一,使用頻率低,不需要前置功能,否則既佔用位置又佔用認知負荷。

其次,交互設計的最高境界就是設計用戶行為,或者說從用戶行為中映射出功能。這涉及到理解用戶,並根據用戶的習慣經驗來設計功能,印象筆記使用數字來排序就是將用戶早已內化的組織信息的經驗無縫銜接在產品中,從而形成了這種純粹自然而然的體驗感受。

最後,從設計人性化的角度,它有利於培養用戶習慣,即培養用戶規範化內容,梳理內容的好習慣,這涉及到設計的反思層(本能層、行為層、反思層),使用數字來組織筆記類別,與隨意拖動組織筆記對比,最明顯的優點是用戶對自己內容的掌控程度的提升。我能準確地瞭解我的第一部分內容主題是 A,第二部分內容主題是 B,這就是數字的魅力——準確性。

再看「最近筆記」模塊,它實際上是獨立於整個筆記列表的,它的組織原則與其他筆記是兩條脈絡,最近筆記是根據用戶近期使用情況,以及對用戶很可能會繼續使用的預測來組織的。

4. 更人性化的搜索功能

搜索是眾多產品的重中之重的功能,比如電商類產品,如果用戶不能快速搜索到目標商品,很可能會流失並會影響到周圍的其他隱藏用戶。

事實上搜索框沒有太多可以優化的體驗點,無非是外觀樣式、層級強弱的調整,以及快速輸入和快速刪除等細枝末節,搜索功能最重要的其實是搜索結果頁,涉及到搜索結果的內容呈現方式,這也是用戶最終的體驗目標——尋找目標內容或商品。

結果頁內容呈現中,最重要的非信息的組織排列方式莫屬了。回想幾年前的搜索結果頁,大多是內容的無腦堆砌,或者按照一個既定規則鋪陳的列表。這種結果頁就像是咖啡廳給了你一份擁有上百種不同咖啡的菜單,篩選成本極高。如今的搜索結果則結合用戶習慣、用戶預期、關鍵熱詞、搜索歷史等內容,經過分析和綜合,為用戶呈現邏輯清晰又完整的搜索結果。

如下圖知乎的搜索結果,第一個組織模塊是對準確搜索結果的展示,第二個組織模塊是對熱詞的呈現,第三個組織模塊是對搜索歷史的呈現,三者分別對應不同的用戶場景,一是用戶有準確搜索目標,二是用戶以瀏覽和閒逛為出發點的killtime式場景,三則是預測用戶有重複查看相關主題的回答的行為。

用超多案例,為你詳細解析簡化設計經典四策略

排列組織這四個字中,排列只是呈現形式,核心則是組織,它意味著你如何定義內容的分類和優先級,也意味著你是否能夠按照用戶需求來歸類內容。

隱藏原則

用超多案例,為你詳細解析簡化設計經典四策略

比起其他幾個原則,隱藏原則似乎不怎麼受歡迎,因為很大程度上,隱藏更像是一種妥協,當然這是從悲觀角度來講。它恰恰像是,既不能刪除,又不能通過組織原則降低複雜性,最終只能妥協來隱藏。事實上在我們實際設計產品時,經常會遇到這種食之無味,棄之可惜的情況,就像中國傳統的中庸之道,總有一些情況下非黑即白原則會失效。

這一點反應在產品設計中就是以下幾個要素,複雜性、干擾性、低頻、有用性。

設計人員清楚地瞭解到,產品應當進一步被簡化,例如擁有過多內容的時候,像一個用戶動態卡片,可能同時包括暱稱、年齡、性別、星座、動態發表時間、標籤主題、標題、正文等諸多內容。如果想清晰的呈現以上所有內容,最終會導致版面信息太過飽滿。在使用組織原則後,對信息的大小、顏色、層級進行處理,從而形成了良好的信息梯級視覺層次,例如下面的VUE的feed流卡片,通過組織原則解決了複雜和混亂的問題,事實上,這個效果相當驚豔,但即便你如何排列,內容的總的複雜度並沒有變化,這造成的結果就是一張feed流卡片佔據了大半個屏幕,一屏顯示的feed數量十分有限。

用超多案例,為你詳細解析簡化設計經典四策略

另一種情況則是信息對用戶的核心體驗目標,以及產品的核心功能或內容構成干擾。例如閱讀類產品的上下導航欄和菜單欄,會減少用戶閱讀區域以及干擾用戶閱讀體驗。為什麼隱藏,因為它不好,或者不夠好,那又為何不直接刪除,這就涉及到後面兩個特性。即低頻和有用性,在各種產品中經常會有那種使用頻率很低的功能內容但它偏偏又很有用,同時又只對特定場景下的用戶有用,於是刪也不得,露也不得,只好隱藏。

對於那些對產品及用戶不夠理解的設計人員來說,隱藏原則通常只是一種妥協,設計人員或PM無法判斷功能是否可以刪除(沒有經過足夠的調研),恐懼功能的缺失造成用戶流失,但又不願前置這些功能造成產品的複雜度提升,於是選擇妥協方案。而對於那些真正理解產品和用戶的團隊來說,隱藏原則會是一個提升體驗的利器,可以在其他幾大原則的基礎上為產品體驗錦上添花,製造那些真正觸動人心的設計瞬間。下面讓我們來看一些案例。

1. 支付寶上滑隱藏效果

上滑隱藏效果是目前主流設計方案中最為常用的一種,以下面的支付寶為例,首頁常規效果會將四個功能入口前置,因為其使用頻率較高,不管基於體驗目標還是業務目的都要給予其「咖位」,然而在用戶上滑時,專注的更多是主屏的其他內容,因此即便頂部功能入口極為重要,在考慮到實際場景後,仍然要選擇隱藏,只展示不影響操作的高度(一般為88——120px)。

用超多案例,為你詳細解析簡化設計經典四策略

2. 閱讀類產品中的隱藏

閱讀類產品自然會拿風頭正盛的微信讀書舉例,微信團隊在體驗設計領域的耕耘真的是,,,好,原諒我文化低組織不出更優雅的讚賞詞語。

事實上這種隱藏操作控件的方式在閱讀類產品中已經是習以為常了,基本算是基礎體驗的範疇。但不得不提的是微信添加書籤的隱藏操作,是真正意義上的設計驚喜的瞬間,同時也激發了設計師更多的設計靈感,原來除了界面中間區域可以設計,上下左右各個邊界也同樣可以設計,這就是創新的魅力,一次創新帶動的是整個行業的創新,正如當年的下拉刷新。

用超多案例,為你詳細解析簡化設計經典四策略

3. 網易雲音樂中的隱藏原則

你以為我使用網易雲音樂是因為評論區那些騷話?我是奔著它的體驗去的,信我!網易雲音樂對歌詞的隱藏設計極為舒適,用戶只需要輕輕點擊黑膠唱片,就能喚出歌詞詳情,很多人重視歌詞,但也有很多人真的不carry。更多的用戶只想要在膠片緩緩轉動、時光傾斜的短暫瞬間,享受片刻的寧靜。需要歌詞的隱藏膠片,需要膠片的隱藏歌詞,兼顧不同用戶群,同時又打造出完全一致的體驗,這的確是使用隱藏原則的一個優秀案例。

用超多案例,為你詳細解析簡化設計經典四策略

4. B站的標題隱藏

最後我們再舉一個例子,新的萬惡之源,國產 Youtube,新時代教育之光,嗶哩嗶哩。B 站視頻標題通常都比較長,同時各種版權、備註等信息繁多,如果全部展示出來一方面會干擾到核心內容也就是視頻區的展示,一方面會降低一鍵三連等常規操作的權重(位置下移),這就很鬱悶了。根據格式塔原理,視頻相關的這些信息理應圍繞標題和視頻進行排列,但如果真的按順序排列下來,無論從體驗還是業務角度講都無甚益處。

但這些內容又無法刪除,部分用戶的確有對應的需求,這正契合我們上面提到的隱藏原則適用場景,干擾、低頻、但有用。於是將其隱藏,對於特定場景的用戶完全可以稍微挪動你的小手,點擊來查看標題等輔助信息,對於主流用戶群來講,也不會干擾它們瀏覽內容和執行操作的體驗流程。

用超多案例,為你詳細解析簡化設計經典四策略

隱藏不等於消失——提供線索

隱藏使核心功能得以凸顯,簡化產品,弱化干擾。同時我們仍有一個必須注意的原則,那就是隱藏不等於消失。之所以將某個功能或內容隱藏而不是刪除是因為它有其存在的意義和價值。例如一些輔助功能,或者專家級用戶的專屬功能。如果是將其過度隱藏,實則與刪除無甚差別。因此,在隱藏的同時我們必須提供線索,以暗示用戶有更多內容潛藏在背後,我們最熟悉的就是 PS 等擁有複雜功能模塊的生產力工具產品。如果要把所有功能全部呈現出來,一方面版面有限無法承載,一方面則會造成用戶選擇和辨識的效率低下。除了功能的隱藏,當然還有內容的隱藏,常見的就是使用「?」或「…」標識來隱藏一些輔助信息,一般傾向於隱藏說明性內容以及繁瑣的細節描述性質的內容。

[llink https://www.uisdc.com/6-common-hidden-menus]

用超多案例,為你詳細解析簡化設計經典四策略

轉移的奧秘

產品設計遵循複雜性守恆定律。也就是說,用戶想要完成一個體驗目標,想要執行一個任務,從產生動機到執行完畢的這個過程,其複雜性是固定的。在這期間,此任務由用戶操作和機器/設備的運作共同組成,也就是我們所說的交互,因此完成一個用戶任務的複雜度是平分給用戶和設備/軟件的,注意不是均分。例如整個流程的複雜度是 100,如果想要優化用戶體驗,降低用戶操作和理解的複雜度,就需要把 100 複雜度中更多的比例分給設備/軟件,可能用戶需要花費 20 複雜度的精力,而剩餘 80 複雜度的工作由機器完成,這就是簡化四原則中的「轉移」。

但需要注意的是,雖然用戶的體驗和效率提升了,但複雜度並沒有消失,而是轉移到 了開發團隊身上,開發團隊要花費比以前更大的精力來解決軟件/設備運行中的問題。因此,轉移法則在 C 端是聖盃原則,因為用戶的經驗能力參差不齊,設計體驗應當以極端用戶(弱能力弱經驗的用戶)的能力為邊界,此時傾盡全力降低用戶端的複雜度既有利於用戶體驗,也有利於商業轉化。

而針對 B 端產品,則需要考慮產品團隊的能力狀況。B 端的典型特點就是複雜的交互邏輯與大批量的數據處理和展示。通常一些複雜的後臺產品需要提供教程、培訓、客服支持等服務,以幫助用戶學習複雜的 B 端軟件。雖然產品設計師應當保證產品的易用性和易學性,但B端產品限於其複雜度,無法做到 C 端那樣易學。所以針對 B 端的產品團隊,可以考慮在自己能力範圍內轉移複雜度,不要過度追求用戶端的易學性。否則,百分之二十的複雜度轉移到開發團隊,帶來的成本可能數倍乃至更高的提升。

下面看一些複雜度轉移的案例:

1.首先最經典的就是小米生態產品

小米電視

大家先回憶下「古時候」的滑蓋電視遙控器,實際上當時的廠家也意識到遙控器過於複雜,而常用的功能其實有限,但傳統行業就是如此糾結,恐懼捨棄一些功能會影響到產品體驗,於是選擇隱藏次要功能。 但隱藏只是治標不治本,而真正解決遙控器過於複雜的問題的正式轉移方法。如下圖所示,小米遙控器只提供方向鍵、home 和返回鍵,聲音調節、開關機等最基本的功能,而其餘所有更復雜的操作都轉移到電視機屏幕,電視有更大面積的操作面板,為什麼不把更復雜的操作轉移到上面呢?何必在一個不到 20 cm 的遙控器面板上糾結?

用超多案例,為你詳細解析簡化設計經典四策略

小米電子秤

殊途同歸,小米生態圈的產品大多數都運用了轉移法則,這某種程度上是因為手持設備的快速發展,為複雜度轉移提供了基礎設施。小米電子秤就是如此,將電子秤獲得的數據同步到移動端,用戶可以在手機上舒適地瀏覽測量的結果,而不必緊緊盯著電子秤那塊狹小的屏幕。

用超多案例,為你詳細解析簡化設計經典四策略

2.順豐的自動識別地址功能

我應當沒記錯,這個體驗功能應當是順豐首發,後面逐漸成為快遞行業的標準體驗配置。在實現自動識別內容之前,這個痛點應該困擾了眾多用戶需求,事實上不僅僅是有快遞需求的用戶,包括快遞業務人員也深受一些體驗上的問題困擾,從收件到寄件,涉及到提現內容,確認內容和收發信息等。得益於快遞行業的快速發展,相關領域的體驗設計也在飛速進步,目前從寄件到收件,從普通用戶到快遞服務業人員都能利用手持設備快速完成各自的體驗目標。

用超多案例,為你詳細解析簡化設計經典四策略

3. iphone11的自動喚醒

叫醒一個睡著的人需要幾個步驟?推一下或者喊一下。本質上是提供一個觸發信號或者命令。喚醒手機也是如此,它的複雜度是固定的,在我們沒有進化到可以用意識操縱事物的當下,想要喚醒激活一臺設備必須要提供一個觸發的機制,用戶需要發出觸發指令才能正式激活設備。傳統的喚醒手機的方式就是 home 鍵,有密碼的情況還需要屏下指紋和背部指紋,當然如 OV 和三星,都在優化體驗後將這兩個行為結合,從而通過手指單次按壓實現激活 + 解鎖。

而 iPhone11 不同,在用戶將手機移動並使屏幕朝向面部的情況下,手機會自動喚醒。這種體驗流暢而令人驚喜,省去了按壓 home 鍵的步驟,用用戶無意識的抬手行為執行了發佈命令的操作。這其實就是將用戶喚醒手機的複雜度轉移到了設備,設備通過識別手機位置,角度的變化,來判斷用戶是否需要解鎖手機。可以預見,轉移複雜度必然是未來設計的方向,更多基礎的操作和交互將會轉移至設備,底層的交互方式逐漸弱化,語音,智能識別等交互方式將佔據大多數交互場景。設想一下,在你微微抬手,眉眼輕蹙間,對應的功能已經為你呈現在面前,視線輕移,頁面自動滾動,那會是怎樣的一個體驗設計時代。


分享到:


相關文章: