視覺指示(Visual Indicators) 可以讓某些物品在蕓蕓眾生之中突顯出來。它們不會要求用戶采取行動,而是讓某些值得注意的事項,獲得關(guān)注的溝通工具。指示不會一直顯示,只在某些條件下才會出現(xiàn)。指示可能會用圖示、排印風格、放大、顏色變化和動畫等方式傳達訊息。
在互聯(lián)網(wǎng)的世界,到處都可以看到指示的范例。比如Gmail ,用回紋針顯示帶有附件的郵件,還有用黃色五角星標示已經(jīng)收藏起來的討論。Todoist 的使用者用勾選框的顏色來區(qū)分優(yōu)先順序,而且也很容易看出哪些有備忘記錄。iOS 的App 在下載更新時,圖示會覆蓋一層進度指示,讓使用者知道還要下載多久。
我喜歡研究UX 和ui界面設(shè)計,是因為原則和元素可以延伸出互聯(lián)網(wǎng)產(chǎn)品本身。我們的周圍到處都有像直觀功能(affordance) 和符號(signifier) 的指示,傳達它們所代表物體的信息。最明顯的視覺指示方式是加上文字,例如超市里,把東西標上「打八折!」的標簽。
在這篇文章里,我們將舉一些現(xiàn)實生活中的例子,沒有文字的指示,而是顏色、方向和姿態(tài)等來給出視覺指示。
狀態(tài)指示
系統(tǒng)狀態(tài)提示是Jakob Nielsen的用戶界面設(shè)計的10個易用性法則之一,其中提到:任何系統(tǒng)都要一直讓使用者知道現(xiàn)在發(fā)生什么事情。在現(xiàn)實世界,到處可見以視覺指示傳達狀態(tài)的情況,而且用途相似。
物品:信箱
指示:旗標位在「往上」的位置[收信/寄信的狀態(tài)]
對象:郵差
信息:「嘿,這里有信件要寄!」
物品:餐廳帳單
指示:卡片伸出帳單夾[結(jié)帳狀態(tài)]
對象:服務(wù)生
信息:「可以進行結(jié)帳了!」
物品:飛機引擎
指示:旋轉(zhuǎn)中的螺旋圖像[運轉(zhuǎn)/關(guān)閉狀態(tài)]
對象:機場地勤人員
信息:「小心!這架飛機的引擎啟動了?!?
進度指示
還要[增加] 多少,[此物品] 才會[完成]?進度指示用來傳達用戶距離流程結(jié)束還剩多少時間或步驟,這在互聯(lián)網(wǎng)產(chǎn)品里很常見。而在現(xiàn)實世界,它們以顯眼的記號傳達某種狀態(tài)還剩下多少份量或時間,或是還要多少行動。
物品:書
指示:插在某一頁的書簽[進度]
對象:讀者
信息:「這本書你大約已經(jīng)看完一半啦。」
物品:腳踏車煞車皮
指示:溝槽的消耗量[剩下可用量]
對象:腳踏車騎行者
信息:「上面的溝槽幾乎不見了。該換煞車皮咯!」
物品:牛油果
指示:梗底下的顏色[成熟度顏色]
對象:正在購物的人
信息:咖啡色=「我已經(jīng)熟透了或者被碰傷了。」綠色=「我熟了,可以吃了!」
個人喜好
我一直在尋找能夠讓問題在提出之前就獲得答案的創(chuàng)意方式。事先預測人們在尋找的物品,就可以免于造成潛在的困惑。我發(fā)現(xiàn)以下指示所傳達的訊息,可以不說出任何一個字,就有助于區(qū)分其他人和我自己之間的界線。
物品:啤酒罐
指示:把罐子凹下去[所有權(quán)]
信息:「這不是你的啤酒?!?
補充一下:酒杯上的裝飾小物(還有毛巾上的吊飾 )都是相同的手法!
物品:餐廳的茶壺
指示:擺放位置,還有把茶蓋斜放[空的/滿的狀態(tài)]
對象:服務(wù)生
信息:「茶壺已經(jīng)空了。請幫我們再倒些水?!?
物品:有領(lǐng)子的襯衫
指示:衣架鉤子的擺放方式[干凈/穿過的狀態(tài)]
對象:我自己!
信息:鉤子向外=「襯衫是干凈的。」鉤子向內(nèi)=「這件襯衫至少穿過一次了。」
這些指示并不會明講自己是什么東西。但是,只要在正確的情境之下,這些視覺線索可以幫助使用者辨別出物品的不同之處。至于使用者依賴這些傳遞信息的行為,則要看當下的需求或最終目標。不管是在互聯(lián)網(wǎng)或現(xiàn)實世界里,視覺指示都隨時在旁提供協(xié)助。
全站高品質(zhì)素材免費下載!