1、什么是界面設(shè)計(jì),界面設(shè)計(jì)的研究領(lǐng)域,用戶界面設(shè)計(jì)的原則,界面設(shè)計(jì)的分類,優(yōu)秀界面設(shè)計(jì)欣賞,界面設(shè)計(jì)作業(yè)要求,界面設(shè)計(jì)是人與機(jī)器之間傳遞和交換信息的媒介，包括硬件界面和軟件界面，是計(jì)算機(jī)科學(xué)與心理學(xué)、設(shè)計(jì)藝術(shù)學(xué)、認(rèn)知科學(xué)和人機(jī)工程學(xué)的交叉研究領(lǐng)域。近年來(lái)，隨著信息技術(shù)與計(jì)算機(jī)技術(shù)的迅速發(fā)展，網(wǎng)絡(luò)技術(shù)的突飛猛進(jìn)，人機(jī)界面設(shè)計(jì)和開發(fā)已成為國(guó)際計(jì)算機(jī)界和設(shè)計(jì)界最為活躍的研究方向。,什么是界面設(shè)計(jì),界面設(shè)計(jì)的研究領(lǐng)域,人機(jī)界面的定義、起源、發(fā)展、研究?jī)?nèi)容及發(fā)展趨勢(shì)； 人機(jī)界面設(shè)計(jì)中認(rèn)知心理學(xué)、人機(jī)工程學(xué)、人機(jī)界面的藝術(shù)設(shè)計(jì)、色彩設(shè)計(jì)等； 人機(jī)界面設(shè)計(jì)，硬件人機(jī)界面的設(shè)計(jì)風(fēng)格、人文關(guān)懷等； 軟件人機(jī)界面的

2、形式與標(biāo)準(zhǔn)、軟件人機(jī)界面設(shè)計(jì)、Internet網(wǎng)頁(yè)界面設(shè)計(jì)、圖標(biāo)設(shè)計(jì)等； 人機(jī)界面設(shè)計(jì)評(píng)價(jià)與可用性測(cè)試；新交互技術(shù)及展望，介紹了多通道用戶界面、下一代人機(jī)界面展望及附錄。,什么是界面設(shè)計(jì),什么是界面設(shè)計(jì),什么是界面設(shè)計(jì),什么是界面設(shè)計(jì),用戶界面設(shè)計(jì)的原則,軟件用戶界面（Software User Interface）是指軟件用于和用戶交流的外觀、部件和 程序等等。如果你經(jīng)常上網(wǎng)的話，會(huì)看到很多軟件設(shè)計(jì)很樸素，看起來(lái)給人一種很 舒服的感覺(jué)；有點(diǎn)軟件很有創(chuàng)意，能給人帶來(lái)意外的驚喜和視覺(jué)的沖擊；而相當(dāng)多 的軟件頁(yè)面上充斥著怪異的字體，花哨的色彩和圖片，給人網(wǎng)頁(yè)制作粗劣的感覺(jué)。 軟件界面的設(shè)計(jì)，既要從

3、外觀上進(jìn)行創(chuàng)意以到達(dá)吸引眼球的目的，還要結(jié)合圖形和 版面設(shè)計(jì)的相關(guān)原理，從而使得軟件設(shè)計(jì)變成了一門獨(dú)特的藝術(shù)。通常的講，企業(yè) 軟件用戶界面的設(shè)計(jì)應(yīng)遵循以下幾個(gè)基本原則：,用戶界面設(shè)計(jì)的原則,1用戶導(dǎo)向（User oriented）原則,設(shè)計(jì)網(wǎng)頁(yè)首先要明確到底誰(shuí)是使用者，要站在用戶的觀點(diǎn)和立場(chǎng)上來(lái)考慮設(shè)計(jì)軟 件。要作到這一點(diǎn)，必須要和用戶來(lái)溝通，了解他們的需求、目標(biāo)、期望和偏好 等。網(wǎng)頁(yè)的設(shè)計(jì)者要清楚，用戶之間差別很大，他們的能力各有不同。比如有的用 戶可能會(huì)在視覺(jué)方面有欠缺（如色盲），對(duì)很多的顏色分辨不清；有的用戶的聽覺(jué) 也會(huì)有障礙，對(duì)于軟件的語(yǔ)音提示反映遲鈍；而且相當(dāng)一部分用戶的計(jì)算機(jī)使用經(jīng)

4、 驗(yàn)很初級(jí)，對(duì)于復(fù)雜一點(diǎn)的操作會(huì)感覺(jué)到很費(fèi)力。另外，用戶使用的計(jì)算機(jī)機(jī)器配 置也是千差萬(wàn)別，包括顯卡、聲卡、內(nèi)存、網(wǎng)速、操作系統(tǒng)以及瀏覽器等都會(huì)有不 同。設(shè)計(jì)者如果忽視了這些差別，設(shè)計(jì)出的網(wǎng)頁(yè)在不同的機(jī)器上顯示就會(huì)造成混 亂。,用戶界面設(shè)計(jì)的原則,1用戶導(dǎo)向（User oriented）原則,用戶界面設(shè)計(jì)的原則,2KISS（Keep It Simple And Stupid）原則,KISS原則就是“Keep It Simple And Stupid”的縮寫，簡(jiǎn)潔和易于操作是網(wǎng)頁(yè)設(shè)計(jì)的最 重要的原則。畢竟，軟件建設(shè)出來(lái)是用于普通網(wǎng)民來(lái)查閱信息和使用網(wǎng)絡(luò)服務(wù)。沒(méi)有 必要在網(wǎng)頁(yè)上設(shè)置過(guò)多的操作，堆集

5、上很多復(fù)雜和花哨的圖片。該原則一般的要求， 網(wǎng)頁(yè)的下載不要超過(guò)10秒鐘（普通的撥號(hào)用戶56 Kbps網(wǎng)速）；盡量使用文本鏈接， 而減少大幅圖片和動(dòng)畫的使用；操作設(shè)計(jì)盡量簡(jiǎn)單，并且有明確的操作提示；軟件所 有的內(nèi)容和服務(wù)都在顯眼處向用戶予以說(shuō)明等。,用戶界面設(shè)計(jì)的原則,2KISS（Keep It Simple And Stupid）原則,用戶界面設(shè)計(jì)的原則,3布局控制,關(guān)于網(wǎng)頁(yè)排版布局方面，很多網(wǎng)頁(yè)設(shè)計(jì)者重視不夠，網(wǎng)頁(yè)排版設(shè)計(jì)的過(guò)于死板，甚 至照抄他人。如果網(wǎng)頁(yè)的布局凌亂，僅僅把大量的信息堆集在頁(yè)面上，會(huì)干擾瀏覽 者的閱讀。,用戶界面設(shè)計(jì)的原則,3布局控制,用戶界面設(shè)計(jì)的原則,4視覺(jué)平衡,網(wǎng)頁(yè)設(shè)

6、計(jì)時(shí)，也要各種元素（如圖形、文字、空白）都會(huì)有視覺(jué)作用。根據(jù)視覺(jué)原 理，圖形與一塊文字相比較，圖形的視覺(jué)作用要大一些。所以，為了達(dá)到視覺(jué)平衡 ，在設(shè)計(jì)網(wǎng)頁(yè)時(shí)需要以更多的文字來(lái)平衡一幅圖片。另外，按照中國(guó)人的閱讀習(xí)慣是 從左到右，從上到下，因此視覺(jué)平衡也要遵循這個(gè)這個(gè)道理。例如，你的很多的文字 是采用左對(duì)齊Align=left，需要在網(wǎng)頁(yè)的右面加一些圖片或一些較明亮、較醒目的 顏色。一般情況下，每張網(wǎng)頁(yè)都會(huì)設(shè)置一個(gè)頁(yè)眉部分和一個(gè)頁(yè)腳部分，頁(yè)眉部分常放 置一些Banner廣告或?qū)Ш綏l，而頁(yè)腳部分通常放置聯(lián)系方式和版權(quán)信息等，頁(yè)眉和頁(yè) 腳在設(shè)計(jì)上也要注重視覺(jué)平衡。同時(shí)，也決不能低估空白的價(jià)值。如果你

7、的網(wǎng)頁(yè)上所 顯示的信息非常密集，這樣不但不利于讀者閱讀，甚至?xí)鹱x者反感，破壞該軟件 的形象。在網(wǎng)頁(yè)設(shè)計(jì)上，適當(dāng)增加一些空白，精煉你的網(wǎng)頁(yè)，使得頁(yè)面變的簡(jiǎn)潔。,用戶界面設(shè)計(jì)的原則,4視覺(jué)平衡,用戶界面設(shè)計(jì)的原則,4視覺(jué)平衡,用戶界面設(shè)計(jì)的原則,5色彩的搭配和文字的可閱讀性,顏色是影響網(wǎng)頁(yè)的重要因素，不同的顏色對(duì)人的感覺(jué)有不同的影響，例如：紅色和 橙色使人興奮并使得心跳加速；黃色使人聯(lián)想到陽(yáng)光，是一種快活的顏色；黑顏色顯得比較莊重，考慮到你希望對(duì)瀏覽者產(chǎn)生什么影響，為網(wǎng)頁(yè)設(shè)計(jì)選擇合適的顏色（包括背景色、元素顏色、文字顏色、鏈節(jié)顏色等）。 為方便閱讀軟件上的信息，可以參考報(bào)紙的編排方式將網(wǎng)頁(yè)的內(nèi)

8、容分欄設(shè)計(jì)，甚至兩欄也要比一滿頁(yè)的視覺(jué)效果要好。另一種能夠提高文字可讀性的因素是所選擇的字體，通用的字體（Arial，Courier New，Garamond，Times New Roman，中文宋體）最易閱讀，特殊字體用于標(biāo)題效果較好，但是不適合正文。如果在整個(gè)頁(yè)面使用一些特殊字體（如Cloister，Gothic，Script，Westminster，華文彩云，華文行楷），這樣讀者閱讀起來(lái)感覺(jué)一定很糟糕。該類特殊字體如果在頁(yè)面上大量使用，會(huì)使得閱讀頗為費(fèi)力，瀏覽者的眼睛很快就會(huì)疲勞，不得不轉(zhuǎn)移到其他頁(yè)面。,用戶界面設(shè)計(jì)的原則,6和諧與一致性,通過(guò)對(duì)軟件的各種元素（顏色、字體、圖形、空白等）

9、使用一定的規(guī)格，使得設(shè)計(jì) 良好的網(wǎng)頁(yè)看起來(lái)應(yīng)該是和諧的?；蛘哒f(shuō)，軟件的眾多單獨(dú)網(wǎng)頁(yè)應(yīng)該看起來(lái)像一個(gè) 整體。軟件設(shè)計(jì)上要保持一致性，這又是很重要的一點(diǎn)。一致的結(jié)構(gòu)設(shè)計(jì)，可以讓 瀏覽者對(duì)軟件的形象有深刻的記憶；一致的導(dǎo)航設(shè)計(jì)，可以讓瀏覽者迅速而又有效 的進(jìn)入在軟件中自己所需要的部分；一致的操作設(shè)計(jì)，可以讓瀏覽者快速學(xué)會(huì)在整 個(gè)軟件的各種功能操作。破壞這一原則，會(huì)誤導(dǎo)瀏覽者，并且讓整個(gè)軟件顯的雜亂 無(wú)章，給人留下不良的印象。當(dāng)然，軟件設(shè)計(jì)的一致性并不意味著刻板和一成不 變，有的軟件在不同欄目使用不同的風(fēng)格，或者隨著時(shí)間的推移不斷的改版軟件， 會(huì)給瀏覽者帶來(lái)新鮮的感覺(jué)。,用戶界面設(shè)計(jì)的原則,7個(gè)性化,

10、界面設(shè)計(jì)的分類,軟件界面設(shè)計(jì) 手機(jī)界面設(shè)計(jì) 播放器界面設(shè)計(jì) 游戲界面設(shè)計(jì) 系統(tǒng)界面設(shè)計(jì) UI界面設(shè)計(jì) 家用電器界面設(shè)計(jì),界面設(shè)計(jì)的分類,軟件界面設(shè)計(jì),界面設(shè)計(jì)的分類,手機(jī)界面設(shè)計(jì),界面設(shè)計(jì)的分類,播放器界面設(shè)計(jì),界面設(shè)計(jì)的分類,游戲界面設(shè)計(jì),界面設(shè)計(jì)的分類,系統(tǒng)界面設(shè)計(jì),界面設(shè)計(jì)的分類,UI界面設(shè)計(jì),界面設(shè)計(jì)的分類,界面圖標(biāo)設(shè)計(jì)：,界面設(shè)計(jì)的分類,文化界面設(shè)計(jì),界面圖標(biāo)設(shè)計(jì)：,界面設(shè)計(jì)的分類,賣場(chǎng)圖標(biāo)設(shè)計(jì),界面圖標(biāo)設(shè)計(jì)：,課程作業(yè),1、自選內(nèi)容分別設(shè)計(jì)兩套不同風(fēng)格主題的界面（包括背景和圖標(biāo)） 場(chǎng)景風(fēng)格，模擬現(xiàn)實(shí)生活的場(chǎng)景，采取攝影，手繪或其他表現(xiàn)方式設(shè)計(jì)出場(chǎng)景化的多媒體界面（例圖）,課程作業(yè),

11、1、自選內(nèi)容分別設(shè)計(jì)兩套不同風(fēng)格主題的界面（包括背景和圖標(biāo)）其中一套為個(gè) 性化自我介紹的界面。場(chǎng)景風(fēng)格，模擬現(xiàn)實(shí)生活的場(chǎng)景，采取攝影，手繪或其他表現(xiàn)方式設(shè)計(jì)出場(chǎng)景化的多媒體界面（例圖）,2、界面背景要求：整體感強(qiáng)，色彩與圖形與圖標(biāo)風(fēng)格一致且有內(nèi)在聯(lián)系 3、圖標(biāo)要求：圖標(biāo)與圖標(biāo)之間保持一定的整體性，按鈕與連接內(nèi)容之間有內(nèi)在的呼應(yīng)關(guān)系 4、界面規(guī)格：1024X768 72dpi 5、作業(yè)說(shuō)明：界面背景 圖標(biāo) 6、評(píng)分標(biāo)準(zhǔn)：準(zhǔn)確性 趣味性 藝術(shù)性 7、交件形式：電腦稿件（圖標(biāo)和綜合效果兩套） 8、交件時(shí)間：課時(shí)內(nèi)完成,圖標(biāo)設(shè)計(jì)：,一、關(guān)于圖標(biāo) 定義：圖標(biāo)設(shè)計(jì)從某個(gè)角度來(lái)說(shuō)，圖標(biāo)有點(diǎn)類似標(biāo)志、徽標(biāo)都是

12、為了讓人們能夠 被它吸引記住。,圖標(biāo)設(shè)計(jì)：,一、關(guān)于圖標(biāo) 2、圖標(biāo)類型 程序圖標(biāo):指的是那些能夠在桌面上單擊、選擇、移動(dòng)、雙擊執(zhí)行命令的圖標(biāo)，類似于 “我的電腦”“回收站”等等。多數(shù)運(yùn)用于（電腦、掌上電腦、智能手機(jī)、操作系統(tǒng)等） 工具欄圖標(biāo)：指的是那些位于工具欄，通過(guò)單擊選擇該工具，然后在畫面可以進(jìn)一步 執(zhí)行命令的圖標(biāo)。“格式刷”回撤“字體加粗”等（多數(shù)運(yùn)用于操作軟件等，常見的PS) 按鈕圖標(biāo)：那些位于面板上，形似現(xiàn)實(shí)生活中的按鈕。（常見的遙控器、觸摸屏）,圖標(biāo)設(shè)計(jì)：,程序圖標(biāo):指的是那些能夠在桌面上單擊、選擇、移動(dòng)、雙擊執(zhí)行命令的圖標(biāo)，類似于 “我的電腦”“回收站”等等。多數(shù)運(yùn)用于（電腦、掌

13、上電腦、智能手機(jī)、操作系統(tǒng)等）,圖標(biāo)設(shè)計(jì)：,工具欄圖標(biāo)：指的是那些位于工具欄，通過(guò)單擊選擇該工具，然后在畫面可以進(jìn)一步 執(zhí)行命令的圖標(biāo)?！案袷剿ⅰ被爻贰白煮w加粗”等（多數(shù)運(yùn)用于操作軟件等，常見的PS) 按鈕圖標(biāo)：那些位于面板上，形似現(xiàn)實(shí)生活中的按鈕。（常見的遙控器、觸摸屏）,圖標(biāo)設(shè)計(jì)：,圖標(biāo)屬性： 1、圖標(biāo)尺寸：48*48、32*32、24*24、16*16像素一般設(shè)計(jì)都為正方形 2、色深度：windows支持32位圖標(biāo)。顏色是2的24次方加上一個(gè)8位alpha通道可以產(chǎn)生透明的 效果。,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)軟件： 1、ps、illustrator、Axialis IconWorkshop(圖

14、標(biāo)編輯設(shè)計(jì))等都可以， 但是ps設(shè)計(jì)制作時(shí)需要運(yùn)用像素繪圖的工具,是一款功能強(qiáng)大的圖標(biāo)設(shè)計(jì)工具。它被用來(lái)創(chuàng)建、提取、轉(zhuǎn)換、管理和發(fā)布 Windows(R)圖標(biāo)。通過(guò)它，你能創(chuàng)建、導(dǎo)入和保存所有的Windows(R)圖標(biāo)(ICO)和圖標(biāo)庫(kù)(ICL)。它支持新的帶Alpha通道圖像 （a.k.a.平滑透明度）的WindowsXP圖標(biāo)。在這個(gè)版本中，你甚至可以打開Macintosh(R)圖標(biāo)并將其轉(zhuǎn)換為Windows(R)格 式。AxialisIconWorkshop將許多的特殊功能完美的整合在一個(gè)工作區(qū)中。,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 1、水晶系列圖標(biāo)設(shè)計(jì),圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 2、透明水晶

15、風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 3、卡通風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 4、懷舊風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 5、馬里奧透明風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 6、創(chuàng)意風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 7、立體風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 8、立體風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 9、手繪卡通風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)風(fēng)格： 10、可愛(ài)卡通風(fēng)格,圖標(biāo)設(shè)計(jì)：,圖標(biāo)設(shè)計(jì)注意點(diǎn)： 1、構(gòu)思時(shí)利用發(fā)散性思維進(jìn)行創(chuàng)意聯(lián)想 2、創(chuàng)作時(shí)注意圖標(biāo)設(shè)計(jì)的可識(shí)別性 3、設(shè)計(jì)時(shí)注意圖標(biāo)設(shè)計(jì)的一致性（比如光源一致性） 4、圖標(biāo)設(shè)計(jì)注意盡量避免文字的出現(xiàn) 5、設(shè)計(jì)過(guò)程（首先：草稿繪圖，其次：電腦框架，再次：電

16、腦上色）,移動(dòng)設(shè)備界面設(shè)計(jì)：,1、移動(dòng)設(shè)備界面設(shè)計(jì)概況 2、移動(dòng)界面設(shè)計(jì)的特征 3、移動(dòng)設(shè)備界面設(shè)計(jì)與一般圖形化用戶界面設(shè)計(jì)的異同 4、移動(dòng)媒體基本界面的設(shè)計(jì) 5、欣賞,移動(dòng)設(shè)備界面設(shè)計(jì)：,1、移動(dòng)設(shè)備界面設(shè)計(jì)概況,移動(dòng)設(shè)備界面，主要指手機(jī)、PDA(個(gè)人掌上電腦）等移動(dòng)設(shè)備的圖形UI界面，這個(gè)是我們接觸 最為緊密的數(shù)字界面，也是使用最為廣泛的數(shù)字界面。,手機(jī)的發(fā)展過(guò)程：,1973年手機(jī)被發(fā)明，80年代初商用移動(dòng)電話出現(xiàn)。,移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)的發(fā)展過(guò)程：,1973年手機(jī)被發(fā)明，80年代初商用移動(dòng)電話出現(xiàn)。,戰(zhàn)地通訊設(shè)備,第一部完全意義上的手機(jī)（無(wú)顯示屏）,移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)的發(fā)展過(guò)程

17、：,1973年手機(jī)被發(fā)明，80年代初商用移動(dòng)電話出現(xiàn)。,只有按鍵、聽筒、和話筒等硬件界面，是固定電話的延續(xù)。,80年代末，帶有簡(jiǎn)單顯示屏的手機(jī)出現(xiàn)了，但是只能是顯示一些數(shù)字和固定文字,大哥大摩托羅拉3200,移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)的發(fā)展過(guò)程：,1973年手機(jī)被發(fā)明，80年代初商用移動(dòng)電話出現(xiàn)。,只有按鍵、聽筒、和話筒等硬件界面，是固定電話的延續(xù)。,80年代末，帶有簡(jiǎn)單顯示屏的手機(jī)出現(xiàn)了，但是只能是顯示一些數(shù)字和固定文字,移動(dòng)設(shè)備尚未發(fā)展到圖形界面階段,90年代后，手機(jī)開始完善基本通訊功能基礎(chǔ)上加入一些附加功能，比如電話簿、短信 游戲等，但是顯示屏仍然是小屏幕、低分辨率、單色顯示、鈴聲單一、靠

18、鍵盤輸入。,第一款翻蓋手機(jī)保護(hù)按鍵（3-4）萬(wàn),移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)的發(fā)展過(guò)程：,進(jìn)入21世紀(jì)，移動(dòng)設(shè)備依賴一個(gè)大爆發(fā)的發(fā)展，手機(jī)開始大屏幕、雙屏幕、彩屏等 手機(jī)鈴聲效果也越來(lái)越好，播放MP3；輸入方式變?yōu)殒I盤、觸控、語(yǔ)音輸入并存； 手功能也涵蓋了通訊、娛樂(lè)、協(xié)同工作、生活、學(xué)習(xí)等諸多方面，所謂的智能機(jī)。,移動(dòng)設(shè)備界面設(shè)計(jì)：,移動(dòng)設(shè)備界面獨(dú)特特征：,移動(dòng)設(shè)備界面與圖形化用戶界面在特征上有許多相似之處，都是具有可視性、 交互性、透明性、直接操作性，但是自身又有獨(dú)特性。,1、顯示設(shè)備：常見手機(jī)屏幕分辨率96*65、96*96、128*96、128*128、160*160、 160*128、17

19、6*144、220*176、240*176、320*240等。這么混亂的分辨率，無(wú)法 設(shè)計(jì)通用性界面。 2、輸入設(shè)備：低端產(chǎn)品使用按鍵作為輸入、高端采用按鍵與觸控筆結(jié)合，有的配備 小規(guī)模的電腦鍵盤。因此移動(dòng)設(shè)備我們就必須考慮產(chǎn)品的輸入特點(diǎn)(諾基亞E61）,移動(dòng)設(shè)備界面設(shè)計(jì)：,移動(dòng)設(shè)備界面獨(dú)特特征：,移動(dòng)設(shè)備界面與圖形化用戶界面在特征上有許多相似之處，都是具有可視性、 交互性、透明性、直接操作性，但是自身又有獨(dú)特性。,3、交互方式： 一般方式有圖像、聲音、震動(dòng)輸入形式主要是按鍵和觸控筆操作，如今發(fā)展迅速 諸如靠改變手持角度實(shí)現(xiàn)屏幕的變化，移動(dòng)屏幕內(nèi)容和放大縮小功能。 4、消費(fèi)形態(tài) A、用途不同

20、B、用戶細(xì)分和個(gè)性化（潮流型、商務(wù)型、娛樂(lè)型等） C、地域差異明顯,移動(dòng)設(shè)備界面設(shè)計(jì)：,移動(dòng)設(shè)備界面與一般圖形化用戶界面設(shè)計(jì)的異同：,1、為特殊的屏幕而設(shè)計(jì)：,移動(dòng)設(shè)備的屏幕小，分辨率低，也讓屏幕空間是寶貴的摩羯們?cè)氐捏w量就不能過(guò)大 ，一方面，需要在有限的空間了表現(xiàn)界面元素，另一方面界面元素要承擔(dān)起語(yǔ)義的表 達(dá)、易于操控、視覺(jué)美好的功能，界面設(shè)計(jì)要盡量讓用戶得打最大的可用屏幕空間， 進(jìn)入獨(dú)立操作窗口。,移動(dòng)設(shè)備界面設(shè)計(jì)：,移動(dòng)設(shè)備界面與一般圖形化用戶界面設(shè)計(jì)的異同：,2、為特殊操作方式設(shè)計(jì)：,移動(dòng)設(shè)備采用按鍵或者觸控筆配合來(lái)進(jìn)行操作，界面設(shè)計(jì)應(yīng)充分考慮這些操作方式 的特點(diǎn)，找到最合適的方案。

21、比如要選取一定的選項(xiàng)，如果是使用一個(gè)兩向的方向 鍵，那么選項(xiàng)設(shè)計(jì)成滾動(dòng)菜單比較有效，如果使用一個(gè)四向的方向鍵，那么選項(xiàng)設(shè) 計(jì)成宮格式的圖標(biāo)有效率，如果使用一個(gè)兩向的方向鍵去選擇宮格式圖標(biāo)，用戶就 會(huì)產(chǎn)生困惑。,移動(dòng)設(shè)備界面設(shè)計(jì)：,移動(dòng)設(shè)備界面與一般圖形化用戶界面設(shè)計(jì)的異同：,3、為特殊導(dǎo)航方式設(shè)計(jì)：,在屏幕較小的情況下，移動(dòng)設(shè)備界面的功能結(jié)構(gòu)往往采取單一樹形結(jié)構(gòu)的組織方式 無(wú)法再各功能項(xiàng)中自由跳轉(zhuǎn)，往往要回到上級(jí)菜單重新選擇。為了盡可能改善這種 情況，在導(dǎo)航上，應(yīng)提供方便的返回功能；在同一級(jí)菜單中，盡量在一屏中顯示全 部選項(xiàng)；各級(jí)菜單都有直觀明確的標(biāo)題；在組織功能上，應(yīng)合理將功能分級(jí)、歸納 符

22、合用戶思維習(xí)慣，并能對(duì)用戶起到正確的引導(dǎo)作用。,移動(dòng)設(shè)備界面設(shè)計(jì)：,移動(dòng)設(shè)備界面與一般圖形化用戶界面設(shè)計(jì)的異同：,4、為目標(biāo)用戶進(jìn)行個(gè)性化設(shè)計(jì)：,5、與產(chǎn)品外觀相適應(yīng),我們的移動(dòng)設(shè)備界面有其特定的產(chǎn)品作為載體，圖形界面與產(chǎn)品外觀相互呼應(yīng)。同一 風(fēng)格的界面設(shè)計(jì)與產(chǎn)品外觀相得益彰，構(gòu)成一個(gè)完美的整體。比如，一款金屬感高科 技感的手機(jī)，界面設(shè)計(jì)成一種非常女性化的設(shè)計(jì)，那么給人感覺(jué)就是不倫不類。,移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)界面設(shè)計(jì)幾個(gè)要點(diǎn)：,1、定制界面版式,2、視覺(jué)效果,3、視覺(jué)元素的設(shè)計(jì),移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)界面設(shè)計(jì)幾個(gè)要點(diǎn)：,1、定制界面版式,A、iIdle（手機(jī)待機(jī)界面）、mainmenu（

23、主菜單）、submenu（二級(jí)菜單）、third level Menu（三級(jí)菜單）,移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)界面設(shè)計(jì)幾個(gè)要點(diǎn)：,1、定制界面版式,B、界面構(gòu)成的基本單位,狀態(tài)區(qū),標(biāo)題區(qū),操作功能區(qū),公共導(dǎo)航區(qū),移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)界面設(shè)計(jì)幾個(gè)要點(diǎn)：,1、定制界面版式,B、界面構(gòu)成的基本單位,狀態(tài)區(qū),標(biāo)題區(qū),操作功能區(qū),公共導(dǎo)航區(qū),表示手機(jī)目前運(yùn)行狀態(tài)及事件的區(qū)域，可以包含信號(hào)、電池強(qiáng)度、運(yùn)營(yíng)商名稱。狀態(tài)區(qū)不 是必須存在，可依據(jù)交互需求進(jìn)行取舍。,主要是LOGE、版本以及相關(guān)的圖文信息,是軟件的核心部分，也是界面面積最大部分，包含列表、焦點(diǎn)、滾動(dòng)條、圖標(biāo)等不同元素 不同層級(jí)的界面包含的元素不

24、同，需要根據(jù)具體情況搭配使用。,也稱之為軟鍵盤區(qū)域，它是對(duì)軟件操作進(jìn)行宏觀控制區(qū)域，所見即所得，它可以保存當(dāng)前 結(jié)果、切換當(dāng)前操作模塊、退出系統(tǒng)、實(shí)現(xiàn)對(duì)軟件的靈活操控,移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)界面設(shè)計(jì)幾個(gè)要點(diǎn)：,2、視覺(jué)效果,手機(jī)的視覺(jué)效果應(yīng)該遵循給用戶舒適、生機(jī)與活力的原則，通過(guò)視覺(jué)感官刺激 增加用戶的親和力，適應(yīng)不同用戶的不同心理特征。,移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)界面設(shè)計(jì)幾個(gè)要點(diǎn)：,2、視覺(jué)效果,A、簡(jiǎn)約明快型(適合色彩支持較少顏色的彩屏手機(jī)）,基于大塊顏色和線條的組合方式，不乏大氣，簡(jiǎn)約且精到、精彩。點(diǎn)線面基本元素 的形狀構(gòu)成結(jié)合色彩的純凈搭配，干凈利落，給用戶帶來(lái)輕松的感受。,移動(dòng)設(shè)備界面設(shè)計(jì)：,手機(jī)界面設(shè)計(jì)幾個(gè)要點(diǎn)：,2、視覺(jué)效果,A、簡(jiǎn)約明快型(適合色彩支持較少顏色的彩屏手機(jī)）,在設(shè)計(jì)的過(guò)程中基于上述風(fēng)格設(shè)計(jì)的思路，在視覺(jué)效果的設(shè)計(jì)上需要參考如下方法：,1、結(jié)合界面圖形設(shè)計(jì)的隱喻性，圖標(biāo)圖形盡量是間接的平面圖形，盡量使用像素化的表現(xiàn)形式,2、展現(xiàn)圖形界面的精到之處，