界面設(shè)計(jì) ≠ 屏幕設(shè)計(jì):什么是界面設(shè)計(jì)?
各位在互聯(lián)網(wǎng)做設(shè)計(jì)的朋友,工作中幾乎每天都接觸著電腦和手機(jī)屏幕,像我的交互設(shè)計(jì)工作也以接需求畫原型圖寫文檔為主。但我今天想說的,和這些看起來沒有幾毛錢關(guān)系。這篇文章我想說點(diǎn)屏幕外的交互設(shè)計(jì)。
在設(shè)計(jì)界,我們幾乎無時(shí)無刻不接觸到一個(gè)概念:界面。我們常說的“人機(jī)交互”,其實(shí)中間省去了一個(gè)“界面”。就狹義上大部分電子產(chǎn)品來講,人也就是用戶,向界面有輸入的過程,界面將用戶的輸入翻譯成機(jī)器語言,交由機(jī)器來處理,機(jī)器將處理結(jié)果在界面上轉(zhuǎn)變成人類可知的信息,再輸出向人,形成一個(gè)閉環(huán)。
這里我們發(fā)現(xiàn)有兩個(gè)處理過程,一個(gè)是把人的輸入信息變?yōu)闄C(jī)器的可知語言,一個(gè)是把機(jī)器的處理結(jié)果變?yōu)槿祟惪芍畔?。縱觀幾十年的人機(jī)交互發(fā)展,這兩種處理過程一直是一個(gè)優(yōu)化進(jìn)程。這個(gè)過程由設(shè)計(jì)概念和技術(shù)突破來引領(lǐng)。設(shè)計(jì)上提出前瞻性的設(shè)想和概念來刺激技術(shù),技術(shù)上攻破一道道難關(guān)來實(shí)現(xiàn)設(shè)計(jì)。
從最初的CUI到GUI,到現(xiàn)在的TUI、VUI以及逐漸發(fā)展的NUI,可以看到這個(gè)過程中,對(duì)機(jī)器的性能要求越來越高,對(duì)人的輸入輸出成本要求越來越低。人機(jī)交互的發(fā)展,其實(shí)是一個(gè)從機(jī)到人的發(fā)展。我們要求機(jī)器能說,能聽,能看,甚至能理解(機(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è)問題來了:
- 只有屏幕可以嗎?
- 到NUI時(shí)代,屏幕還是最好的信息載體嗎?
- 屏幕適用于所有的數(shù)字產(chǎn)品用戶嗎?
下面給大家分享幾個(gè)界面設(shè)計(jì)的實(shí)例來回答這三個(gè)問題。
電梯樓層按鈕
電梯里的樓層按鈕我們幾乎天天見,這樣的界面太過于常見,我們常忽視了它們也是界面的一類。可能有人覺得這沒什么啊,沒什么好設(shè)計(jì)的。實(shí)際上,電梯樓層按鈕的排布設(shè)計(jì),我在不同地方見過好幾種。
有的是從左到右從下往上排樓層,有的從下往上從左到右排樓層,哪種更合理?樓層數(shù)相對(duì)比較多的情況下是否需要優(yōu)化設(shè)計(jì)?還有開門關(guān)門按鈕放上面合適還是下面合適?以及樓層到達(dá)提示怎樣看著更清晰?當(dāng)數(shù)字鍵盤成為我們要設(shè)計(jì)的界面時(shí),這些就是我們要思考的問題。
“智能”自行車
再看第二個(gè)例子,這是當(dāng)初讀研時(shí)在X工作室和百度合作的百度自行車。
就車身而言,我們的騎行行為作為輸入,車頭的方向指示燈就是輸出。那么車頭就可以理解為界面,它所要傳達(dá)的是告知用戶轉(zhuǎn)向信息以及部分路況信息。在這個(gè)界面上,交互設(shè)計(jì)師所能思考的地方有很多:在戶外騎行的場(chǎng)景下這種信息的傳遞怎樣才最有效?傳遞哪些信息是合理的?這些信息分別以什么樣的形式告知用戶?怎樣才能確定用戶接收到了信息?這樣的界面交互思考是我們平時(shí)不太遇到的。
小機(jī)器人
第三個(gè)例子也是當(dāng)初和百度合作的項(xiàng)目,小度機(jī)器人。
在這個(gè)機(jī)器人的身上,我們看到了我們熟悉的屏幕,也就是機(jī)器人的臉??沙诉@張萌萌噠的臉,小度身上也可以“調(diào)戲”。在做這個(gè)機(jī)器人的時(shí)候,我們思考怎么讓這個(gè)機(jī)器人更像人。試想一下,我們是怎么跟活生生的人交流的。表情、語言、肢體等等,這是人類交流的方式。
所以當(dāng)設(shè)計(jì)機(jī)器人的時(shí)候,我們不能把它完全當(dāng)一個(gè)機(jī)器去設(shè)計(jì),雖然有一個(gè)屏幕,但我們會(huì)跟別人交流的時(shí)候在人家臉上點(diǎn)來點(diǎn)去嗎?并不會(huì)。我們和對(duì)方主要的交流方式是語言溝通,親昵的時(shí)候,還會(huì)有身體接觸。這些交流方式我們不會(huì)覺得怪異和陌生。所以我們?cè)O(shè)計(jì)小度的時(shí)候,你也可以摸摸它的頭,它會(huì)害羞地笑一下或者滿足地看著你;你摸摸它的胳膊,它會(huì)跟你說外面冷你也記得多加點(diǎn)衣服。這才趨近于自然的人類交流。而在小度這里,所謂的界面也就不再僅僅是臉上的屏幕,是整個(gè)身體。我們的輸入方式也變得多元化。
可變形金屬
前面說到的都是已經(jīng)落地的產(chǎn)品例子。下一個(gè)是我學(xué)弟的研究類項(xiàng)目,他研究的方向是可變形金屬。
在這個(gè)例子中我們可以看到,金屬通過自身的形態(tài)變化表達(dá)一些所謂的“情緒”,可以想象,如果這樣的可變性金屬成為一種界面,我們會(huì)有怎樣的輸入,它又會(huì)有怎樣的反饋輸出?這個(gè)例子明顯比之前的感覺離我們遙遠(yuǎn)一些,我們只是朦朧地看到某些可能性,并不清楚會(huì)走向什么方向。
但我覺得這是交互設(shè)計(jì)研究領(lǐng)域非常有趣的一點(diǎn)。對(duì)于未來,我們可以探索,可以展望,可以試錯(cuò),有些事情我們覺得會(huì)成為可能我們就去研究。它可能走不通,也可能帶來新的交互方式,這就很讓人興奮。
盲人觸摸顯示器
我們通常提到的界面,很大程度是通過視覺去感知的。那么對(duì)于盲人朋友來說,視覺通道是關(guān)閉的。對(duì)于他們來說,顯示屏幾乎是沒用的。所以有團(tuán)隊(duì)針對(duì)這樣的人群,設(shè)計(jì)了盲人觸摸界面,通過語音輸入,以點(diǎn)陣盲文的形式來呈現(xiàn)信息。
盲人觸摸顯示器頁面刷新頻率一般很高,因?yàn)槭苓^學(xué)習(xí)和訓(xùn)練的盲人其閱讀盲文的速度快到驚人。那么這樣的界面上,從交互設(shè)計(jì)上來說,如何讓盲人閱讀時(shí)不錯(cuò)行,盲人閱讀是否有更好的體驗(yàn),文字和圖片的展示如何做區(qū)分等等,這種界面的設(shè)計(jì)都需要嚴(yán)謹(jǐn)?shù)慕换ピO(shè)計(jì)流程去解決。
最后說幾句
通過以上這些例子,分享一下我自己對(duì)我們常見的“界面”這個(gè)詞的更多角度的認(rèn)知。
可以看到的是,在不同的產(chǎn)品中,我們所面對(duì)的界面不再僅僅是屏幕,作為交互設(shè)計(jì)師,我們所要關(guān)注的也不僅限于眼前這個(gè)發(fā)光的方塊。多年后,我們可能處在各行各業(yè),都在做界面設(shè)計(jì),只是有人在做屏幕界面,有人在做其他各種界面,但我們都還是交互設(shè)計(jì)師。
說不定,以后我再發(fā)推文的時(shí)候,不一定非要用電腦,嗨,誰知道呢。
作者:Vicol,微信公眾號(hào):略設(shè)小計(jì)
本文由 @Vicol 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。
題圖來自PEXELS,基于CC0協(xié)議
作者寫的這篇關(guān)于人機(jī)交互的文章我覺得很有意思 但是有一點(diǎn)我要糾正一下 界面的作用僅僅只有展示 也就是輸出 并沒有輸入 所以你的那個(gè)閉環(huán)是有問題的 ??
你好,界面本身是有為用戶提供輸入入口的,屏幕上的按鈕,鍵盤上的按鍵等等,這些都是。
CUI(命令行交互,DOS),GUI(圖形交互,windows),TUI(文本交互,收銀系統(tǒng)),NUI(自然用戶界面,VR、Surface交互桌面和任天堂的Wii游戲),VUI是啥?沒查到。
你好,感謝關(guān)注~ TUI是Tangible UI,不是Text UI; NUI目前還在發(fā)展中,surface 桌面我不認(rèn)為是NUI范疇產(chǎn)品; VUI 是Voice UI,比如Amazon Echo. 具體可看文中插圖。