2021-8-16 資深UI設(shè)計者
編輯導(dǎo)讀:隨著產(chǎn)品的迭代升級,增加越多功能,設(shè)計相對地也會越復(fù)雜,用戶需要花費更多的精力來理解產(chǎn)品邏輯和使用具體功能。因此對產(chǎn)品進(jìn)行簡約有效設(shè)計是十分有必要的。本文作者對此進(jìn)行了分析,與你分享。
產(chǎn)品是一個功能集合體,隨著迭代優(yōu)化,會變得越來越復(fù)雜,這也意味著用戶需要花費更多的精力來理解產(chǎn)品邏輯和使用具體功能。因此對產(chǎn)品進(jìn)行簡約有效設(shè)計是十分有必要的。簡約有效原則跟一致性原則比較類似,本身的含義比較廣泛,此文中,對簡約有效的原則作如下約定:
“簡約有效設(shè)計指的是設(shè)計方案在滿足用戶和產(chǎn)品需求的前提下,應(yīng)該最大程度的降低產(chǎn)品復(fù)雜度和用戶使用成本,以保證用戶使用產(chǎn)品的體驗和效率,最終達(dá)到為用戶和產(chǎn)品提供更多價值的目的。”
簡約有效的設(shè)計最大特點是“簡約”和“有效”。
簡約——能降低產(chǎn)品的復(fù)雜度
“簡約”指的是在滿足需求的前提下最大程度的降低產(chǎn)品復(fù)雜度。從普遍的角度來講,一個簡約的設(shè)計一定能夠極大的提升用戶的使用體驗和產(chǎn)品的使用效率。
有效——能滿足用戶和產(chǎn)品的需求
“有效”指的是設(shè)計方案必須能夠滿足用戶和產(chǎn)品的需求,這是設(shè)計最為基礎(chǔ)的要求,如果設(shè)計方案不能滿足用戶或產(chǎn)品的需求,那什么樣的設(shè)計都是沒有意義和價值的。
在設(shè)計中,遵循簡約有效原則不僅可以保證設(shè)計方案的合理性,還可以為用戶和產(chǎn)品提供更多的價值和服務(wù)。
簡約有效設(shè)計對用戶的價值主要體現(xiàn)在提升用戶體驗方面。
1)降低用戶使用的成本,提升產(chǎn)品使用效率
簡約有效的設(shè)計可以降低產(chǎn)品邏輯結(jié)構(gòu) 、頁面布局、交互操作等的復(fù)雜度,從而減少用戶的認(rèn)知和使用成本以及提升產(chǎn)品的使用效率。
2)更好的情感設(shè)計化
從心理學(xué)角度來講,越簡單的東西會越符合用戶預(yù)期,也越容易獲得用戶的信賴和好感,而簡約有效的設(shè)計可以降低產(chǎn)品的復(fù)雜度,降低用戶的而使用和認(rèn)知成本,因此簡約有效的設(shè)計可以有效地提升產(chǎn)品的情感化設(shè)計,為用戶提供更好的使用體驗。
簡約有效的設(shè)計對產(chǎn)品的價值主要體現(xiàn)在保證產(chǎn)品的健壯性和可發(fā)展性。
1)減少產(chǎn)品邏輯的復(fù)雜度和耦合度,保證產(chǎn)品的健壯性
產(chǎn)品功能的復(fù)雜和邏輯耦合是一個無法避免的問題,越是復(fù)雜的邏輯其犯錯的可能性越大,其普適性也越差,但利用簡約有效的設(shè)計可以降低產(chǎn)品功的復(fù)雜度,去除不合理的設(shè)計,減少各個功能模塊之間的耦合度,從而保證保證產(chǎn)品結(jié)構(gòu)的的合理性和健壯性。
2)為產(chǎn)品預(yù)留更多的拓展空間,保證產(chǎn)品的可發(fā)展性
從設(shè)計經(jīng)驗上來講,產(chǎn)品做減法的成本遠(yuǎn)遠(yuǎn)大于做加法。利用簡約有效的設(shè)計在一定程度上是可以避免產(chǎn)品“過度”發(fā)展的問題,因為其目的就是降低產(chǎn)品的復(fù)雜度,這也意味著為產(chǎn)品預(yù)留更多的拓展空間,保證了產(chǎn)品的可發(fā)展性。
簡約有效設(shè)計的內(nèi)涵是非常廣的,不是簡單的刪減功能或者減少頁面的中元素就是簡約有效的設(shè)計,其最基本的原則是“先有效,再簡約”,即在保證設(shè)計“有效性”的基礎(chǔ)上,再進(jìn)行“簡約性”設(shè)計,“有效”比“簡約”的優(yōu)先級高且重要。設(shè)計中,可以從以下幾個方面和角度進(jìn)行簡約有效的思考和設(shè)計。
設(shè)計中的任何邏輯或元素都必須要有明確的目的和價值,如果設(shè)計的目的性和價值性不明確或者達(dá)不到預(yù)期,那么這樣的設(shè)計是不合格的。設(shè)計的目的性和價值性可以說是所有設(shè)計的基本原則和要求,同樣也是是簡約有效設(shè)計的重要評估標(biāo)準(zhǔn)和指導(dǎo)原則之一。
簡約有效原則本質(zhì)上就是對設(shè)計進(jìn)行“簡化”設(shè)計,但不能為了單純的簡化而無限制的“刪減”設(shè)計,其中重要的一點就是需要保證設(shè)計的特征性。設(shè)計的特征性能夠表明設(shè)計的特點,用戶通過這些特點性,以快速的辨別,理解和使用產(chǎn)品。例如在剪切板圖標(biāo)中,其剪切的含義就是其非常重要的特征,一般來說就是剪刀元素,而這個設(shè)計特征是不能被刪除簡化的,需要在設(shè)計中進(jìn)行有效地表達(dá)。
產(chǎn)品功能結(jié)構(gòu)層次是產(chǎn)品的主要框架,決定了用戶的主要體驗路徑,其設(shè)計的好快直接影響了用戶體驗的好壞。利用簡約有效原則不僅可以合理規(guī)劃產(chǎn)品功能結(jié)構(gòu)層次,還可以降低產(chǎn)品結(jié)構(gòu)層次的“復(fù)雜度”,提升用戶的使用體驗。設(shè)計中,可以從以下幾個方面考慮產(chǎn)品結(jié)構(gòu)層次的“簡約有效”設(shè)計。
1)合理的橫向和縱向結(jié)構(gòu)層級數(shù)
產(chǎn)品結(jié)構(gòu)層級設(shè)計中既不能讓橫向結(jié)構(gòu)層次過于扁平,也不能讓豎向結(jié)構(gòu)層次過于縱深,前者容易導(dǎo)致產(chǎn)品功能結(jié)構(gòu)分散和用戶認(rèn)知混亂,后者容易導(dǎo)致用戶操作路徑過長,操作成本過高。
2)同級結(jié)構(gòu)層次之間的獨立性
簡約有效的設(shè)計可以讓產(chǎn)品同級結(jié)構(gòu)層次之間保持相對獨立,這樣不僅可以減少結(jié)構(gòu)層次之間的交叉和耦合,減少后續(xù)產(chǎn)品迭代優(yōu)化時的“耦合障礙”,還可以保證層級結(jié)構(gòu)本身邏輯的“簡約性”。
3)父子結(jié)構(gòu)層級之間的關(guān)聯(lián)性和邏輯性
簡約有效的設(shè)計可以讓產(chǎn)品父子層級之間有含義明確的邏輯性和關(guān)聯(lián)性,從而減少用戶的理解認(rèn)知和操作使用成本。一般來說,父級層次結(jié)構(gòu)趨向于展示概括信息和重點信息,子級層級結(jié)構(gòu)展示詳細(xì)信息和次要信息,從而使產(chǎn)品結(jié)構(gòu)層級更加符合用戶的認(rèn)知和習(xí)慣,提升產(chǎn)品的使用效率和使用體驗。
產(chǎn)品中用戶的操作任務(wù)是相對是確定的,但同一個任務(wù),可以通過不同的方式和路徑來完成,其成本和體驗也是不同的。利用簡約有效的設(shè)計原則可以讓產(chǎn)品的操作路徑更加合理有效,降低不必要的操作和路徑,提升用戶的操作效率和使用體驗。
1)用戶路徑長度的合理性和邏輯性
用戶的操作路徑的總長度應(yīng)該相對較短且合理,一般來說不建議超過5個環(huán)節(jié),否則用戶任務(wù)完成率和體驗會有斷崖式的下降。此外,用戶的操作路徑中上下文前后操作節(jié)點應(yīng)該有著合理的邏輯性和關(guān)聯(lián)性,以便保證用戶對整個操作路徑的理解。
2)單個操作環(huán)節(jié)的目的性
每一個操作環(huán)節(jié)應(yīng)該有著明確的目的和主題,即操作環(huán)節(jié)需要讓用戶集中精力處理一個重要的操作任務(wù),不能讓沒有意義的任務(wù)和信息分散用戶注意力。
3)單個操作環(huán)節(jié)內(nèi)容的有限性
每一個操作環(huán)節(jié)中,用戶需要處理的任務(wù)以及信息應(yīng)該是有限的,不能讓用戶同時處理過多的信息或者過于復(fù)雜的任務(wù),否則會極大地增加用戶的負(fù)面體驗。如果單個任務(wù)環(huán)節(jié)中包含的信息較多或操作任務(wù)較為復(fù)雜,可以考慮拆分任務(wù)和適當(dāng)?shù)脑黾佑脩舨僮髀窂降拈L度。
4)線性的操作路徑
不要為用戶操作路徑設(shè)置過多的分支路徑或選擇,而是應(yīng)該讓用戶操作路徑趨向于串聯(lián)且線性的,這樣不僅可以降低產(chǎn)品的復(fù)雜度,還可以可以降低用戶的理解和使用成本,從而提升用戶體驗和操作效率。
簡單有效的頁面布局不僅可以更好的幫助產(chǎn)品達(dá)到預(yù)期目標(biāo),還可以極大的提升用戶體驗。設(shè)計中,可以從以下幾個方面考慮頁面布局的“簡約有效”設(shè)計。
1)頁面布局符合用戶認(rèn)知和習(xí)慣
頁面的布局一定要符合用戶的認(rèn)知和習(xí)慣,否則再怎么“簡單”的頁面,用戶理解起來也會費勁或者產(chǎn)生理解歧義。例如中文用戶的閱讀習(xí)慣都是從左到右和從上到下,用戶的操作習(xí)慣大多是先閱讀信息再進(jìn)行操作,因此常見的布局都是將操作按鈕布局在頁面右側(cè)或者底部。
2)頁面布局的信息是有價值且有效的
頁面中布局展示的信息一定要對用戶或產(chǎn)品有價值,如果對用戶和產(chǎn)品都沒有價值的信息,那頁面中就不需要這個信息,這是簡約有效設(shè)計的基本準(zhǔn)則之一。此外頁面布局中的信息一定要是有效的,不能讓用戶產(chǎn)生歧義,從而達(dá)到降低用戶使用成本和提升使用體驗的目的。
3)頁面信息布局的規(guī)律有序
頁面中布局的信息一定要規(guī)律有序,其主要目的是方便用戶閱讀以及理解,從而提升用戶的使用效率和體驗。讓頁面中的信息規(guī)律有序,最常見最簡單的方法就是將信息分類成組后再在頁面中展示。
4)避免頁面信息過載
頁面中的信息密度必須適中,不能信息過載,否則就會導(dǎo)致用戶瀏覽效率低,理解成本高以及操體驗差的后果。簡約有效原則是避免頁面信息過載的基本方法之一,其原則就是重點信息優(yōu)先展示,刪除不必要信息或者隱藏次要的信息,利用不同的頁面和層級結(jié)構(gòu)將信息的“復(fù)雜度”轉(zhuǎn)移分?jǐn)偝鋈ィ瑥亩WC用戶當(dāng)前操作頁面信息密度的合適。
5)頁面應(yīng)該聚焦用戶當(dāng)前任務(wù)
頁面布局的信息應(yīng)該與用戶當(dāng)前正在處理的任務(wù)緊密關(guān)聯(lián),不讓無關(guān)的信息分散用戶注意力以及干擾用戶當(dāng)前的任務(wù)流程。如在自有賬號登錄頁面中,忘記密碼,注冊以及第三方登錄等次要信息的布局和樣式就不能過分顯眼,否則就會影響登錄頁面主要任務(wù)的完成——輸入賬號和密碼。
UI設(shè)計是產(chǎn)品功能邏輯的視覺化表現(xiàn),其直接影響了產(chǎn)品的使用體驗。與其他設(shè)計原則一樣,簡約有效原則也是UI設(shè)計的重要的標(biāo)準(zhǔn)之一,設(shè)計中,可以從以下幾個方面思考和衡量簡約有效的UI設(shè)計。
1)一致的設(shè)計語言和風(fēng)格
一致的設(shè)計語言和風(fēng)格可以確保產(chǎn)品在視覺上的統(tǒng)一性和規(guī)范性,進(jìn)而降低用戶認(rèn)知和使用成本,即從視覺形式上和用戶認(rèn)知層面,降低了產(chǎn)品的復(fù)雜度,提升了用戶信息瀏覽、理解以及操作的效率和體驗。
2)正確無誤的信息傳遞和表達(dá)
UI是各種產(chǎn)品信息的視覺載體,因此其一定要能夠準(zhǔn)確無誤的傳遞和表達(dá)出信息的真實含義,不能因為UI設(shè)計而導(dǎo)致用戶對信息產(chǎn)生誤解或者歧義,這也是“簡約有效”的UI設(shè)計中“有效性”的重要組成部分之一。
3)重要信息重點表達(dá)
UI設(shè)計需要做到信息表達(dá)準(zhǔn)確且層次分明,即重要信息重點表達(dá),次要信息次級表達(dá)。這樣設(shè)計的目的就是利用UI設(shè)計增強(qiáng)重要信息表達(dá)和傳遞的“簡約性”和“有效性”,即從信息層面上降低了頁面的復(fù)雜度。重點信息重點表達(dá)的最基本的方法就是在視覺上讓重要信息和次要信息形成較為明顯的對比,如常見的文本加粗,使用高亮顏色(彩色)等。
4)清晰正確的邏輯表達(dá)
UI也是功能邏輯的可視化載體,因此UI設(shè)計一定要保證產(chǎn)品功能邏輯表達(dá)的清晰和準(zhǔn)確,不能因為UI設(shè)計而導(dǎo)致用戶對功能邏輯的錯誤理解。如賬戶模塊中,賬號密碼的校驗過程 和出錯提示等邏輯必須能夠通過UI清晰正確的表達(dá)出來,保證用戶在登錄過程中,能夠通過UI理解這些邏輯,且不會產(chǎn)生任何歧義。
產(chǎn)品功能邏輯設(shè)計是產(chǎn)品和用戶交互的直接決定因素,可以說,功能邏輯設(shè)計的好壞直接決定了產(chǎn)品體驗的好壞。簡單有效的邏輯設(shè)計不僅可以降低功能邏輯的復(fù)雜度,還可降低產(chǎn)品的迭代開發(fā)的成本和用戶使用成本。設(shè)計中,可以從以下幾個方面考慮“簡單有效”的邏輯設(shè)計。
1)在保證邏輯完整性的基礎(chǔ)上,盡量降低功能邏輯的復(fù)雜度
在設(shè)計中,保證產(chǎn)品功能邏輯的完整性是基礎(chǔ)的且必要的條件,在此基礎(chǔ)上,再考慮降低功能邏輯的復(fù)雜度,不能為了簡約而簡約。
2)功能邏輯的獨立性
在功能邏輯設(shè)計中,應(yīng)該盡量保證功能邏輯的獨立性,減少功能邏輯之間的耦合性和依賴性。因為功能邏輯的耦合性和依賴性必然會導(dǎo)致對邏輯本身和用戶產(chǎn)生更多的限制性和要求。此外,功能邏輯之間的耦合性和依賴性不僅會提升產(chǎn)品的復(fù)雜度,還會影響產(chǎn)品的健壯性、后續(xù)的拓展性以及造成迭代成本的提升。
3)為用戶設(shè)計,轉(zhuǎn)移邏輯設(shè)計的復(fù)雜度
產(chǎn)品功能邏輯的復(fù)雜度是可以降低的,但是不可能無限制的降低。當(dāng)無法降低功能邏輯的復(fù)雜度時,可以使用其他方法來降低功能邏輯的“復(fù)雜度”,最常見的就是“轉(zhuǎn)移復(fù)雜”,即不改變邏輯的設(shè)計,而是改變這些邏輯的表現(xiàn)形式和方式,將邏輯的“復(fù)雜度”轉(zhuǎn)移到不同的功能模塊中或者不同的形式上。例如在線請求數(shù)據(jù)的異常邏輯有很多種,這些異常對于邏輯設(shè)計和產(chǎn)品優(yōu)化是有很大價值的,但對用戶來說這些異??赡苁请y以理解或者是沒有價值的,可以將這些異常邏輯進(jìn)行歸類分組,同一組的異常使用相同的提示設(shè)計,如網(wǎng)絡(luò)故障相關(guān)的異常,都可以提示用戶去檢查手機(jī)中的網(wǎng)絡(luò)設(shè)置,而不用每一中網(wǎng)絡(luò)故障的異常都單獨設(shè)計一個異常提示。
4)提供合理的參數(shù)值和默認(rèn)項
功能邏輯設(shè)計中涉及到大量的設(shè)置項和參數(shù),為這些設(shè)置項和參數(shù)提供合理的數(shù)值和默認(rèn)項,可以極大降低的用戶的理解和使用成本。例如在地圖導(dǎo)航軟件中,用戶選擇導(dǎo)航線路時,需要確定起點位置和終點位置,常見的起點位置默認(rèn)參數(shù)就是當(dāng)前用戶的位置,這種設(shè)計邏輯可以滿足絕大部分用戶在絕大部分場景下的導(dǎo)航需求,減少用戶起點位置的輸入。
5)更少的操作和選擇
在設(shè)計中,任何的操作和選擇對用戶來說都是一種負(fù)擔(dān),所以應(yīng)該避免為用戶設(shè)計過多的操作和選擇,較少的操作和選擇就是降低產(chǎn)品功能邏輯的復(fù)雜度。如果無法減少功能的操作和選擇,那么應(yīng)該優(yōu)化頁面信息層次、操作路徑和具體的頁面布局來使邏輯操作和選擇更加合理,使用成本更低,使用體驗更好。
6)為絕大部分場景和用戶設(shè)計
邏輯完整性是設(shè)計的基本要求,但在實際中經(jīng)常會碰到低頻場景、小部分用戶群體需求或者大部分用戶群體的低頻需求等“異常條件”,這些都可能對產(chǎn)品的功能邏輯設(shè)計帶來影響,但是絕對不能因為這些“異常條件”去更改主體設(shè)計方案,即在任何時候,都應(yīng)該為絕大部分場景和絕大數(shù)用戶設(shè)計,按照經(jīng)驗來講,是不可能有滿足100%需求的設(shè)計方案。類似的,我們應(yīng)該更多的考慮產(chǎn)品的正向使用場景,不要讓負(fù)向場景過多的影響功能邏輯的設(shè)計方案,即這些非正向場景可以為設(shè)計提供參考,但不能決定設(shè)計方案。
簡約有效是一個非常普適性的設(shè)計原則,其可以為產(chǎn)品和用戶帶來非常多的好處,其具體內(nèi)涵是非常廣泛的,其中有些內(nèi)容不僅僅是簡約有效原則獨有的,可能與其他設(shè)計原則有著較強(qiáng)的關(guān)聯(lián)性和交叉性,如“一致的設(shè)計語言和風(fēng)格”,雖然是一致性設(shè)計原則的內(nèi)容,但卻可以讓設(shè)計很好的表達(dá)出“簡約有效”。
藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請掃碼ben_lanlan,報下信息,會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系。
文章來源:人人都是產(chǎn)品經(jīng)理 作者:小乞丐
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。
藍(lán)藍(lán)設(shè)計( www.wnxcall.com )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計、BS界面設(shè)計 、 cs界面設(shè)計 、 ipad界面設(shè)計 、 包裝設(shè)計 、 圖標(biāo)定制 、 用戶體驗 、交互設(shè)計、 網(wǎng)站建設(shè) 、平面設(shè)計服務(wù)
藍(lán)藍(lán)設(shè)計的小編 http://www.wnxcall.com