第四章(2) 產(chǎn)品視覺形象設(shè)計(jì)的構(gòu)成ppt課件

1、4 產(chǎn)品視覺籠統(tǒng)中的界面構(gòu)成本節(jié)主要內(nèi)容: 1)界面的概念 2)實(shí)體用戶界面 3)圖形用戶界面 4)聲音用戶界面 5)界面的評價 主講: 胡光忠機(jī)電工程系回想：產(chǎn)品籠統(tǒng)的總體構(gòu)成.1界面的概念 用戶界面UI，User Interface就字面來了解，是人和產(chǎn)品之間信息交流的“面。這個“面不僅僅是物理意義上的存在，而且包含了心思意義上的存在，經(jīng)過界面這個媒介，人與產(chǎn)品之間的信息得以相互傳送和溝通，即人機(jī)互動。 簡而言之，用戶界面就是人與產(chǎn)品之間互動方式的物化表象。 產(chǎn)品用戶界面是近年來伴隨IT產(chǎn)業(yè)突飛猛進(jìn)而開展起來的一個新興復(fù)合專業(yè)領(lǐng)域，涉及學(xué)科：視覺藝術(shù)、人機(jī)工程、認(rèn)知心思、邏輯分析、計(jì)算機(jī)圖

2、形學(xué)等。.關(guān)于廣義界面，美國學(xué)者赫伯特.A.西蒙提出:設(shè)計(jì)是人工物的內(nèi)部環(huán)境(人工物本身的物質(zhì)和組織)和外部環(huán)境(人工物的任務(wù)或運(yùn)用環(huán)境)的接合。這種接合是圍繞人來進(jìn)展的?！叭耸窃O(shè)計(jì)界面的一個方面，是認(rèn)識的主體和設(shè)計(jì)效力的對象，而作為對象的“物那么是設(shè)計(jì)界面的另一個方面。它是包含著對象實(shí)體、環(huán)境及信息的綜合體，就如我們看見一件產(chǎn)品、一棟建筑，它帶給人的不僅有運(yùn)用功能、資料的質(zhì)地，也包含著對傳統(tǒng)思索、文化理喻、科學(xué)觀念等的認(rèn)知。應(yīng)該說，廣義的界面設(shè)計(jì)是以功能性界面為根底，以環(huán)境性界面為前提，以情感性界面為重心而構(gòu)成的，它們之間構(gòu)成有機(jī)和系統(tǒng)的聯(lián)絡(luò)。 我們平常提及的界面設(shè)計(jì)通常是指狹義的界面設(shè)計(jì)，

3、較少地涉及到情感、文化等。但是，在實(shí)踐的設(shè)計(jì)過程中，這些又都是必需思索的要素，在某些時候，甚至是直接的設(shè)計(jì)對象，由于用戶是主體，那么人的要素也就自然而然地融入到設(shè)計(jì)過程中。.界面對視覺籠統(tǒng)的作用： 從用戶的角度，人們感知方式是多種多樣的，但就工業(yè)產(chǎn)品來講，人們主要是經(jīng)過視覺、觸覺和聽覺來感知和運(yùn)用產(chǎn)品的。 視覺感知主要起到了信息拾取的作用，比如產(chǎn)品上的各種標(biāo)志與符號，以及按鍵的外形和排布等； 觸覺主要是對拾取信息的操作，比如旋鈕的調(diào)理、按鍵的撥弄、屏幕的感壓等； 聽覺感知更多地表現(xiàn)了對信息操作的一種反響，比如按鍵的聲音等。 因此，用戶界面作為一種傳達(dá)產(chǎn)品理念、操作等信息的綜合方式，同樣成為產(chǎn)品

4、籠統(tǒng)的一個重要部分。它直接影響到產(chǎn)品運(yùn)用的便利性，而人們總能對運(yùn)用方便的產(chǎn)品留下深化的印象，并影響對產(chǎn)品籠統(tǒng)的整體評價。. 根據(jù)不同的人機(jī)互動方式，用戶界面主要可以分為以下三種方式：實(shí)體用戶界面SUI圖形用戶界面GUI聲音用戶界面AUI硬界面軟界面.2實(shí)體用戶界面SUI，Solid User Interface 實(shí)體用戶界面是經(jīng)過硬件設(shè)計(jì)來實(shí)現(xiàn)的一種既可視又可觸摸感知的人機(jī)交互界面，是對產(chǎn)品理念和運(yùn)用方式的一種固化表現(xiàn)。實(shí)體用戶界面的表現(xiàn)內(nèi)容主要包括：1按鍵的外形、大小、排布、位置、彈性等；2標(biāo)志上的數(shù)字、文字、符號等字體、大小、位置；3發(fā)音孔和散熱孔的外形、大小、位置；4各種端口的位置、間距

5、等；5顯示液晶的外形、大小、位置、角度、亮度6指示燈的外形、大小、位置、顏色、亮度7銘牌及一些輔助圖形或外型等。.從上面的各種表現(xiàn)內(nèi)容看，實(shí)體用戶界面作為產(chǎn)品籠統(tǒng)視覺層面的一個部分，還會在細(xì)節(jié)方面極大地影響產(chǎn)品的外觀如圖。 但為什么不納入產(chǎn)品的外觀中去？ 這主要是由于實(shí)體用戶界面與產(chǎn)品外觀在對產(chǎn)品籠統(tǒng)塑造方面所起的作用是不同的： 產(chǎn)品外觀中的形狀、顏色和質(zhì)感等都是對產(chǎn)品理念的一種單向表達(dá)，并沒有包含產(chǎn)品運(yùn)用方式的信息；而實(shí)體用戶界面對產(chǎn)品理念的一種雙向互動表達(dá)，包含產(chǎn)品運(yùn)用方式的信息。從作用深度來看，產(chǎn)品外觀主要在視覺層面起作用，而實(shí)體用戶界面那么主要在心思和行為層面上起作用。.實(shí)體用戶界面運(yùn)

6、用研討情況： 歐洲的產(chǎn)品不斷很有優(yōu)勢。一方面歐洲企業(yè)和行業(yè)協(xié)會對其運(yùn)用的注重程度，例如瑞典推行將TCO規(guī)范就將產(chǎn)品人機(jī)互動納入評價體系的重要部分；另一方面得益于濃重的人文文化。其中的典型代表是NOKIA手機(jī)。 就日本產(chǎn)品來講，在這方面很好的承繼了歐洲的設(shè)計(jì)傳統(tǒng)。 SONY公司也是互動界面設(shè)計(jì)方面的典范?！皩o法言喻的優(yōu)點(diǎn)傳送給無數(shù)的群眾是他們的一向目的。 我國產(chǎn)品在這方面的研討很少，設(shè)計(jì)方面注重不夠。.SONY TR-2.3圖形用戶界面GUI, Graphic User Interface 圖形用戶界面是經(jīng)過計(jì)算機(jī)編程來實(shí)現(xiàn)的一種可視化的人機(jī)交互界面。實(shí)踐上是軟件的圖形界面，用來協(xié)助人們認(rèn)識和

7、了解產(chǎn)品的設(shè)計(jì)理念和操作方式。就表現(xiàn)方式來講，主要有圖標(biāo)、菜單、工具欄、事件動畫等元素。其作用有： 對操作的可視化； 顯示產(chǎn)品的運(yùn)轉(zhuǎn)形狀； 添加產(chǎn)品運(yùn)用樂趣等；.運(yùn)用現(xiàn)狀： 在產(chǎn)品圖形用戶界面設(shè)計(jì)方面，Apple 公司的程度可以說是傲視全球。作為全球軟件霸主Microsoft公司也具有相當(dāng)實(shí)力。 我國在這方面可以說是剛剛起步，開展迅速當(dāng)參差不齊。比較好的代表QQ和浩大傳奇網(wǎng)絡(luò)游戲。 有研討闡明，界面的美觀程度將影響用戶對其可用性評價。而且，假設(shè)界面的“外觀和質(zhì)感令人心境酣暢，如運(yùn)用美麗的圖形、巧妙地組合各種元素、設(shè)計(jì)精巧的字體、運(yùn)用優(yōu)雅的圖像和顏色，用戶就更容易容忍系統(tǒng)可用性方面的問題。. 圖

8、形設(shè)計(jì)師Aaron Marcus設(shè)計(jì)了這兩個頗具吸引力的界面。界面設(shè)計(jì)(a)是為美國女性設(shè)計(jì)的，右面的界面(b)是為歐洲男性知識分子設(shè)計(jì)的。設(shè)計(jì)師Marcus的思想是，歐洲男性知識分子喜歡“溫暖的散文，較為拘謹(jǐn)?shù)男畔⒎植?，古典的字體相反地，美國女性“喜好更復(fù)雜的表現(xiàn)方式和彎曲的外形，但是不喜歡過于豪放。.4聲音用戶界面AUI, Audio User Interface 聲音用戶界面就是經(jīng)過在產(chǎn)品中運(yùn)用過程中引入聲音而實(shí)現(xiàn)的人機(jī)交互界面。聲音用戶界面是對圖形用戶界面和實(shí)體用戶界面的有益補(bǔ)充，并與后兩者共同構(gòu)成三位一體的人機(jī)互動方式。其主要表現(xiàn)方式有：語音提示：主要是讓人明白下一步該如何操作；事件

9、鈴聲：是為了提示運(yùn)用者一項(xiàng)功能的開場或完成；背景音樂：既可以緩解對某項(xiàng)操作的過長等待，又可以添加產(chǎn)品運(yùn)用的樂趣；操作反響聲音：主要是讓運(yùn)用者明白操作的正確與否，當(dāng)然有時也是為了表現(xiàn)一種運(yùn)用的滿足感。.需求留意的是：聲音用戶界面所傳送的信息和心情，必需與產(chǎn)品的籠統(tǒng)相符合。對于企業(yè)來講：富有特征的聲音用戶界面的引入，既可以堅(jiān)持產(chǎn)品籠統(tǒng)的識別性，又可以讓消費(fèi)者運(yùn)用產(chǎn)品更加方便、更有樂趣。聲音用戶界面運(yùn)用：Windows XP系統(tǒng)是一個典范；SONY公司在聲音界面設(shè)計(jì)方面同樣比較勝利；國內(nèi)產(chǎn)品在這方面有一定的突破，但企業(yè)還沒有上升到進(jìn)展系統(tǒng)研討與規(guī)劃層面上來。.5人機(jī)界面的評價 在同一用戶界面中，一切

10、的菜單項(xiàng)選擇擇、命令輸入、數(shù)據(jù)顯示和其他功能應(yīng)堅(jiān)持風(fēng)格的一致性。風(fēng)格一致的人機(jī)界面會給人一種簡約、調(diào)和的美感。1、界面的顏色及風(fēng)格一致 產(chǎn)品軟件界面的總體顏色應(yīng)該接近和類似實(shí)體界面的總體顏色。1)一致性：一致性的界面設(shè)計(jì)讓運(yùn)用者更易學(xué)習(xí)和記憶。2) 親和性：界面應(yīng)該親切地約請運(yùn)用者進(jìn)一步探求系統(tǒng)。.3)簡單明了：運(yùn)用者需求能迅速了解界面的架構(gòu)，開場運(yùn)用它。不要使選單太雜，動畫及圖標(biāo)不要運(yùn)用太難了解的隱喻，或需求太多想象的隱喻。4)謹(jǐn)慎的運(yùn)用顏色：顏色當(dāng)然是高度有效的非言語方法(例好像樣是藍(lán)色的指令應(yīng)該代表著它們相互關(guān)聯(lián))。但是假設(shè)隨機(jī)運(yùn)用，顏色可以讓運(yùn)用者轉(zhuǎn)移留意力而感到混淆。思索運(yùn)用一樣色系

11、但是深淺不一的顏色，而非徹底對比的顏色。2 界面視覺元素的規(guī)范3 聲音界面與實(shí)體界面和圖形界面的一致性.EMP-ZII夏新u 807. 怎樣評價一個人機(jī)界面設(shè)計(jì)質(zhì)量的優(yōu)劣，目前還沒有一個一致的規(guī)范。普通地，評價可以從以下幾個主要方面進(jìn)展思索：(1)用戶對人機(jī)界面的稱心程度；(2)人機(jī)界面的規(guī)范化程度；(3)人機(jī)界面的順應(yīng)性和協(xié)調(diào)性；(4)人機(jī)界面的運(yùn)用條件；(5)人機(jī)界面的性能價錢比。. 目前人們習(xí)慣于用“界面友好性這一籠統(tǒng)概念來評價一個人機(jī)界面的好壞，但“但面友好與“界面不友好恐怕無人能定一個確切的界限，普通以為一個友好的人機(jī)界應(yīng)該至少具備以下特征：(1)操作簡單，易學(xué)，易掌握；(2)界面美

12、觀，操作溫馨；(3)快速反響，呼應(yīng)合理；(4)用語通俗，語義一致。 下面我們從設(shè)計(jì)實(shí)際的角度分析界面友好的斷定 ：界面友好即系統(tǒng)模型與心思模型具有良好的一致性。.我們先引見三個概念：心思模型：心思是存在于人們頭腦中的關(guān)于一個產(chǎn)品應(yīng)該具有的概念和行為的知識。實(shí)現(xiàn)模型：是產(chǎn)品的內(nèi)部構(gòu)造和任務(wù)原理。它存在于設(shè)計(jì)人員的頭腦中。系統(tǒng)模型：是指產(chǎn)品的最終外觀以及產(chǎn)品呈現(xiàn)給用戶后，用戶經(jīng)過察看或運(yùn)用而構(gòu)成的關(guān)于產(chǎn)品如何運(yùn)用和任務(wù)的知識。.心思模型：將要扔掉的物品的稱號，或最多包括一些樸素的關(guān)于物品的分類方法：食品類、包裝類等；實(shí)現(xiàn)模型：“可回收與“不可回收；系統(tǒng)模型：標(biāo)有“回收、不可回收物品字樣的外觀的渣滓

13、桶 作業(yè)：設(shè)計(jì)渣滓桶界面。例子：.前面案例說到的“好用，在交互界面設(shè)計(jì)領(lǐng)域，選擇的措辭是“界面友好 。但界面友好是一個比較模糊的概念，今兩年來，設(shè)計(jì)人員傾向于采用“可用性(Usability)這個詞，并得到越來越多的相關(guān)專業(yè)人士的認(rèn)同，其實(shí)際也在不斷的開展中，構(gòu)成了一門學(xué)科:可用性工程(Usability Engineering)?？捎眯怨こ淌墙换ナ絀T產(chǎn)品/系統(tǒng)的一種先進(jìn)開發(fā)方法，包括一整套工程過程、方法、工具和國際規(guī)范，它運(yùn)用于產(chǎn)品生命周期的各個階段，中心是以用戶為中心的設(shè)計(jì)方法論(user-centered design一UCD)，強(qiáng)調(diào)以用戶為中心來進(jìn)展開發(fā)，能有效評價和提高產(chǎn)品可用性質(zhì)量，彌補(bǔ)了常規(guī)開發(fā)方法無法保證可用性質(zhì)量的缺乏。.錢抒，張福昌，MP3的界面設(shè)計(jì)研討，江南大學(xué)，2005.6周睿，張錫，基于可用性的手機(jī)交互界面設(shè)計(jì)研討，南京理工大學(xué)，2006.6霍發(fā)青，陳汗青，人機(jī)界面研討，武漢理工大學(xué)，2003.11.作品欣賞.美感： 往往有比例和尺度、平衡與穩(wěn)定、一致與變化、節(jié)拍與韻律等多種方式，產(chǎn)品的界面美是從人類長期實(shí)際閱歷總結(jié)出的結(jié)論，對設(shè)計(jì)具有一定的指點(diǎn)作用。當(dāng)然，這里的“美，不單單是指產(chǎn)品的外觀可以引起人們的喜歡，同時也包括運(yùn)用產(chǎn)品的直爽感、擁有高科技產(chǎn)品的滿足感、以及在運(yùn)用過