網站用戶界面設計與表現分析

孫丹

摘 要 基于用戶界面設計思想，闡述網站開發制作中的要點，在界面設計中導航與圖標的設計要點，達到提升網站用戶體驗度的目的。

關鍵詞 網站；用戶界面；用戶體驗

中圖分類號：G712 文獻標識碼：B

文章編號：1671-489X（2016）21-0033-02

在網站的設計與開發中，一個良好的界面設計能夠給用戶帶來良好的用戶體驗。對用戶體驗度的關注度在逐漸提升，從最初提出用戶體驗的時代，到將用戶體驗以技術方法進行呈現，經歷多年的歷程。UI（User Interface，用戶界面）設計的應用是將用戶體驗思想實踐落實，是將用戶體驗思想通過網站的導航、界面、圖標、色彩等表現層的設計，逐一應用理論并結合技術層面進行實現，是用戶體驗思想的一種顯性表達。

1 什么是界面？

界面是一個窗口，界面設計是開發中最重要的方面。對于應用軟件來說，用戶界面對用戶的應用十分重要，用戶通過界面可以使用該軟件，并且希望界面比較簡單、便于使用。圖形用戶界面是當前用戶界面的主流，當前各類圖形用戶界面具有的一個相同點就是應用的窗口使用鍵盤和鼠標作為輸入設備。目前界面設計領域已經開展到移動端，移動端的界面設計原則有別于PC端。但是無論是基于哪種設置，良好的界面設計是同樣重要的。

2 軟件界面設計的前期準備工作

在制作一個項目設計前，應該先確立好設計的主題。比如：一個圖書管理系統軟件的主題就是“圖書管理”，遠程教育系統的主題就是“遠程教育”。于是軟件界面的設計就要圍繞主題來進行，讓用戶一看軟件的界面，就知道這個軟件是做什么的。不能讓軟件的界面與軟件的主題相差太多，如果一個電腦硬件管理系統的界面上都是和電腦無關的東西，如花草、山水，就不能反映該軟件的主題與功能，那么，這個軟件的界面就是失敗的。

美工作為界面美化的主要人員，不但要擁有藝術設計、包裝設計的才能，還應該穿插整個項目，給界面程序設計人員提出系統參考意見。

3 確定界面設計原則

確定界面類型時，需要考慮多方面的因素，如用戶的自身特性、系統的成本/效益、環境、系統任務等。這時，在著手進行軟件界面設計前，必須在心里有一個輪廓，對要設計的軟件的功能有所了解，同時對該軟件的界面設計有成形的構想，還要遵守界面設計的原則。

1）一致性原則。一致性主要體現在軟件的顯示方式和概念模式的一致性，并且在類似的情況下具有一樣的操作序列，如在幫助、提示及菜單中產生相同的術語，具體是指在不同的應用系統中具有相似的布局、相似的外觀界面、相似的信息顯示及相似的交互方式等。界面設計保持高度一致性，這樣用戶使用不同的軟件時可以掌握軟件的共性，將局部的經驗和知識推廣到其他場合。界面設計的一致性要求對于用戶的軟件應用十分重要。

2）控件的使用、提示信息窗口風格、顏色、信息措辭做到一致，遵循統一的標準。這樣做具有以下優勢：

①通過一致的界面風格，可以讓用戶建立起一樣的心理模式，對于一個界面使用熟練之后，切換到下一界面，用戶也容易使用，容易理解語句，推測出界面的各種功能；

②給用戶統一的感覺，不覺得混亂，而是心情愉快，支持度增加。

用戶界面簡稱為UI，通過對UI進行設計，其設計內容包括軟件的操作邏輯、人機交互、界面美觀的整體設計。好的UI設計讓軟件變得有個性、有品位，并且操作簡單、舒適、自由，充分體現軟件的特點及定位。人機交互，即人與設備之間的交流，UI設計在設備之間成功地充當了翻譯的角色。

4 網站中UI的重要地位

網站的設計與開發不僅要適用于PC機的模式使用，更要適用于移動設備使用，使兩者的操作都具有良好的用戶體驗。這就給很多網站的UI設計提出很高的要求，同時也凸顯出UI在當前網站中的重要性。網站最大的門檻就是取得用戶信任，而UI設計直接影響用戶的體驗和網站的形象，用戶考察一個網站是否有實力，是否是正當網站，UI是首要因素。一個網站UI做得好，可以讓網站的形象在用戶心中得到提升，而且能讓用戶得到瀏覽的體驗，甚至能決定一個網站的轉化率。

5 UI設計在網站設計中的體現

UI設計的成功之處就是為網站帶來比較高的瀏覽量與轉化率。對于很多網站平臺的建立，UI的設計不僅體現在其從界面所表現的色彩、樣式上，還體現在導航系統設計、圖標設計、不同類型網站的風格定位等方面。

導航的設計與使用 構成網站導航的是網頁中的焦點元素，它們讓用戶清晰直觀地找到自己想要的東西，引導用戶去尋找網站上最重要的信息，以達到銷售或者查詢等目的。導航設計并沒有一個統一的設計方法，每個網站由于其目標、需求、設計手法、運營等諸多因素影響，導致它們在導航設計上千差萬別，但是導航設計還是有基本的規律和原則的，確保組織架構的可靠性。

1）確定信息架構。信息架構是合理的組織信息的展現形式，支撐起網站內容的骨架。信息架構的主要任務是為信息與用戶認知之間構建一座暢通的橋梁。更重要的是，要從用戶的角度來看待網站內容，從一個用戶的角度去看待一個網站的信息需求。對針對頁面信息的完整性、連續性、可靠性等問題進行解決，明確網站所要達成的目標，針對網站的用戶群去解決登錄、訂閱等邏輯問題。

2）保持簡單的風格。絕大多數的網站瀏覽者可能會一致認同這一點：網站的導航區域要盡可能設計得簡單。的確，復雜而擁擠的導航會阻礙網站的整體可用性。

圖標的設計與使用 對于用戶接收的信息而言，相對于文字信息的表現，圖像的信息表達能力要遠遠大于文字，在有限的時間和空間里，把界面中精彩的文字描述轉化為一個簡練而意義明確的圖標，就成為滿足用戶需求的有效途徑。更深一步，圖標的應用讓整個界面與人之間的交互更便捷，使情感化設計和人性化設計得以回歸。在各種終端交互界面中，圖標不僅起到代替文字描述以節約空間的作用，不僅是一種裝飾圖形與符號，更重要的是它發揮著交互性、情感化、指代性、隱喻性等作用。人機界面交互中，一個小小的icon（圖標）是減小用戶閱讀負擔，實現界面友好性、界面情感化等交互目的的重要途徑。

1）圖標遵循的設計原則。圖標在設計與運用上要形象，語言要單一，表現要概括，提取圖像中不可或缺的元素去表達；在構圖上要飽滿，圖像空間占有率要在75%以上，從視覺上要一樣大；形象造型上體積要豐滿，來增加構圖的識別性，太復雜會降低圖標的識別度；在用色方面，前景色與背景色要有足夠的反差，用明暗的反差、冷暖的反差去對比表現。當用兩個形象語言表達一個圖標時，要有主次，不能同等對待。

2）圖標設計的四要素。

①達意性。圖標要清楚地表達設備要處理的功能，圖標的核心價值是傳達功能含義。

②概括性。在圖標的表現中，可有可無的東西不能太多，不是原始圖像的直接使用，要過濾掉可有可無的元素，對凸顯其特征的內容進行展示，從現實生活中提取物品最典型的特點進行創作。

③可用性。所有的設計都要具有可用性，圖標設計與制作的本質是要最終運用到程序和網站中?？捎眯缘膽冒丝勺R別性和可開發性，圖標在任何設備環境下都能夠被用戶所識別，所設計的圖標能真正地運用于實際的網站中。

④情感性。圖標的設計與使用要貼近用戶的生活、經驗、情感，使用戶具有親切感，增加用戶對網站的信任，提升用戶體驗。

圖標的風格要統一 在一個網站上運用的圖標，其風格定位要統一，要從形狀與取向的統一、透視的統一、光線的統一、材質的統一、色彩的統一等方面對圖標進行定位，以保證網站風格的統一性。

6 展望與發展

UI設計是一個新興的設計領域，是高于平面設計之上的、基于用戶體驗的設計思念理論而形成的一門專門的學科，并且隨著人們對用戶體驗的關注程度越來越高，對UI設計的要求也會逐步增高。UI設計的應用領域也會隨著移動端技術的不斷成熟與發展，越來越廣泛地擴展到人們的生活中。參考文獻

[1]于松翠.基于用戶體驗的網站界面設計研究[D].西安：西安工程大學，2013.

[2]黃曉斌，邱明輝.網站用戶界面設計模式語言的比較研究[J].現代圖書情報技術，2011（10）：12-17.

[3]楊佩佩，華薇娜.電子商務網站用戶界面的比較與分析[J].科技情報開發與經濟，2008，18（30）：155-157.