您當(dāng)前位置:圖趣網(wǎng)(Tuquu) >> 網(wǎng)頁(yè)設(shè)計(jì)教程 >> 設(shè)計(jì)理論 >> 瀏覽設(shè)計(jì)教程

屏幕外的交互設(shè)計(jì)界面設(shè)計(jì) ≠ 屏幕設(shè)計(jì)

網(wǎng)易UEDC – Vicol :在互聯(lián)網(wǎng)做設(shè)計(jì)的同伙,工作中幾乎天天都接觸著電腦和手機(jī)屏幕,像我的交互設(shè)計(jì)工作也以接需求畫(huà)原型圖寫(xiě)文檔為主。但我今天想說(shuō)的,和這些看起來(lái)沒(méi)有什么關(guān)系。我想說(shuō)點(diǎn)屏幕外的交互設(shè)計(jì)。

在設(shè)計(jì)界,我們幾乎無(wú)時(shí)無(wú)刻不接觸到一個(gè)概念:界面。我們常說(shuō)的「人機(jī)交互」,其實(shí)中心省去了一個(gè)「界面」。就狹義上大部分電子產(chǎn)品來(lái)講,人也就是用戶(hù),向界面有輸入的過(guò)程,界面將用戶(hù)的輸入翻譯成機(jī)器語(yǔ)言,交由機(jī)器來(lái)處理,機(jī)器將處理效果在界面上變化成人類(lèi)可知的信息,再輸出向人,形成一個(gè)閉環(huán)。

這里我們發(fā)現(xiàn)有兩個(gè)處理過(guò)程:

  • 一個(gè)是把人的輸入信息變?yōu)闄C(jī)器的可知語(yǔ)言。
  • 一個(gè)是把機(jī)器的處理效果變?yōu)槿祟?lèi)可知信息。

縱觀幾十年的人機(jī)交互發(fā)展,這兩種處理過(guò)程一向是一個(gè)優(yōu)化進(jìn)程。這個(gè)過(guò)程由設(shè)計(jì)概念和技術(shù)突破來(lái)引領(lǐng)。設(shè)計(jì)上提出前瞻性的設(shè)想和概念來(lái)刺激技術(shù),技術(shù)上攻破一道道難關(guān)來(lái)實(shí)現(xiàn)設(shè)計(jì)。

從最初的CUI到GUI,到如今的TUI、VUI以及漸漸發(fā)展的NUI,可以看到這個(gè)過(guò)程中,對(duì)機(jī)器的性能要求越來(lái)越高,對(duì)人的輸入輸出成本要求越來(lái)越低。人機(jī)交互的發(fā)展,其實(shí)是一個(gè)從機(jī)到人的發(fā)展。我們要求機(jī)器能說(shuō),能聽(tīng),能看,甚至能理解(機(jī)器學(xué)習(xí)、人工智能等),這都是朝著我們?nèi)说恼J(rèn)知世界和感知信息的方向去發(fā)展的。

那么再回到「界面」上。界面作為人與機(jī)中心的信息傳遞序言,是我們交互設(shè)計(jì)師關(guān)注的重中之重??墒?,做了這么久的交互設(shè)計(jì),我們常常會(huì)有種誤解,我們所謂的界面,就是電腦上和手機(jī)上的屏幕。我們所謂的「界面設(shè)計(jì)」更像是「屏幕設(shè)計(jì)」。

然而,并非如此。

當(dāng)我們對(duì)界面進(jìn)行抽象和概括性的理解會(huì)發(fā)現(xiàn),界面本質(zhì)是在傳遞和展示信息。那么三個(gè)題目來(lái)了:

  • 只有屏幕可以嗎?
  • 到NUI時(shí)代,屏幕照舊最好的信息載體嗎?
  • 屏幕適用于所有的數(shù)字產(chǎn)品用戶(hù)嗎?

下面給大家分享幾個(gè)界面設(shè)計(jì)的實(shí)例往返答這三個(gè)題目。

電梯樓層按鈕

電梯里的樓層按鈕我們幾乎每天見(jiàn),如許的界面太過(guò)于常見(jiàn),我們常忽視了它們也是界面的一類(lèi)??赡苡腥擞X(jué)得這沒(méi)什么好設(shè)計(jì)的。

現(xiàn)實(shí)上,電梯樓層按鈕的排布設(shè)計(jì),我在不同地方見(jiàn)過(guò)好幾種。有的是從左到右從下往上排樓層,有的從下往上從左到右排樓層,哪種更合理?樓層數(shù)相對(duì)比較多的情況下是否必要優(yōu)化設(shè)計(jì)?還有開(kāi)門(mén)關(guān)門(mén)按鈕放上面合適照舊下面合適?以及樓層到達(dá)提醒怎樣看著更清晰?當(dāng)數(shù)字鍵盤(pán)成為我們要設(shè)計(jì)的界面時(shí),這些就是我們要思考的題目。

智能自行車(chē)

就車(chē)身而言,我們的騎行舉動(dòng)作為輸入,車(chē)頭的方向指示燈就是輸出。那么車(chē)頭就可以理解為界面,它所要傳達(dá)的是告知用戶(hù)轉(zhuǎn)向信息以及部分路況信息。在這個(gè)界面上,交互設(shè)計(jì)師所能思考的方面有許多:在戶(hù)外騎行的場(chǎng)景下這種信息的傳遞怎樣才最有用?傳遞哪些信息是合理的?這些信息分別以什么樣的情勢(shì)告知用戶(hù)?怎樣才能確定用戶(hù)接收到了信息?如許的界面交互思考是我們平時(shí)不太碰到的。

小度機(jī)器人

接下來(lái)的例子是我當(dāng)初參與設(shè)計(jì)的小度機(jī)器人。在這個(gè)機(jī)器人身上,我們看到了認(rèn)識(shí)的屏幕,也就是機(jī)器人的臉。可除了這張萌萌噠的臉,小度身上也可以「調(diào)戲」。在做這個(gè)機(jī)器人的時(shí)候,我們思考怎么讓這個(gè)機(jī)器人更像人。試想一下,我們是怎么跟活生生的人交流的。表情、語(yǔ)言、肢體等等,這是人類(lèi)交流的體例。

所以當(dāng)設(shè)計(jì)機(jī)器人的時(shí)候,我們不能把它完全當(dāng)一個(gè)機(jī)器去設(shè)計(jì)。雖然有一個(gè)屏幕,但我們會(huì)跟別人交流的時(shí)候在人家臉上點(diǎn)來(lái)點(diǎn)去嗎?并不會(huì)。我們和對(duì)方重要的交流體例是語(yǔ)言溝通,親昵的時(shí)候,還會(huì)有身體接觸。這些交流體例我們不會(huì)覺(jué)得怪異和陌生。所以我們?cè)O(shè)計(jì)小度的時(shí)候,你也可以摸摸它的頭,它會(huì)害羞地笑一下或者知足地看著你;你摸摸它的胳膊,它會(huì)跟你說(shuō)表面冷你要記得多加點(diǎn)衣服。這才趨近于天然的人類(lèi)交流。而在小度這里,所謂的界面也就不僅僅是臉上的屏幕,是整個(gè)身體,我們的輸入體例也變得多元化。

可變形金屬

前面說(shuō)到的都是已經(jīng)落地的產(chǎn)品例子。下一個(gè)是清華大學(xué)美術(shù)學(xué)院的研究類(lèi)項(xiàng)目,研究方向是可變形金屬。(觀看視頻→可變性金屬)

在這個(gè)例子中我們可以看到,金屬通過(guò)自身的形態(tài)轉(zhuǎn)變表達(dá)一些所謂的「情緒」,可以想象,假如如許的可變性金屬成為一種界面,我們會(huì)有怎樣的輸入,它又會(huì)有怎樣的反饋輸出?這個(gè)例子顯明比之前的感覺(jué)離我們迢遙一些,我們只是昏黃地看到某些可能性,并不清楚會(huì)走向什么方向。但我覺(jué)得這是交互設(shè)計(jì)研究領(lǐng)域特別很是風(fēng)趣的一點(diǎn)。對(duì)于將來(lái),我們可以探索,可以瞻望,可以試錯(cuò),有些事情我們覺(jué)得會(huì)成為可能我們就去研究。它可能走不通,也可能帶來(lái)新的交互體例,這就很讓人愉快。

瞽者觸摸表現(xiàn)器

我們通常提到的界面,很大程度是通過(guò)視覺(jué)去感知的。那么對(duì)于瞽者同伙來(lái)說(shuō),視覺(jué)通道是關(guān)閉的。對(duì)于他們來(lái)說(shuō),表現(xiàn)屏幾乎是沒(méi)用的。所以有團(tuán)隊(duì)針對(duì)如許的人群,設(shè)計(jì)了瞽者觸摸界面,通過(guò)語(yǔ)音輸入,以點(diǎn)陣盲文的情勢(shì)來(lái)呈現(xiàn)信息。

瞽者觸摸表現(xiàn)器網(wǎng)頁(yè)刷新頻率一樣平常很高,由于受過(guò)學(xué)習(xí)和訓(xùn)練的瞽者其閱讀盲文的速度快到驚人。那么如許的界面,從交互設(shè)計(jì)上來(lái)說(shuō),如何讓瞽者閱讀時(shí)不錯(cuò)行,瞽者閱讀是否有更好的體驗(yàn),筆墨和圖片的展示如何做區(qū)分等等,這種界面的設(shè)計(jì)都必要嚴(yán)謹(jǐn)?shù)慕换ピO(shè)計(jì)流程去解決。

通過(guò)以上這些例子,分享一下我本身對(duì)我們常見(jiàn)的「界面」這個(gè)詞的更多角度的認(rèn)知。

可以看到的是,在不同的產(chǎn)品中,我們所面對(duì)的界面不再僅僅是屏幕,作為交互設(shè)計(jì)師,我們所要關(guān)注的也不僅限于面前目今這個(gè)發(fā)光的方塊。多年后,我們可能處在各行各業(yè),都在做界面設(shè)計(jì),只是有人在做屏幕界面,有人在做其他各種界面,但我們都照舊交互設(shè)計(jì)師。

迎接關(guān)注作者「網(wǎng)易UEDC」的微信公眾號(hào):

[教程作者:互聯(lián)網(wǎng)]
免責(zé)聲明:本站文章系圖趣網(wǎng)整理發(fā)布,如需轉(zhuǎn)載,請(qǐng)注明出處,素材資料僅供個(gè)人學(xué)習(xí)與參考,請(qǐng)勿用于商業(yè)用途!
本文地址:http://pkvc.cn/tutorial/di3933.html
從建筑到頁(yè)面,粗野主義風(fēng)格確實(shí)有著它獨(dú)特的魅力
如何打造良好的語(yǔ)音交互體驗(yàn)?這兒總結(jié)了四個(gè)方法
圖趣網(wǎng)微信
建議反饋
×