交互設(shè)計(jì)之探索GUI和VUI

2022-3-3    周周



一、GUI和VUI的定義:


1.1GUI


GUI(Graphical UserInterface)圖形界面,市面上最常見的交互方式。點(diǎn)觸,滑動(dòng),作為主要輸入方式。圖像顯示作為主要輸出方式。




1.2VUI


VUI(Voice User Interface)語音界面,常見沒有屏幕的智能音箱/耳機(jī),靠語言輸入和交流,如我們常見的小艾同學(xué),天貓精靈等。





二、GUI和VUI的發(fā)展歷程:


2.1GUI的發(fā)展歷程


1973年第一個(gè)可視化操作的Alto電腦在施樂帕洛阿爾托研究中心(Xerox PARC)完成。Alto是第一個(gè)把計(jì)算機(jī)所有元素結(jié)合到一起的圖形界面操作系統(tǒng)。它使用3鍵鼠標(biāo)、位運(yùn)算顯示器、圖形窗口、以太網(wǎng)絡(luò)連接。

1981年施樂公司推出了Alto的繼承者Star,Alto曾首次使用了窗口設(shè)計(jì)。

1983年蘋果電腦公司推出Apple Lisa個(gè)人電腦,是全球第一款搭載圖形用戶界面(GUI)的個(gè)人電腦。

1984年蘋果電腦公司推出Macintosh。

1986年首款用于Unix的窗口系統(tǒng)X Window System發(fā)布。

1988年IBM發(fā)布OS/2 1.10標(biāo)準(zhǔn)版演示管理器(Presentation Manager),這是第一種支持Intel計(jì)算機(jī)的穩(wěn)定的圖形界面。

1992年微軟公司發(fā)布Windows 3.1,增加了多媒體支持。

1995年微軟的Windows 95發(fā)布,其窗口操作系統(tǒng)的外觀基本定型。

1996年微軟發(fā)布Microsoft Bob,此軟件具有動(dòng)畫助手和有趣的圖片。

1996年IBM發(fā)布OS/2 Warp 4,它的交互界面得到顯著改善,至今仍有不少ATM機(jī)運(yùn)行這樣的系統(tǒng)。

1997年KDE和GNOME兩大開源桌面項(xiàng)目啟動(dòng)。

1997年蘋果電腦公司發(fā)布Mac OS 8,這個(gè)系統(tǒng)具有三維外觀并提供了SpringLoaded Folder功能。

2000年蘋果電腦公司推出Mac OS X系統(tǒng)的默認(rèn)外觀Aqua。

2001年微軟發(fā)布Windows XP,實(shí)現(xiàn)了主題支持。

2003年Mac OS X v10.3提供了一鍵單擊訪問任何已打開窗口的功能。

2003年Sun公司的Java桌面系統(tǒng)為GNOME桌面添加了和Mac類似的效果。

2006年微軟發(fā)布Windows Vista,對(duì)此前其視窗操作系統(tǒng)的外觀作了較大的修改,實(shí)現(xiàn)了Aero功能。



2.2VUI的發(fā)展歷程


20世紀(jì)90年代,誕生了第一個(gè)可行的、非特定的(每個(gè)人都可以對(duì)他說話)的語音識(shí)別系統(tǒng),交互式語音應(yīng)答(Interactive Voice Response,IVR)系統(tǒng)的出現(xiàn)代表了VUI的第一個(gè)重要時(shí)期。人通過電話線路進(jìn)行交互并執(zhí)行任務(wù),如機(jī)票預(yù)訂、銀行轉(zhuǎn)帳、業(yè)務(wù)查詢等。


目前很多像siri、Google這類集成了視覺和語音信息的APP,以及Amazon Echo這類純語音的設(shè)計(jì)產(chǎn)品,逐步發(fā)展并成為主流。隨著語音識(shí)別技術(shù)、AI技術(shù)、互聯(lián)網(wǎng)技術(shù)的發(fā)展,我們已經(jīng)可以在手機(jī)設(shè)備中用語音處理很多事情,但還有很多事情目前無法通過語音完成,需要我們探索。




三、GUI和VUI的設(shè)計(jì)要領(lǐng):


3.1GUI



        交互的多樣性:


不同于PC機(jī)通過鼠標(biāo)來點(diǎn)擊,在觸控設(shè)備上通過手指點(diǎn)按,由于手指的精確度相對(duì)于鼠標(biāo)指針差很多,所以子啊移動(dòng)頁面設(shè)計(jì)當(dāng)中的交互元素一定得辨識(shí)作用,手機(jī)并沒有懸停操作所以圖標(biāo)如果特征不明顯時(shí)一定要加文字識(shí)別,設(shè)計(jì)時(shí)也應(yīng)注意圖標(biāo)和菜單元素的尺寸。


拖拽和移動(dòng)是很相似的交互工作,被拖拽的元素始終跟隨著緊貼屏幕的指尖


除了使用單指之外,還可以用兩個(gè)手指放大,縮小圖片,如果設(shè)計(jì)了一些新的多指交互一定要給用戶提示和指導(dǎo)。


3.2VUI


3.3VUI的適用場景


智能家居

在智能家居領(lǐng)域VUI應(yīng)用越來越廣泛,相信在不久的將來我們一定能夠享受到更多的VUI所帶給我們的便利。


輔助駕駛

車載語音交互系統(tǒng)使得我們可以在開車的同時(shí)接聽電話、聽廣播等。


企業(yè)應(yīng)用

未來大型企業(yè)中將會(huì)多領(lǐng)域應(yīng)用VUI,用于書寫、記錄等工作。


醫(yī)療教育

智能記錄病例、管理病例的出入。


四、VUI的語言設(shè)計(jì)注意事項(xiàng)


過多的聲音干擾,不但會(huì)增加用戶的心智負(fù)擔(dān),將會(huì)引起用戶感到厭煩,尤其是,語音在資訊的負(fù)荷量上又比單純的聲音來的更多,考量是否存在存在的必要性就放在格外重要。而言,可以尋找替代的方式,透過震動(dòng)和燈光甚至狀態(tài)變化來提示,減少使用者的認(rèn)知負(fù)荷,并確保聲音只會(huì)在特定的時(shí)間點(diǎn)出現(xiàn),并提供使用者自行設(shè)定關(guān)閉聲音的功能


除了聲音本身的設(shè)計(jì)外,還要考慮整體環(huán)境的影響因素,可能周遭受非常的吵雜。換句話說,在KTV的包廂,吵雜的環(huán)境,會(huì)使用者無法聽到消防警鈴響,而容易造成危險(xiǎn)事件的產(chǎn)生。也因?yàn)槿绱耍谰彽穆曇纛l率設(shè)計(jì)就應(yīng)該介于2kM到4kM,因?yàn)檠芯恐赋鋈祟惖亩鋵?duì)于這個(gè)范圍的聲音最敏感


從音量的角度來看,耳朵對(duì)不同頻率的音量有不同的感知程度,有些聲音聽起來很響亮,有些則是很沉悶因人而異,但比較客觀的量化體驗(yàn)指標(biāo)就是分貝(decibel,dB) ,在尺度上超過70分貝以上,會(huì)讓人產(chǎn)生憂慮不安,并引發(fā)各種癥狀,因此要盡量避免尺寸大小過大的設(shè)計(jì), ,,降低主動(dòng)的侵入性?;谶@些因素總和來說,還要考量到用戶和產(chǎn)品間的距離,與產(chǎn)品愈近,對(duì)于體積的需求量較大,反之為然


在聲音體驗(yàn)設(shè)計(jì)(Amber Case,2018)一書指出,當(dāng)警告或提示音出現(xiàn)的頻率愈高,就應(yīng)該設(shè)計(jì)成愈短,但不足就是,如果把聲音設(shè)計(jì)成短而急促,從而使用者需要集中相反地,事件發(fā)生時(shí)間間隔長且久,則聲音提示更需要明顯且激烈的聲音來提醒用戶,例如手機(jī)鈴聲響時(shí),需要告知用戶



文章來源:站酷   作者:張陽光Designer



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


免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

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

分享本文至:

日歷

鏈接

個(gè)人資料

存檔