【正文】 化較強(qiáng)的網(wǎng) 頁界面中，按鈕的設(shè)計(jì)往往能成為吸引眼球的亮點(diǎn)。一個界面上往往會存在幾十個按鈕。 （ 1）按鈕。用按鍵來激活或關(guān)閉某個功能；旋鈕調(diào)整在一定范圍內(nèi)的變化；撥動開關(guān)來在兩種狀態(tài)中切換。在計(jì)算機(jī)出現(xiàn)前得很多年里，人類就開始使用 一些具有固定功能的設(shè)備來完成特定的任務(wù)，這些就是界面控件的原型，如開關(guān)、把手、旋鈕等。這樣的預(yù)設(shè)用途對于大多數(shù)用戶而言，是不言而喻的，如果設(shè)計(jì)人員設(shè)計(jì)了一個藍(lán)色文字而不是鏈接熱區(qū)，就會讓很多用戶產(chǎn)生誤解，以至于認(rèn)為界面很糟糕。界面中最常見的預(yù)設(shè)用途是網(wǎng)頁中的鏈接。 在界 面設(shè)計(jì)中，這一概念非常重要。交互設(shè)計(jì)的主要目的是讓用戶順利地使用界面，因此，界面設(shè)計(jì)的易用性因素是交互設(shè)計(jì)的重點(diǎn)。一些專業(yè)的問卷調(diào)查也可以幫助設(shè)計(jì)人員輕松地完成調(diào)查?！澳阍谑褂眠^程中犯了多少次錯誤？”這樣的問題可以改成“你能談一下這個產(chǎn)品不能完成某個任務(wù)的情況嗎？” （ 2）問卷調(diào)查 隨著互聯(lián)網(wǎng)的滲透，使用互聯(lián)網(wǎng)進(jìn)行問卷調(diào)查已經(jīng)變得非常方便和快捷。 4） 不明確的問題，讓用戶無法回答。 不恰當(dāng)?shù)奶釂柨赡苡幸幌聨追N： 1） 帶有引導(dǎo)性的問題，例如：“這個產(chǎn)品有多不方便 ?” 2） 不夠中立的例子。主要缺點(diǎn)是效率低，因?yàn)槊嬲劽總€用戶會花費(fèi)較多的時(shí)間。 訪談是一種傳統(tǒng)的用戶研究方法，由于其實(shí)施方便、成本低廉而被大量采用。觀察視頻可以分為兩種：一種是讓用戶都在實(shí)驗(yàn)室進(jìn)行，對于環(huán)境影響較小的界面系統(tǒng)研究是可以采用這種方式，如網(wǎng)頁使用 研究。當(dāng)然，這些都是第一手資料，僅用筆來記錄是完全不夠的，應(yīng)當(dāng)同時(shí)進(jìn)行拍照、錄音或攝像，以便于進(jìn)行整理和總結(jié)。由字面意思可想到，跟隨影子法師指用戶使用界面系統(tǒng)時(shí)設(shè)計(jì)人員跟隨著用戶的操作進(jìn)行觀察，就好像是用戶的影子。 通過觀察，設(shè)計(jì)人員可以獲得一下信息：用戶的使用環(huán)境；環(huán)境對界面的影響；用戶完成一個任務(wù)的過程、用戶是否同時(shí)還在使用其他的產(chǎn)品或界面；什么任務(wù)占去了用戶大量的時(shí)間；用戶使 用產(chǎn)品交互系統(tǒng)的方式；用戶在使用什么術(shù)語等。觀察法需要設(shè)計(jì)人員進(jìn)入到用戶使用同類界面的情境中去，直接接觸用戶及系統(tǒng)，能夠方便地獲取大量的第一手資料。對于成功 的競爭產(chǎn)品，需要對其設(shè)計(jì)、商品表現(xiàn)進(jìn)行分析，獲得有益的設(shè)計(jì)經(jīng)驗(yàn)；對于失敗的競爭產(chǎn)品，則要從失敗的原因入手，避免同樣的錯誤發(fā)生在自己身上。 2） 重復(fù)資料。該方法的優(yōu)勢在于能在很短的時(shí)間內(nèi)獲取大量與設(shè)計(jì)相關(guān)，也是非常有價(jià)值的。 這一方法的核心是輸入現(xiàn)有的背景資料，輸出對于用戶研究有用的信息。 用戶研究的方法有很多，常用的包括間接收集資料、展開問卷調(diào)查、實(shí)境調(diào)查、觀察、訪談級焦點(diǎn)小組等。例如，要設(shè)計(jì)一個用于手機(jī)無線環(huán)境下的銀行支付軟件界面，可以使用兩個參數(shù)來定義目標(biāo)用戶：使用手機(jī)無線平臺的經(jīng)驗(yàn)；使用銀行支付系統(tǒng)的經(jīng)驗(yàn)。 在目標(biāo)用戶研究的第一步，就是定義界面設(shè)計(jì)面向的用戶群體，即如何定義目標(biāo)用戶并找到合適的用戶研究對象。 在用戶研究中，人體工程學(xué)、心理工程學(xué)、社會學(xué)、和組織行為學(xué)都會提供有益的指導(dǎo)。 ? 操作圖標(biāo) 操作 圖標(biāo) 說明 南華大學(xué)計(jì)算機(jī)學(xué)院科學(xué)與技術(shù)學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 17 頁 共 31 頁 新建 綠色主色 編輯 具有筆狀圖形 查詢 放大鏡 刪除 紅色主色 下載 向下箭頭 ? 提示圖標(biāo) 提示 圖標(biāo) 說明 下級目錄 省略號 幫助 問號 警告 感嘆號 返回上一級 向左方向箭頭 返回首頁 房子 南華大學(xué)計(jì)算機(jī)學(xué)院科學(xué)與技術(shù)學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 18 頁 共 31 頁 第 四章 軟件界面設(shè)計(jì)流程 目標(biāo)用戶研究 在界面產(chǎn)品越來越面對個人用戶的今天，以用戶為中心的設(shè)計(jì)方法成為設(shè)計(jì)人員的第一選擇。 即使現(xiàn)在 許多系統(tǒng)都支持真彩色，對圖標(biāo)尺寸的限制也可以放寬，圖標(biāo)的設(shè)計(jì)自由度和變化越來越大，但這也并不意味著可以隨意設(shè)計(jì)。因?yàn)橐粋€個的像素點(diǎn)在一起就組成了屏幕，水平或垂直的直線以及斜線具有較好的顯示效果。語言則不是這樣的，世界各地甚至于同一國家里人們使用的語言都是不太一樣的，因此在母語國家看起來容易被理解的文字，對其他國家及地區(qū)的人來說那就是天書。圖標(biāo)中的文字可能會讓人感到不知該怎么辦，導(dǎo)致阻礙 跨文化上的交流。所以在設(shè)計(jì)圖標(biāo)時(shí)要充分考慮到各種用戶在理解上的差異，確保不會發(fā)生理解上困難和偏差。在中國文化背景下，魚可以理解為年年有余，是富裕的期望，在其他文化中，就會覺得中國人的這種聯(lián)系很奇怪。 在一種文化語義下理解的事物到了另一種 文化語義下就可能不被理解，或者會被理解為其他意義。 圖標(biāo)的兼容指的是圖標(biāo)在不同的文化語義下都能被識別為同樣的內(nèi)容和意義。 南華大學(xué)計(jì)算機(jī)學(xué)院科學(xué)與技術(shù)學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 16 頁 共 31 頁 （ 2） 應(yīng)用程序和操作系統(tǒng)的圖標(biāo)要盡可能一致。但是不管怎樣，大圖標(biāo)與小圖標(biāo)相比要相似，彩色的圖標(biāo)與黑白圖標(biāo)也要感覺不出差別，這樣子用戶在不同的顯示環(huán)境下才能正常地使用軟件。從前面的介紹來看，同一圖標(biāo)需要根據(jù)具體的應(yīng)用環(huán)境，來設(shè)計(jì)出不同尺寸和色深度的圖標(biāo)家族成員。 就圖標(biāo)設(shè)計(jì)來言，一致性主要表現(xiàn)在 3個方面。 因此在選擇隱喻對象的時(shí)候一定要慎重。即使用戶以前知道意思，長時(shí)間后，也不可能留下很多印象。有的軟件開發(fā)者想試圖改變范例，但這要承擔(dān)令部分用戶沒有辦法理解的風(fēng)險(xiǎn)。好的圖標(biāo)有兩個優(yōu)點(diǎn)，一是功能一目了然，二是用戶在明白圖標(biāo)的意思，可以引領(lǐng)所有相似的工具都使用和它一樣的繪圖語言。 以下是應(yīng)該引起注意的一些地方： ，很好的視覺識別功能是他必須具備的。 南華大學(xué)計(jì)算機(jī)學(xué)院科學(xué)與技術(shù)學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 15 頁 共 31 頁 圖標(biāo)設(shè)計(jì) 圖標(biāo)設(shè)計(jì)是界面設(shè)計(jì)中非常重要的部分 ，但很多書籍把太多的注意力投入到設(shè)計(jì)的過程和手段方面，對它的科學(xué)性關(guān)注不夠。結(jié)合界面類型和風(fēng)格而設(shè)計(jì)的指令音，不但可以體現(xiàn)界面使用的整體性和一致性，還因?yàn)榉答伖δ艹蔀榻缑嬉子眯詫?shí)現(xiàn)的一個參考指標(biāo)。正如電影配樂一樣，選用什么樣的界面背景音樂也是非常重要的，好的界面背景音樂能給人帶來美的享受，減輕操作上帶來的疲勞和乏味，還可以烘托主題，讓人產(chǎn)生豐富的聯(lián)想，從而產(chǎn)生積極的互動行為和消極欲望。 界面中的聲音設(shè)計(jì)主要分為指令音的趣味性設(shè)計(jì)和結(jié)合主題的背景音樂的愉悅感和想象性設(shè)計(jì)。聲音信息和視覺信息的配合也是常見的信息傳遞模式。 聲音信息的解讀比視覺信息的解讀更加容易，這主要依靠用戶的直覺感受與生活經(jīng)驗(yàn)。 聲音的設(shè)計(jì)與運(yùn)用 聲音一直是界面中非常重要的信息表達(dá)方式。它可以通過變形、加入情景等方式新奇、有趣地過渡到下一頁面。 第二種情況指的是 在交互設(shè)計(jì)過程中存在的動態(tài)效果，也就是切換頁面和功能南華大學(xué)計(jì)算機(jī)學(xué)院科學(xué)與技術(shù)學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 14 頁 共 31 頁 信息模塊是產(chǎn)生的動態(tài)效果。所以，動態(tài)人員應(yīng)保證動態(tài)的節(jié)奏以適應(yīng)內(nèi)容和信息傳達(dá)的需要，比如可以讓熱點(diǎn)重要信息快節(jié)奏地閃爍來快速抓住用戶的視線。 畫面也可以分兩種情況呈現(xiàn)在畫面中：第一種不改變動態(tài)元素本身的位置，在頁面中利用適當(dāng)?shù)拿娣e和節(jié)奏來做動態(tài)效果，這樣信息識別不會被擾亂。 動態(tài)元素設(shè)計(jì) 動態(tài)元素設(shè)計(jì)指的是界面中動與靜的對比關(guān)系。 界面設(shè)計(jì)中，文字除了注意顯示問題，還應(yīng)關(guān)注文字的表述方式需符合目標(biāo)用戶的語言認(rèn)知習(xí)慣，這是實(shí)現(xiàn)界面易用性的一個方面。 設(shè)計(jì)人員應(yīng)當(dāng)為用戶設(shè)置一些舒適又易讀的文 字方案，同時(shí)也可以用戶自定義文字的字體、大小和顏色，讓應(yīng)用程序自適應(yīng)用戶的設(shè)定以保證文字的正常顯示。從最初的純文字界面發(fā)展至今，文字仍是其他任何元素?zé)o法取代的重要構(gòu)件。 圖 銀色、深灰和藍(lán)色搭配 南華大學(xué)計(jì)算機(jī)學(xué)院科學(xué)與技術(shù)學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 13 頁 共 31 頁 第三章 界面元素的設(shè)計(jì) 本文總結(jié)了常見界面元素的設(shè)計(jì)：字體編排與設(shè)計(jì)，動態(tài)元素設(shè)計(jì)，聲音的設(shè)計(jì)與運(yùn)用，圖標(biāo)設(shè)計(jì)。 圖 紫色與黑色搭配 南華大學(xué)計(jì)算機(jī)學(xué)院科學(xué)與技術(shù)學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 11 頁 共 31 頁 橘黃色和黑色的搭配，很具有跳躍性，很活潑，如圖 . 圖 橘黃色和黑色搭配 淺藍(lán)和深藍(lán)的搭配，清新自然，如圖 。 紫色與黑色整體顏色的搭配，看起來非常的典雅。 色彩分析實(shí)例（音樂播放軟件千千靜聽） 從外觀上上看，千千靜聽有多重配色方案。 ，如高飽和度的黃與藍(lán)、紅與綠等。 南華大學(xué)計(jì)算機(jī)學(xué)院科學(xué)與技術(shù)學(xué)院畢業(yè)設(shè)計(jì)（論文） 第 10 頁 共 31 頁 針對界面設(shè)計(jì)，需要注意的是以下幾點(diǎn)： ，盡量控制在 3中顏色以內(nèi)。 。 。 為達(dá)到色彩對界面的易用和舒適的心里影響這一目的，在對色彩進(jìn)行組合的過程中，有以下幾種方法可以采用借鑒： 。 色彩組合 色彩組合原理基本上是從色彩的鮮明性、色彩的獨(dú)特性、色彩的合適性、色彩的聯(lián)想性 4個方面來考慮的。 給人以華麗感的色彩鮮艷、明度高；具有樸素感的色彩晦澀、