產(chǎn)品界面設(shè)計(jì)

產(chǎn)品界面設(shè)計(jì)第1頁(yè)/共45頁(yè)單獨(dú)的點(diǎn)，本身沒(méi)有上、下、左、右的指向。當(dāng)畫(huà)面上只有一個(gè)點(diǎn)的時(shí)候，人的視線就會(huì)自覺(jué)不自覺(jué)的集中在這個(gè)點(diǎn)上，形成求心性的特點(diǎn)。當(dāng)點(diǎn)在畫(huà)面上的位置不同時(shí)，視覺(jué)感就有一些變化。

集中點(diǎn)動(dòng)感重心下移傾斜感凸感增強(qiáng)壓迫感單調(diào)感頭重腳輕有穩(wěn)定感張力感凹形感更強(qiáng)

不穩(wěn)定感

第2頁(yè)/共45頁(yè)（2）多點(diǎn)的視覺(jué)效果平行的雙點(diǎn)在造型上可以產(chǎn)生對(duì)稱、均衡的藝術(shù)效果；密集性的多點(diǎn)排列能產(chǎn)生面的效果；多點(diǎn)大小不同，錯(cuò)落相間，可產(chǎn)生運(yùn)動(dòng)感和空間感。

連線效果虛形三角形的面的聯(lián)想層次感

活潑嚴(yán)肅由大到小的秩序感由大到小方向的動(dòng)感靜態(tài)感

由近到遠(yuǎn)的層次感視覺(jué)停滯點(diǎn)第3頁(yè)/共45頁(yè)

活潑嚴(yán)肅韻律動(dòng)感點(diǎn)大又疏，圖形顯得干凈、豪爽，錯(cuò)視靜態(tài)感點(diǎn)小又密，圖形顯得細(xì)膩

點(diǎn)的不同排列、組合，在人的視覺(jué)上會(huì)產(chǎn)生不同的感受與心理反應(yīng)，會(huì)傳達(dá)不同視覺(jué)信息，產(chǎn)生不同的審美效果，如：和諧、比例、對(duì)稱、均很、運(yùn)動(dòng)等，在產(chǎn)品形態(tài)設(shè)計(jì)中被廣泛得到應(yīng)用。第4頁(yè)/共45頁(yè)新穎墻面開(kāi)關(guān)設(shè)計(jì)第5頁(yè)/共45頁(yè)2.1產(chǎn)品面板設(shè)計(jì)——點(diǎn)的設(shè)計(jì)與應(yīng)用

產(chǎn)品面板設(shè)計(jì)是產(chǎn)品形態(tài)設(shè)計(jì)的一項(xiàng)重要內(nèi)容，如指示燈、開(kāi)關(guān)、螺釘、旋鈕、按鍵、商標(biāo)、文字等，當(dāng)它們體積小于儀器整體和面板時(shí)，都可以認(rèn)為是點(diǎn)。

錄音控制面板儀器控制面板

第6頁(yè)/共45頁(yè)面板與元器件面板——人機(jī)相互交流的窗口，元器件——人和產(chǎn)品進(jìn)行交流溝通的媒介

——點(diǎn)，可以布置在產(chǎn)品的平面和三維空間中。

顯示元器件——

從產(chǎn)品面板中獲得輸出信息

操作元器件——

輸入操作指令顯示元器件與操作元器件之間的相容程度，直接影響人與產(chǎn)品的交流效果，也就是說(shuō)直接影響著產(chǎn)品的質(zhì)量。如：當(dāng)你在玩游戲時(shí)，游戲機(jī)的操作件不能完成你的指令，你就會(huì)認(rèn)為，這個(gè)游戲機(jī)質(zhì)量不好，或者說(shuō)這個(gè)游戲機(jī)壞了；又如：當(dāng)你使用你的手機(jī)發(fā)短信的時(shí)候，手機(jī)顯示屏，不能正確反應(yīng)你的意愿，你就會(huì)認(rèn)為這部手機(jī)質(zhì)量有問(wèn)題。

電器柜

第7頁(yè)/共45頁(yè)元器件的分類根據(jù)信號(hào)發(fā)生的方式，信號(hào)可分類輸入信號(hào)和輸出信號(hào)兩種。輸入信號(hào)通過(guò)控制元器件轉(zhuǎn)達(dá)人們的指令輸出信號(hào)通過(guò)顯示元器件回答人們執(zhí)行情況的信息。下面從這兩個(gè)方面對(duì)產(chǎn)品設(shè)計(jì)中常出現(xiàn)的元器件進(jìn)一步分類，可以在眾多類似點(diǎn)的元器件布置設(shè)計(jì)中，幫助我們實(shí)現(xiàn)同類分組設(shè)計(jì)、同形狀分組設(shè)計(jì)、同屬性分組設(shè)計(jì)、操作順序分組設(shè)計(jì)等，以達(dá)到最佳的設(shè)計(jì)效果。第8頁(yè)/共45頁(yè)顯示器——產(chǎn)品輸出信號(hào)元器件，主要包括：視覺(jué)顯示、聽(tīng)覺(jué)顯示、嗅覺(jué)顯示和觸覺(jué)顯示控制器——產(chǎn)品接受指令的部分，按運(yùn)動(dòng)的形式、人體操作的部位和操作功能三個(gè)角度進(jìn)行了分類。第9頁(yè)/共45頁(yè)1.顯示器分類指針式：橫豎式刻度或數(shù)字儀表、視覺(jué)顯示器數(shù)字式：二極管數(shù)字顯示圖像式：圖像顯示屏、數(shù)字顯示屏、文字顯示屏指示燈:

打印機(jī)：蜂鳴器聽(tīng)覺(jué)顯示器鈴聲報(bào)警器汽笛嗅覺(jué)顯示器觸覺(jué)顯示器

顯示器第10頁(yè)/共45頁(yè)2.控制器分類旋轉(zhuǎn)控制器：曲柄、手輪、旋塞、旋鈕、鑰匙、舵?zhèn)}、方向盤、十字把、扳手?jǐn)[動(dòng)控制器：開(kāi)關(guān)桿、調(diào)節(jié)桿、杠桿件、擺動(dòng)件、踏板按壓控制器：按鈕、按鍵、鍵盤滑動(dòng)控制器：手閘、形狀指撥滑塊、摩擦指撥滑塊牽拉控制器：拉環(huán)、拉圈、拉手、拉鈕按運(yùn)動(dòng)形式分第11頁(yè)/共45頁(yè)按人體操作部位分類：

手動(dòng)控制器：旋鈕、按鍵、搖把、手柄、舵輪

腳動(dòng)控制器：腳踏板、腳踏鈕按操作功能分類：

開(kāi)關(guān)控制器：手閘、按鈕、踏板、手柄

轉(zhuǎn)換控制器：按鈕、選擇開(kāi)關(guān)

調(diào)整控制器：旋鈕、手柄

緊急停車控制器：（不能與其它顯示與操作件同時(shí)安裝）第12頁(yè)/共45頁(yè)各種控制元器件

第13頁(yè)/共45頁(yè)3.產(chǎn)品顯示元器件與控制元器件布置原則顯示元器件與控制元器件與面板整體相比，體積小巧，可以認(rèn)為是視覺(jué)點(diǎn)，與純視覺(jué)點(diǎn)設(shè)計(jì)相比，產(chǎn)品的顯示元器件與相應(yīng)的操作控制元器件有一一對(duì)應(yīng)的功能邏輯關(guān)系，因此，它們的位置和操作的方式之間也有一定的邏輯關(guān)系，這里不能把它們看作純視覺(jué)的點(diǎn)，應(yīng)從概念設(shè)計(jì)的角度，運(yùn)用美學(xué)法則，在平面設(shè)計(jì)的基礎(chǔ)上，討論它們的美學(xué)布置形式；還應(yīng)從功能特點(diǎn)出發(fā)，考慮顯示元器件與控制元器件之間的邏輯關(guān)系，從而確定顯示元器件和控制元器件在面板中的位置以及它們的布置形式。第14頁(yè)/共45頁(yè)因?yàn)楫a(chǎn)品造型設(shè)計(jì)首先要考慮適應(yīng)產(chǎn)品功能的要求，強(qiáng)調(diào)產(chǎn)品內(nèi)在、外在形式的統(tǒng)一，這樣有利于提高效率，使操作者精力集中，降低錯(cuò)誤率。在此前提下，應(yīng)盡量使產(chǎn)品造型內(nèi)、外形式兩相兼顧，協(xié)調(diào)好產(chǎn)品形體各部件尺寸大小和比例關(guān)系。人機(jī)工程學(xué)為產(chǎn)品顯示元器件和控制元器件的不是形式，提供了許多設(shè)計(jì)原則。第15頁(yè)/共45頁(yè)（1）

常用的面板布置形式面板布局設(shè)計(jì)涉及的元器件主要有顯示器和控制器兩大類。要使產(chǎn)品達(dá)到即高效又美觀的效果，可以通過(guò)以下方面的努力實(shí)現(xiàn)：一是通過(guò)面板布局的方式獲得；二是運(yùn)用控制器與顯示器操作的邏輯關(guān)系布置面板可以獲得；三是通過(guò)合適分割面板獲得顯示器和控制器的位置。常用的面板布置方式（8種）：①操作指示內(nèi)容以線條形式圈定第16頁(yè)/共45頁(yè)②操作指示的內(nèi)容以空格形式分布③操作指示內(nèi)容通過(guò)凸凹形式區(qū)分第17頁(yè)/共45頁(yè)④操作指示內(nèi)容以相同形狀的形式歸類第18頁(yè)/共45頁(yè)⑤操作指示內(nèi)容以色塊形式區(qū)分

⑥操作指示內(nèi)容以括號(hào)形式連接

第19頁(yè)/共45頁(yè)⑦操作指示內(nèi)容以功能內(nèi)容形式歸類⑧操作指示內(nèi)容以隔線形式區(qū)分

第20頁(yè)/共45頁(yè)（2）邏輯關(guān)系布置原則顯示器和控制器體積遠(yuǎn)小于控制面板，雖然可以把它視為點(diǎn)，但在產(chǎn)品的顯示器和控制器的布置形式中，卻不能把它看作純視覺(jué)的點(diǎn)來(lái)設(shè)計(jì)，顯示器與相應(yīng)的控制器之間有一一對(duì)應(yīng)的操作邏輯關(guān)系，這是人們?cè)陂L(zhǎng)期的生活實(shí)踐中形成的習(xí)慣，也是顯示器和控制器位置設(shè)計(jì)必須遵守的原則。當(dāng)顯示器與控制器布置在三維空間時(shí)，其顯示器讀數(shù)的方向和控制器運(yùn)動(dòng)的方向，應(yīng)滿足下圖中箭頭所指的方向。第21頁(yè)/共45頁(yè)（3）通過(guò)分割獲得合適的位置若面板僅有一組多輸出、單輸入的顯示控制元器件，或者僅有一組單輸出、多個(gè)輸入顯示控制元器件，可以采用非對(duì)稱性分割方式確定點(diǎn)的位置，這種布局既調(diào)和有對(duì)比，即變化又統(tǒng)一。第22頁(yè)/共45頁(yè)當(dāng)布置面板里作為點(diǎn)的顯示和控制元器件時(shí)，最好不要用下圖左邊的兩種方法，對(duì)稱劃分面板，這樣會(huì)造成面板布置形式呆板，單調(diào)。采用非對(duì)稱分割，但又注意布局的視覺(jué)力矩的均衡效果，就像右邊兩種布局形式，以達(dá)到自然生動(dòng)的效果。第23頁(yè)/共45頁(yè)在面板垂直方向1/5的位置，或橫向方向3/10的位置，繪制矩形分割線，將面板涉及的元素，放在分割線的交匯處，或被分割的面塊中，這樣構(gòu)圖，其面積大小與色彩既有對(duì)比，又有均衡統(tǒng)一，能給人以整體協(xié)調(diào)感和美感。以4條非均衡的水平線和垂直線分割面板，將面板所涉及的元素，如：手柄，布置在左半部下條橫線中間，將旋鈕和顯示燈布置在右垂直線的右中部，將文字布置在上橫線的上部，這樣布置造成疏密相間、縱橫對(duì)比，給人以舒展的感覺(jué)。第24頁(yè)/共45頁(yè)在縱橫1/3處作矩形的分割線，按此布局也能獲得較好的視覺(jué)效果。

第25頁(yè)/共45頁(yè)利用斜線分割，可獲得生動(dòng)活躍的視覺(jué)效果，因?yàn)樾本€能產(chǎn)生動(dòng)感，能產(chǎn)生把某物向上推移或向下滑行的感覺(jué)。這種分割布局能獲得構(gòu)圖的疏密對(duì)比，均衡穩(wěn)定和韻律感。

第26頁(yè)/共45頁(yè)應(yīng)用曲線分割能使面板構(gòu)圖既有活躍的動(dòng)感，又具有安靜舒展的視覺(jué)效果。第27頁(yè)/共45頁(yè)顯示和控制元器件在面板上的布置方法有很多，以上分割方法只是面板設(shè)計(jì)中常用的方法，根據(jù)各個(gè)不同面板的顯示和控制元器件的不同，靈活運(yùn)用平面構(gòu)成中點(diǎn)的構(gòu)成方法，達(dá)到最佳視覺(jué)效果。第28頁(yè)/共45頁(yè)案例2-1：儀表面板設(shè)計(jì)下圖儀表面板設(shè)計(jì)的兩個(gè)方案。顯示器輸出元器件有：液晶顯示屏一個(gè)、打印機(jī)一個(gè)儀表名字和生產(chǎn)廠家；輸入控制元器件有：?jiǎn)?dòng)按鍵顯示開(kāi)關(guān)一個(gè)控制顯示按鍵6個(gè)第29頁(yè)/共45頁(yè)方案一分析：用一組象征黃鶴的非對(duì)稱的水平線和垂直線分割矩形，將顯示元器件布置在左側(cè)用色彩構(gòu)成翅膀的色塊中，將啟動(dòng)按鈕放置在右上端（工作中較少使用），與儀表名稱放在一條線上，將6個(gè)工作操作按鈕，布置在象征著鵝頸部，一字排開(kāi)，下面用文字注明功用，右下角注明生產(chǎn)單位。整個(gè)布局顯得疏密有序，顯得舒展又有內(nèi)涵。第30頁(yè)/共45頁(yè)方案二分析：采運(yùn)用一組斜線和水平線分割矩形，并用協(xié)調(diào)色塊區(qū)別，將啟動(dòng)開(kāi)關(guān)按鈕與工作操作按鈕一字排開(kāi)，但用不同形狀的按鈕區(qū)分。由于啟動(dòng)按鈕在工作中，使用較少，放置在最左邊，下面用文字說(shuō)明功用，將打印機(jī)布置在右下角，顯示屏布置在面板的左上角，儀表名字置于打印機(jī)的上方，制作單位布置在面板的左下角，方案整個(gè)顯得均衡有序，顯示元器件工作線路與控制元器件工作線路互不干擾，井然有序，思路清晰。第31頁(yè)/共45頁(yè)案例2-2：掌上電腦和3G手機(jī)形態(tài)設(shè)計(jì)案例分析下圖是掌上電腦的與3G手機(jī)兩個(gè)產(chǎn)品形態(tài)設(shè)計(jì)中的交互面板的設(shè)計(jì)案例，相同的是兩個(gè)產(chǎn)品的輸出元器件：顯示屏、蜂鳴器、喇叭；輸入元器件：掌上電腦左邊一組有30個(gè)按鍵，右組有43個(gè)按鍵，中間有4個(gè)按鍵，按鍵按凸凹分區(qū)，啟動(dòng)開(kāi)關(guān)緊挨在顯示屏右邊。3G手機(jī)相同形狀按鍵30個(gè)，布置在手機(jī)控制區(qū)下部，上部有9個(gè)特殊按鍵，用特殊形狀區(qū)別，布置在手機(jī)按鍵區(qū)的上部，并用色彩分區(qū)區(qū)別。按鍵由于使用功能設(shè)定的區(qū)域不同，其造型各有自己的特點(diǎn)去強(qiáng)調(diào)自身的功能特定，使消費(fèi)者在購(gòu)買時(shí)，通過(guò)產(chǎn)品外形就能迅速找到自己需要使用功能的產(chǎn)品。第32頁(yè)/共45頁(yè)在產(chǎn)品面板設(shè)計(jì)中，還需注意：儀器儀表、機(jī)床控制面板操作控制區(qū)域和顯示輸出信號(hào)區(qū)域等部件的面積比例設(shè)計(jì)，必須與產(chǎn)品形態(tài)所強(qiáng)調(diào)產(chǎn)品功能效應(yīng)相適應(yīng)，才能增加產(chǎn)品的附加值。第33頁(yè)/共45頁(yè)第34頁(yè)/共45頁(yè)作業(yè)1.等離子切割機(jī)控制柜操作面板的改良設(shè)計(jì)

設(shè)計(jì)要求：1)液晶屏邊框?qū)嶋H沒(méi)有白色線條；2)按鍵顏色基本上已定；3)面板主體顏色可通過(guò)塑料選色、做油漆等方法來(lái)改變；4)小面板下方長(zhǎng)條、各右側(cè)方格可用寫(xiě)真、噴繪、彩印、滴塑等多種先進(jìn)工藝；5)按鍵區(qū)域框架可采用單獨(dú)油漆、貼膜、貼鋁、貼彩色不銹鋼等工藝方案；6)還可考慮其他先進(jìn)工藝方案來(lái)設(shè)計(jì)。第35頁(yè)/共45頁(yè)第36頁(yè)/共45頁(yè)第37頁(yè)/共45頁(yè)第38頁(yè)/共45頁(yè)控制柜裝配圖第39頁(yè)/共45頁(yè)國(guó)內(nèi)等離子切割機(jī)控制柜面板第40頁(yè)/共45頁(yè)國(guó)外等離子切割機(jī)控制柜面板

美國(guó)海寶（EDGE）、美國(guó)BURNY、德國(guó)的西門子(SIEMENS)、西班牙的法格(FAGOR)、日本的法納克(FANUC)

美國(guó)海寶（EDGE