交互體驗設計的核心概念之:示能與意符

2022-3-3    ui設計分享達人

很多沒有接觸過交互體驗的設計師小伙伴們,總有會面臨一個坎,那就是看別人做交互和體驗的方案總是特別簡單,一個流程或原型別人做出來之后,我們心里總會想,那不就是這樣嘛?換我也能做,但是只要自己一上手就不行了。


為什么?因為我們總是看著別人的結果下結論,而忽略了中間的思考過程。

就好像是吃著別人做的番茄炒蛋,你會覺得不就是番茄和雞蛋一起炒一下,然后放點鹽和糖就好了嘛,我們只看到了結果,而忽略了對食材的選擇、處理、順序、結合。




1.示能


當我們看到一個控件,你覺得它不就應該在那里嘛,但輪到自己開始做,就壓根想不到要去用那個控件,甚至是信息布局、流程節(jié)點、整體結構都規(guī)劃不出來。不知道大家有沒有看上一篇原創(chuàng)文章結尾那個作業(yè),如果做過的小伙伴可以發(fā)我交流一下。傳送門--》


所以很多UI設計師覺得做純執(zhí)行的工作很沒有意思沒有價值。因為方案是別人做好的,思考過程也是別人的,而商業(yè)設計師的核心是解決問題,解決業(yè)務和用戶的問題,既然解決問題的角色都是UI的上游,那么UI設計如何體現(xiàn)價值呢?當然就是把交互體驗的核心底層概念搞懂,和交互設計一樣從設計側去思考問題,賦能業(yè)務。


OK,那么來我們先來講:示能



1.1示能


心理學家吉普森將示能描述為:“關于有形物品如何傳達出人們與它們互動的重要信息,這個特性被吉普森命名為“示能”。



用很直白的話來講,意思就是:事物通過自己外在的形態(tài),向使用者展示自己具有的功能和用途。在日常生活中例子比比皆是,例如一扇打開的門,告訴人們可以進出、通過。一張椅子,人可以坐、可以靠。


假如,你面前有一扇門,門上有一個把手,這扇門告訴我可以利用這個把手與我進行互動,你可以用手、可以用腳,也可以用舌頭,但手是最方便的。如果只是單扇門,那么我們可以利用推或者拉的動作打開,但如果是兩扇門并排,兩個把手在中央靠近,那么這時候門展示出來的意思就是兩扇門都可以推或拉。但如果門把手在門的靠外兩側,那么意思就變了,變成了將門側滑后才可以通過。


那門為什么要設計成不同樣式來展示不同示能呢?這個留給大家思考,這三種門設計的初衷是什么。



在我們數(shù)字產(chǎn)品中可以有什么體現(xiàn)呢?例如一個開關控件(switch),開關本身具有兩種互斥的屬性和功能:開/關、啟動/禁用,看到開關控件的外在樣式,我們可以判斷當前開關所屬模塊以及意符指示內容的狀態(tài)是屬于打開還是關閉。


開關在現(xiàn)實生活中的表現(xiàn)樣式有很多,例如一側翹起的開關、可以撥動的開關、具有段落的按壓開關、分型控制的開關、旋鈕開關等



大家別看開關看起來簡單,但是在設計起來會遇到不少的問題,因為狀態(tài)和意符形態(tài)在我們日常中過中很難成為一個標準,例如最常見的一側翹起的開關,如果不加意符,我們不知道讓哪邊翹起才是開/關。如果你的房間就一盞燈,那么很簡單,我閉著眼睛去按就行了,燈滅著那肯定就是關,再按一下那就是開。但如果在客廳中有多個并聯(lián)的開關怎么辦,一個燈可能收到2處甚至3處開關的控制,而每處開關的數(shù)量會在3-5個,這個時候不用意符去標識,就很麻煩了。



回到數(shù)字產(chǎn)品上,開關的示能就簡單多了,有顏色的狀態(tài)表示開,灰色狀態(tài)表示關,但是開關控件在剛用在數(shù)字產(chǎn)品上的時候,很多人經(jīng)常誤以為是滑動交互來控制開關,雖然滑動也可以,但本身依靠更簡單的點擊觸碰就可以了。但如果控件做的很長,那么滑動的示能就會更明顯。



開關比較讓人產(chǎn)生歧義的地方來自于意符,因為很多新人將一些控件的屬性認為是有重疊關系,可以混用的,那就大錯特錯了,等會講。



1.2.反示能


和示能相反,指的是任何物體之間不能進行怎樣的互動。


例如我們經(jīng)常做的人體工學椅,你可以靠坐在椅子上,并把手放在扶手上,但你無法在椅子上蹦跳,因為椅子無法支撐劇烈晃動。你也不可能用椅子打游戲,它本身不具備這樣的功能。再比如我們褲子的口袋,設計師通過設計他的形狀、大小、材質,幫助我們去盛放一些小物件,例如鑰匙、手機、卡片,但是筆記本電腦你塞不進去,一頭豬更塞不進去。


數(shù)字產(chǎn)品中也會遇到一些有很明顯反示能的控件,例如segment Controls(分段控件/分段選擇器/分段選擇控件),它是iOS的原生控件之一,該控件的反示能就是無法通過左右滑動界面切換不同標簽的視圖,和tab不同。



并且在該控件的描述中,seg通常數(shù)量只能在5個以內,并且5個標簽分別屬于同類型的數(shù)據(jù)分割,只支持點擊切換。它不能展開、不能滑動、不能移動、不能懸浮、不能進入二級頁面也不能翻轉。


那有沒有一種可能,或者一個場景需要這兩種控件同時具備一些屬性呢?是有的,例如這樣



在標簽下是列表,而列表也支持輕掃的交互進行刪除,如果使用tab則會產(chǎn)生沖突,而使用seg則在視覺上太重了,和產(chǎn)品調性不符。那么我們可以在示能上做一些調整,讓這個控件看上去不能左右滑動,又不至于太繁瑣。


所以反示能將告訴我們,事物有哪些不具備的功能。同時反示能也是相對的,遇到多樣化的場景和業(yè)務需求時,我們依然要學會變通。



1.3.不同場景中示能的變化


一張桌子放在教室中,我們知道它是用來學習的,桌面上可以放書本、筆等,如果一個桌子放在戶外,并且靠著墻壁,墻壁上有個洞,那么這個桌子當前示能表示為什么呢?一個肌肉發(fā)達的男人在健身房秀肌肉大家紛紛羨慕,但是如果不穿上衣走在馬路上估計很多人會罵他變態(tài)。


下方圖標+文字形式的一個按鈕,放在卡片的左側和右側大家感知一下,表現(xiàn)出來的示能有所區(qū)別。



左側更像是這個模塊的標題,而放在右邊才能讓人覺得可點擊交互。如果覺得不夠明顯我們再用三個點舉例,放在不同位置的3個點小圖標,所表達的示能相差巨大。再例如紅色在彈窗中顯示給人警示,但在活動頁和價格數(shù)字上顯示則給人感覺熱鬧的氛圍和強烈的指引。



這就是不同場景中同樣事物表現(xiàn)出來的示能區(qū)別。所以設計師在設計方案的時候除了要將方案本身屬性表達正確以外,也要考慮到場景的影響。



1.4.相同示能的不同表現(xiàn)方式與含義


這里有一個概念叫做同構異型,說的是結構相同,形式不同。例如我們經(jīng)常用到的tab與其視圖的呈現(xiàn),tab的本質就是利用多個標簽來切換標簽下的視圖,所以標簽除了用tab的形式,還可以用下拉展開成為菜單的形式,只不過一個是平鋪,一個是點開后再列表選擇。



再舉個例子,例如篩選控件,如果我們需要一個實時篩選的功能,那么我們一般會這么做,在b端web設計中,會將一系列篩選條件橫向擺放,每一個篩選條件都可以下拉展開進行篩選,但如果遷移到移動端中,因為橫向距離受阻,就會縱向標簽展開式的篩選模式,從結構上來說,這倆方案其實是一樣的,都是在多個篩選條件中分別篩選出不同的標簽。



再例如一個父子集共生的內容卡片



同構異形在設計樣式上會有很多種,例如列表,例如上文說到的單控開關,雖然樣式很多,但原理上單控開關都是一樣的。


對于初學者來說,不同控件理解的比較片面,所以就會導致一些控件的使用錯誤。


說到同構異形那就不得不提到同形異構,例如一塊素牛肉,外觀和紅燒牛肉一樣,但是它是豆制品。我們再來看下面兩個模塊,根據(jù)整體來判斷,兩邊的加號都是反映出可以點擊添加的示能,但如果我們繼續(xù)考慮交互之后的邏輯和流程就會發(fā)現(xiàn)問題所在了。前者添加的是標簽,添加完后會顯示在相關的區(qū)域,添加按鈕不變。



這里可以用一個比較形象的比喻,我有4張椅子,其中3張坐了人,第四張椅子的示能為:只要這張椅子坐了人,邊上就會出現(xiàn)新的椅子,最多不超過8張,如果沒有人坐則只顯示一張椅子。


但第二個模塊中的添加按鈕結合整體來看是和其他內容毫無相關的添加入口,就好像是第四張椅子上面坐的不是人而是套了一個大箱子,椅子不見了,原本應該和其他內容保持一致的外觀也不見了,出現(xiàn)了一個新的東西,出現(xiàn)了新的示能。所以如果我們要按照第一種規(guī)則玩,那么這里就不能套箱子,如果要放箱子,就需要放在其他的地方。


所以,初學者要警惕同型帶來的使用誤區(qū),有時候長的很像的兩個人,可能完全沒有血緣關系。 


小結

示能的概念大家已經(jīng)了解了,對于我們設計師來說,盡量去搞懂更多事物在不同場景中的示能和反示能,需要解決問題的時候可以針對性的運用各種方案。



2.意符


咱們上一篇講到了第一個概念:示能,如果忘了或者沒看的同學可以再去看一下。


我是傳送門


今天我們要來講意符,意符在外面日常與事物的交互過程中,非常重要。


以下文字比較干,部分需要大家仔細閱讀動腦,覺得難懂的小伙伴可以聯(lián)系我交流


2.1意符的類型與表現(xiàn)形式


示能決定可能進行哪些操作,意符則點明操作的位置以及如何操作。


設計師往往會說,我設計了一個很好的方案,它將告訴你產(chǎn)品的用途,但是用戶卻不知所措,雖然知道產(chǎn)品就在那里,但無法下手,因為意符不明確。例如我們最常用的人體工學椅,可以調節(jié)高低和后仰角度,調節(jié)的控制器是兩個把柄。如果沒有意符加入,我們經(jīng)常會記不清哪一個控制器控制的是后仰角度,哪一個控制的是座椅高度,需要去做更多的嘗試。



所以意符告訴我們對事物正確操作方式以及任何可感知的標識。說白了就是一個能夠表達事物具體操作的符號。


大家還記得上一篇文章舉的一個門的例子嗎?在日常生活中,雙開門通常在商場、大型會議場館內看見,因為考慮到人流量比較多,于是在門上就會出現(xiàn)推/拉兩個文字意符,避免兩側的人同時推或者拉,引導人們正確通行。我們可以使用推/拉,但不可以用“按”,因為我們無法通過“按”的交互來操控門的開關。


如何判斷一個設計是否優(yōu)秀,那么我們會觀察其本身的示能和意符傳達是否自然,如果意符表現(xiàn)的太過刻意或者畫蛇添足那就是很糟糕的設計,例如在兩扇透明的玻璃門上再添加推/拉的標識,就顯得有點多余了。再例如切換短視頻和翻頁電子小說,我們不會用一個翻頁按鈕而是通過滑動來手勢切換。當我們將內容設計全屏的時候就要考慮到當下示能的含義,所以就不要畫蛇添足。


OK,它的表意大家已經(jīng)清楚了,那么在數(shù)字產(chǎn)品中,意符有哪些類型和作用呢?它們又可以幫助用戶解決什么問題,我們來看一看。



意符的類型


1.文字


文字意符是最常見的一種類型,利用文字描述來說明如何進行交互操作,但是中文文字博大精深,不同的描述給人的理解和感受完全不同。


案例1:開關


開關控件單獨拎出來不具備完整的含義,必須在相應的場景中。例如我們在通知、設置的場景中經(jīng)常會用到開關,并且需要相應的文字描述來解釋開關控制的內容是什么。



這里的文字就是意符,用來解釋開關的作用。


開關本身具備的含義中是有這樣兩條原則:

1.需要讓用戶感知操作后立即生效 

2.開關所屬文本必須簡單清晰無歧義


所以咱們可以看下方的案例。當我們將文本描述為“不打開(關閉)則不再進行消息數(shù)字提醒”和“不接受推薦”后,會顯得開關操作含義不明不直觀。正確方式應該是正向且簡單的描述,不要用雙重否定等描述方式。默認描述為打開后的狀態(tài)描述。



再來拓展一下,我們會發(fā)現(xiàn)其實依然還有產(chǎn)品中的開關文字意符用了非正向描述,那按照你的說法不就錯了嗎?我們來看看小紅書和微信的權限開關,這里分別是隱私設置和權限設置。



這里理解起來會有點繞,大家看看能不能理解。首先“只允許我關注的人評論我”這是一個正向描述,沒有問題,如果換成反向描述就會變成“不關注我的人不能評論我”,結合右側的開關,邏輯層面就要多加一個雙重否定的理解,所以這里的用正向沒有問題。


接下來看下面的關系設置:不把我推薦給可能認識的人,誒這里用了反向描述,大家來分析一下,這里是否合理呢?


首先小紅書在新下載應用打開時會向用戶進行授權,為了幫助用戶發(fā)現(xiàn)更多渠道的好友,所以默認在協(xié)議中就會去微博、通訊錄里拉取好友的信息從而在瀏覽內容的時候進行更多好友的曝光和推薦,同時也會將我的信息推薦給認識的人,這樣產(chǎn)品的活躍度、用戶的曝光會提升。


那么大家再來品一品這兩句話:1.“不把我推薦給....” 2.“把我推薦給....”前者比較含蓄,后者則更主動,中國人的關系總體來說就是比較含蓄的,就好像是你可以給我推薦,但我不會主動要求,更何況像小紅書這樣的社交平臺,“可能認識的人”對我來說價值并不是很大。所以我個人也覺得默認不推薦比較好。


不知道這樣的說法大家是否可以接受。再來看微信:不讓他看和不看他。微信這個平臺想必我不用多說,既然是熟人社交更多,那么默認肯定是全部開放,而有特殊需求才需要進行隱私設置,所以默認狀態(tài)為不讓他看-開關關閉,意思是我沒有打開這項非友好的選項。


那為什么會出現(xiàn)有的開關默認打開,有的開關默認關閉,還可以使用反向描述呢?我總結了下,如果涉及到一些隱私和權限的內容,一般我們默認為開關關閉。但如果是為了用戶體驗和效率考慮的內容我們可以默認為打開,例如視頻播放結束自動播放下一個視頻這樣的設置。


開關文字意符的描述方式還有幾種不同的方式:


1.內容標題+開關切換后狀態(tài)與內容變化的描述

第一種類型也就是上方說的案例,但是要注意的是,在描述狀態(tài)變化的時候,文本要正向、簡單的描述,例如開啟后,接收xxx消息,而不要寫成關閉后,不接受xxx消息。


2.功能直接描述

不添加說明文本,直接展示功能標題,例如微信聽筒模式、消息設置、提醒等,直接用開關控制這些功能的打開和關閉,屬于功能設置。還有一種是授權,例如允許他人查看我的收藏,對他人行為的約束,但不能描述為不允許他人查看我的收藏,因為剛才我們總結了,如果對于一些隱私權限的設置默認需要關閉,那么加上正向描述就不能使用“不允許“。


3.批量整體描述

對于同一種類型的功能設置,可以利用批量的形式做整體描述。



再來看一個例子,示能在不夠清晰的情況下,文本意符用來輔助對當前內容/狀態(tài)的解釋



例如b站在瀏覽內容的時候會出現(xiàn)“剛剛看到這里,點擊刷新”,或者當我們在瀏覽信息到一個頁面底部時發(fā)現(xiàn)無法繼續(xù)滑動,會出現(xiàn)一行文案:我是有底線的,說明內容全部展示完畢。



文字意符很直觀,但也要避免歧義。



2.圖形/圖標


圖標在某種程度上當作意符使用的頻率會更高,雖然某些圖標表意不明,但是因為簡約、美觀、生動、普適性強的原因,所以很多地方傾向于用圖標,例如公共衛(wèi)生間、商場的扶梯、通道,通常會用圖標來代替文本,或者強圖標+弱文本的形式。


既然咱們要說圖標意符,而且要突出圖標意符的作用,那就必須有個前提,那就是拋開其他的變量、因素的影響,圖標意符究竟有什么神奇的魔力。



例如我們常用到的列表,很熟悉吧,接下來我將用圖標來讓這個列表的示能產(chǎn)生變化


我們發(fā)現(xiàn),只有文本的列表,示能不明顯,而加上圖標之后就很明確了,甚至加上不同的圖標,示能也隨之變化了呢?刷新、跳轉、展開、移動、選中、刪除、步進、開關、屏蔽、更多。但你不能用撐開、向上展開、旋轉、翻轉、折疊、回退等等。


這些其實是很簡單和基礎的概念,但是很多工作多年的UI設計轉交互體驗的小伙伴就經(jīng)常遇到這些問題,大家總是在問UI和交互的區(qū)別是什么,其實本質上它倆都是一個界面設計師必備的能力,不能拆開來談。


我們再來看一個例子,播放/暫停的圖標,用來控制音頻/視頻的播放與暫停,


在實體播放器上,我們能看到播放和暫停往往集成在一個按鈕上,例如天貓精靈、電視遙控器等。而在數(shù)字產(chǎn)品中播放與暫停并不會同時放在一個按鈕上,因為數(shù)字產(chǎn)品的圖標是可以變化的,當前狀態(tài)和切換狀態(tài)可以有兩個不同的意符表示,那實體播放器做成兩個按鈕就太多余了。



還沒完,當我們在觀看視頻的時候,界面中會顯示暫停按鈕,意思是點擊后播放中的視頻/音頻會暫停播放。也就是暫停圖標展示的是點擊后的狀態(tài),而不是當前狀態(tài)。但其他圖標表示的意思卻又和開關相反,例如橫豎屏切換、收藏、點贊,顯示的就是當前狀態(tài),而非點擊后狀態(tài)。


為什么不一樣呢?因為暫停/播放相當于一個按鈕,用來控制視頻播放,這里存在著一個控制和映射的關系,然而這里的暫停和播放按鈕的示能是相反的。

暫停圖標的示能表示當前正在播放,而播放圖標的示能表示當前已暫停。所以它和開關也不同,開就是開,關就是關,點贊圖標的原理就如同開關。


還有例如打開和關閉聲音,看起來聲音播放/靜音有點像視頻的暫停和播放。



例如騰訊視頻這里的視頻聲音控制,當前靜音為聲音關閉圖標,而不是打開后播放聲音的圖標,我們再看iOS系統(tǒng)的里聲音控的樣式表現(xiàn),說明當前聲音為開啟則顯示的是開啟聲音的圖標,經(jīng)過交互控制后才會變成靜音的圖標。所以聲音播放的控制和視頻播放的控制在圖標意符的使用規(guī)則上并不統(tǒng)一。


那為什么會不一樣呢?其實我也看到過一些聲音圖標和這個案例是反著來的。


兩個原因:


1.因為視頻的打開和關閉只有兩個狀態(tài),但是聲音不同,聲音在打開的時候還可以調節(jié)音量??!如果和視頻播放一樣,在播放的狀態(tài)下顯示的是靜音的圖標,那么音量調節(jié)就會變成這樣:




是不是就很奇怪了,明明是正在播放的狀態(tài),顯示的居然是靜音的圖標


2.暫停和播放的本質并不是開和關,而是中斷和繼續(xù),在本質上和開關還是不一樣的。而靜音和播放的本質就是對聲音的打開和關閉,如果我在聲音邊上加一個開關是不是就能弄清楚,為什么聲音控制器的圖標意符就是當前狀態(tài)而不是交互后的狀態(tài)。而視頻的播放和暫停并不是開關。這下大家搞懂了嗎?


圖標意符可以單獨使用也可以結合文字使用,圖標雖然有優(yōu)點,但也有缺點,如果單獨使用也需要注意使用的場景,比如舉個例子,同樣是放在導航欄的兩個圖標,但是在不同的界面中,大家可以感知到該圖標的含義嗎?它的示能和意符相結合成為了一個圖標,但不夠明確,在不同場景中如果沒有文字意符的輔助就會不夠明確。



圖形可以輔助表意,也可以用來指示區(qū)域,例如我們經(jīng)常開車,會知道馬路上會劃分實線、虛線、虛實線、潮汐車道線,示意車輛可以在哪些區(qū)域行駛、以及形式的規(guī)則。



我們在醫(yī)院拍胸片的時候,胸片機器下方也會指示人應該站在什么位置,用一個方形的框框起來,或者會顯示兩個腳印的圖形。在數(shù)字產(chǎn)品中圖形的指示區(qū)域也非常重要,例如我們設計一個按鈕,只有文字樣式的按鈕和具有圖形背景的按鈕在用戶的點擊感知上是不同的,后者的點擊信心會更大,有了區(qū)域的劃分就有了明確的操作界限。




3.顏色


顏色意符很好理解,通過色彩來表達如何與事物進行交互以及輔助表達。


無論是實體產(chǎn)品或者數(shù)字產(chǎn)品中,警示的顏色大部分會用紅色或者橙色來表示,例如在進行信息檢查時,錯誤信息會被用紅色樣式標注出來,既告知用戶出了什么問題,又提示用戶在哪里出現(xiàn)問題。


而需要熱鬧、活潑的氛圍也會采用紅色等暖色來襯托,因為暖色更加的醒目。有時顏色也是物體示能的一部分,例如緊急逃生出口、公交車上的安全錘、滅火器都是用紅色的外觀,表示在緊急情況下可以使用,但不要輕易使用。


綠色表示安全、自然,但也有一些特殊場景下的不同感知,例如金融行業(yè)不太喜歡綠色,男士不太喜歡帽子使用這個顏色,除非你是比克大魔王。灰色則表示禁止、不可用、待激活等等。


在數(shù)字產(chǎn)品中,色彩除了表示一些特殊的含義,也可以用來作為信息區(qū)分,在選擇觀影位置的時候,可以利用色彩顯示不同區(qū)域位置的觀影體驗和價格的區(qū)別。更多的色彩心理學和色彩的使用這里就不展開了。





4.聲音

聲音意符就更有意思了,人們通過聽聲音來辨別發(fā)生方位、響度、發(fā)聲物體以及聲音的音色、質感。各種物體通過聲音來傳信息的方式也非常多樣,而我舉個例子,就能把大家?guī)Щ氐酵辍?


你們還記得以前在學校電腦教室里一個企鵝圖標開始閃爍嗎?一個咳嗽聲表示有人申請加你好友,一個敲擊木頭的聲音表示有人上線了,一個滴滴滴的聲音表示有新消息。還有在短視頻里經(jīng)常會用到的一種中斷音效:滴————。你們會發(fā)現(xiàn)我怎么能打出有聲音的文字,仿佛你們已經(jīng)在聽了。


聲音為什么很重要,因為人類的五感是在共同作用的,我們除了可以通過聲音來判斷事物本身,還可以用聲音來感知當前行為的狀態(tài),例如打開手機的鍵盤輸入音,這樣的打字反饋更真實更有質感。


還有在游戲領域我們經(jīng)常會提到的打擊感,當人物的武器打擊在怪物身上,但聲音并沒有及時反饋,而是延遲1秒,這時候你就會覺得沒有什么打擊感,除了聲音反饋,打擊感的意符還有很多,例如受擊物體的表現(xiàn)動作、擊打區(qū)域、擊打特效、動效、傷害顯示、控制器反饋等等。



5.動效

動效也可以成為意符嗎?它能表示什么含義呢?動效也是意符中非常重要的一種類型,他在我們日常生活中也用到的非常多。



例如我們看到理發(fā)店門口正在旋轉的彩色燈。


這里也順便給大家講個小歷史,理發(fā)店彩燈的由來:在中世紀歐洲,人們認為放血療法對人的健康又很大的幫助,但是一般都由宗教儀式中的神職人員操作,到了亞歷山大三世,他把這項工作交給了醫(yī)生,但是當時的醫(yī)生不愿意做這種下等人做的事情,便委托理發(fā)師來做,于是理發(fā)師就成立了理發(fā)師外科醫(yī)師聯(lián)合會,三色柱就是活動的標志,紅色代表動脈、藍色代表靜脈、白色代表紗布。還有一種說法是在法國大革命時期,一家理發(fā)店是革命黨人根據(jù)地,一次危險的活動中領導人在理發(fā)師的掩護下逃脫,最后為了表彰,允許他們用紅、白、藍三色的國旗作為標注,最后演化成了旋轉燈,各國效仿。


好了,題外話說完,我們再回到動效。如果你看到三色燈正在旋轉,說明這家理發(fā)店正在營業(yè),如果靜止則說明停業(yè),或者壞了。是不是很簡單?這就好像一個出軌的女人告訴情夫如果家里有人則陽臺上放一盆菊花,家里沒人則放一盆綠蘿是一個道理。


那么在數(shù)字產(chǎn)品中,動效意符還有哪些作用呢?我們一一來盤點一下:


1.降低用戶認知成本

我們通過設計界面的轉場、控件的喚出動效,告訴用戶你將從什么地方去往什么地方,和你有關的控件是從哪里來,你可以怎么控制他。當你進行過交互行為后哪些內容變化了,它們是怎么變化的。這就好像你等的45路公交車從遠方朝你慢慢行駛過來,停在你的面前并打開了車門,你選擇了上車然后看到阿姨捧著電飯鍋,拉動氣門,接著爆炸。而不是當你站在原地直接爆炸。被紅姨的支配還宛如昨日。


所以一個好的動效能讓你清楚事物的發(fā)展過程,以便于你更好的去理解。再例如我們在使用餓了么、美團等應用時,添加菜品會有掉入外賣箱的動效,這是一個非常好的動效應用。微信公眾號策劃將文章收起到浮窗也會有一個浮窗去向的引導,告訴你雖然文章在收入交互動作的結束是在右下角,但如果你想查看所有文章需要返回首頁,在頁面的左上角才能找到。




2.引導/提示/強化

對于一些新人須知或者內容隱藏的部分,產(chǎn)品通??梢酝ㄟ^一個小動效來引導用戶這里有新內容,例如淘寶二樓、印象筆記功能圖標的切換、活動入口等等


3.氛圍、強化視覺

電商、直播界面中,有非常多的元素都是利用動效來刻畫氛圍和效果,刺激人們的感官。



4.表示狀態(tài)

當你在手機解鎖的狀態(tài)下輸錯密碼或者在氪金時輸錯密碼,輸入框都會進行左右晃動來示意,老鐵,這真的不對。





5.更多意符

意符不局限于我列出的一些類型,我再舉個例子,在一個不起眼的轉角處,那里空無一物,就是很普通的一塊空地,但如果那里被丟了一袋垃圾,那么這里就會出現(xiàn)越來越多的垃圾,因為第一袋垃圾就是一個意符,告訴別人這里可以丟垃圾,于是很多人就會把垃圾丟在這個角落里。


很多人會覺得示能和意符好難區(qū)分,示能不是也包含意符嗎,其實我們可以這樣理解,在整個交互過程中有物體和操作者這樣兩個對象,物體本身表達的是示能,但它不具備溝通能力,而意符才是鏈接操作者和物體兩者的橋梁,雖然我們平時往往看到的都是示能+意符的狀態(tài),但是我們也要區(qū)分本體的示能和用來溝通的意符兩者的區(qū)別。



小結


意符和示能不可分割,設計師們在學習基礎概念的時候要盡可能的一起去了解并學習。意符的種類繁多,所以我們在學習意符正確的時候方式時,首先要了解意符本身的“示能”,從而將意符更巧妙的結合在事物中發(fā)揮其正確的表意作用。


設計師在設計意符的時候也要盡可能的多了解產(chǎn)品使用者(用戶)的背景,意符的表達也有很大一部分效果來自于用戶的經(jīng)驗和心智。即便我們認為該意符已經(jīng)很清晰了,但是使用者并未接觸過、不理解,說明該意符依然不合適。

文章來源:站酷      作者:應駿

分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯(lián)系,我們立即更正或刪除。

藍藍設計www.bouu.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網(wǎng)站建設 、平面設計服務



分享本文至:

日歷

鏈接

個人資料

藍藍設計的小編 http://www.bouu.cn

存檔