產(chǎn)品界面設計

產(chǎn)品界面設計第1頁/共45頁單獨的點，本身沒有上、下、左、右的指向。當畫面上只有一個點的時候，人的視線就會自覺不自覺的集中在這個點上，形成求心性的特點。當點在畫面上的位置不同時，視覺感就有一些變化。

集中點動感重心下移傾斜感凸感增強壓迫感單調感頭重腳輕有穩(wěn)定感張力感凹形感更強

不穩(wěn)定感

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

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

活潑嚴肅由大到小的秩序感由大到小方向的動感靜態(tài)感

由近到遠的層次感視覺停滯點第3頁/共45頁

活潑嚴肅韻律動感點大又疏，圖形顯得干凈、豪爽，錯視靜態(tài)感點小又密，圖形顯得細膩

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

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

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

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

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

顯示元器件——

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

操作元器件——

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

電器柜

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

打印機：蜂鳴器聽覺顯示器鈴聲報警器汽笛嗅覺顯示器觸覺顯示器

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

手動控制器：旋鈕、按鍵、搖把、手柄、舵輪

腳動控制器：腳踏板、腳踏鈕按操作功能分類：

開關控制器：手閘、按鈕、踏板、手柄

轉換控制器：按鈕、選擇開關

調整控制器：旋鈕、手柄

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

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

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

⑥操作指示內容以括號形式連接

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

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

第25頁/共45頁利用斜線分割，可獲得生動活躍的視覺效果，因為斜線能產(chǎn)生動感，能產(chǎn)生把某物向上推移或向下滑行的感覺。這種分割布局能獲得構圖的疏密對比，均衡穩(wěn)定和韻律感。

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

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

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

美國海寶（EDGE