智能手機G U I設計原則研究

潘 璠，明 蘭

（南華大學 設計與藝術學院，湖南 衡陽421001）

智能手機是指“具有獨立的操作系統，可以由用戶自行安裝軟件、游戲等第三方服務商提供的程序，通過此類程序來不斷對手機的功能進行擴充，并可以通過移動通訊網絡來實現無線網絡接入的這樣一類手機的總稱”[1]。GUI（Graphical User Interface）即人機交互圖形化用戶界面設計，準確來說就是屏幕產品的視覺體驗和互動操作部分，屬于人機界面中的軟界面形式。智能手機GUI設計即為滿足用戶需求對手機應用界面而進行的視覺設計和交互設計，它包含了最為重要的三個因素：界面、圖標和交互特效。

一、界面設計

隨著計算機和網絡技術的飛速發展，智能手機除了突出產品外觀的硬界面設計外，更注重強調“高效、自然、友好”的軟界面設計。在智能手機界面設計的概念創意階段，通常只需考慮幾個非常關鍵的界面或者能夠展示設計風格的界面即可，如待機、應用程序（主菜單）、音樂播放器、相冊、撥號等。

（一）風格一致的界面

一致性是智能手機GUI設計中最為重要的原則之一，使用相同風格的界面設計能夠減少視覺的過渡跳轉，減少界面切換帶給用戶的焦慮，使得用戶對界面的理解更容易以及整個GUI體驗更加流暢。在完成界面一致性的設計過程中可以引入一些VI的思想來規范，既包括界面視覺元素的一致性和規范性，也指使用相同信息表現方式，如在字體、顏色、術語等方面。如圖1中短信、聯系人、撥號通話以及音樂界面所顯示出的一致性和強烈的延續性，對于保持用戶焦點、改進交互效果有很大幫助。

圖1 ：界面的一致性

（二）個性化的定制界面創意公社

隨著科技的不斷發展，基于智能手機系統的相關軟件應運而生，不管是官方應用還是第三方應用的軟件系統已成為用戶直接操作和應用的主體。但是問題也隨之而來，由于Android、Symbian、iOS等幾大操作系統占據主流，導致千篇一律、毫無個性和創意的手機界面充斥市場。隨著市場競爭的激烈，越來越多的手機運營商開始自己定制更個性化的界面，關注用戶需求的個性化定制時代正在到來。如果說整體性和一致性是基于手機GUI視覺效果的和諧統一而考慮，那么個性化界面設計主要是以用戶需求為中心進行設計，既包括了界面的藝術性在視覺上帶給用戶獨特愉悅的感受，更注重基于用戶使用習慣的交互設計。

1.獨特的界面構架

界面構架即界面信息構架，它決定了軟界面的整體結構，界面“視覺設計的布局結構就是通過這種信息架構對所有內容進行視覺化處理”。[2]界面信息的制定完全建立在用戶研究的基礎上，根據前期的研究結果和數據（主要是用戶的需求以及產品開發要求）確定手機的功能，然后將功能分類，設計成一組組的邏輯模塊，并且細分這些模塊，從而組織成邏輯分明的界面結構。

目前，智能手機的關鍵界面一般涵蓋了待機解鎖界面、應用程序（主菜單）界面、二級菜單界面、三級菜單界面等層級。其中，iphone開創了應用程序界面經典的宮格設計，即將所有一級應用程序圖標縱橫排列在首頁的導航方式。就在16宮格界面泛濫之時，國外手機品牌不斷致力于創新設計。2011年諾基亞推出的Lumia 710手機，采用了微軟開發的Windows Phone 7.0系統。對比其他系統的圖標海洋，活動格窗取代了圖標，它不僅是一個快速啟動的按鈕，同時也是一個信息更新的展示板，將內容更新用最直接的方式實時告知用戶，而無需用戶進行任何操作，從而在視覺上給用戶不斷帶來新的印象。針對愛玩社交網絡的用戶，摩托羅拉Droid X采用了自己定制化的MOTOBlur社交應用集成界面，獨特的MOTOBlur界面為消費者提供了非常便捷的社交應用集成功能，讓消費者僅需動一動手指即可輕松享受與親朋好友社交互動、分享信息的樂趣，還可以根據自己的喜好對這些社交插件進行排列，創造出一個完全屬于自己、充滿個性的待機界面。

2.Widget的個性化設計

Widget中文譯為“微件”，是展示在智能手機主屏的一種快速瀏覽的應用程序插件，為用戶提供一鍵式的服務，通常被設計為查看天氣、時間、新聞、股票、音樂播放等信息的特定功能。用戶可以通過一系列的小插件把喜歡的應用放于桌面，并根據自己的需求來排列、顯示，享受更加個性化的移動互聯網服務。

widget界面設計的重點在于如何在冰冷的功能中賦予其情感，使用戶的觸摸感更具情緒化。早期的widget界面設計如時間和天氣等以枯燥和冰冷的文字傳達信息，事實上圖形化Widget界面更能增加用戶的認知感，虛擬場景和主題設計是豐富用戶體驗和滿足個性需求的設計趨勢，如以動態特效生動反映天氣的真實感強烈的3D界面，具有四季變化的日歷界面或精致漂亮的時鐘界面。

總之，基于用戶需求對手機界面的定制化開發能夠將用戶對系統界面的肯定和喜愛有效的轉移到產品上來，是手機廠商為突出自己產品賣點，實現智能手機個性化所帶來的產品差異化的戰略手段，也是未來塑造品牌的最好方式。

二、圖標設計

智能手機中圖標的概念是指手機屏幕上表示指令、程序的符號、圖像。圖標是界面設計中的重要元素之一，也是智能手機GUI設計中最生動的視覺形態，經過良好設計的、形象逼真的圖標所代表的動作或命令是人們迅速、直觀理解信息的有力工具。

（一）統一性和整體性

一套風格統一的圖標是進行圖標設計的基本原則，整體性的設計會比零散的設計更有品質，更容易讓用戶理解和信賴。圖標的整體性設計首先表現在設計風格的統一，是輕松詼諧的繪畫風格還是簡潔明快的平面效果抑或是酷炫時尚的3D效果，以及各種特效的設計；其次還表現在顏色的選擇上，顏色不宜過多，過多的顏色出現在一個小的區域中會產生一種雜亂的感覺。

從藝術表現形式上看，智能手機界面圖標追求酷炫時尚的情感表達，多為3D炫彩圖標，普遍采用浮雕、倒影和漸變的處理效果，以造成豐富真實的視覺效果。這也是當今手機界面圖標設計的主流。但是在這種主流風格的基礎上，更要秉持差異化的設計理念對圖標進行精心設計，從而各具特色。如索尼愛立信LT18i的圖標更具強烈的透視感和空間感，色彩則以白色為主色調，輔以少面積的藍色和綠色，整體視覺清爽舒適。

（二）主題性和文化性

界面既是信息交互的媒介又是用戶體驗的媒介。在豐富用戶體驗、實現界面風格個性化乃至品牌識別方面，圖標無疑是最重要的元素之一。iphone導角方形的經典圖標與機身外形一樣，使產品與操作界面外觀和諧，同時也成為蘋果iphone界面的最大特點。

隨著定制手機界面的出現，圖標的個性特征成為手機GUI設計所追求的重要設計原則。一個信封就代表短信息、一個樂符就代表音樂的圖標時代早已一去不返，無論是自帶程序還是第三方程序，智能手機圖標的設計越來越具有主題性和文化性。圖2為“80后記憶”的主題圖標設計，童年記憶中的代表性物品在準確傳達信息的同時，以濃烈的懷舊風格引起都市忙碌的人們對童年美好時光的追憶。具備娛樂性和欣賞性的有主題文化的圖標，因映射出用戶所屬群體共有的價值觀、習俗、生活方式等文化內涵，更容易引起用戶的興趣。主題性圖標也是未來智能手機圖標設計的發展趨勢，手機用戶通過在線下載更換不同的主題圖標來獲得更豐富和更細分的視覺體驗。

圖2 ：80后記憶主題圖標設計

（三）可用性和識別性

首先，手機的圖標設計因受限于產品大小的不同，在設計過程中最好用矢量軟件制作圖標來配合彈性的尺寸要求，通常情況下圖標保持在64px×64px～96px×96px之間，以解決不同LCD分辨率尺寸的兼容問題，保證圖標的可用性和識別性。

其次，圖標的功用在于建立起虛擬世界與真實世界的一種隱喻或者映射關系，減輕認知負擔，讓用戶快速、準確理解圖標的含義以便操作。隱喻在圖形界面設計中是一種重要的表現手法，通過歸納和聯想建立圖標的視覺表象與其背后的意義兩者之間的連結。這種連結關系取決于人的知識體系和生活經驗，因此圖標設計師應該仔細考慮用戶的知識體系，并且充分運用日常生活的、共識度高的事物找到最短的概念連結。

最后，最好使用簡短文字做為圖標的冗余編碼。在信息傳播的過程中，增加信息的冗余度是保證信息傳輸的可靠性的最有效的方法。字體的形態、大小、顏色等也會影響界面的視覺感受和運行效果，對于手機界面文字而言，中文字體大小應不小于14px，英文字體大小不小于12px，字體的形態也不宜過于復雜，黑體和中等線體因其橫豎撇捺筆畫一致相等、空隙均勻，是手機界面中的常用字體。

三、交互特效

手機界面信息架構完成了邏輯分明的功能模塊，用戶如何使用這些功能就是界面交互設計的范疇，它包括用戶如何操作、功能之間如何跳轉、無效信息如何展示等等。其中，交互特效的引入很好地解決了動畫方式和操作流程的問題，能夠幫助用戶去自然地理解手機發生了什么。交互特效的方式多樣，如轉場、過渡、吸附、彈出等，在使用時要遵循以下原則。

（一）認知的可依賴性

認知的可依賴性是指符合用戶認知習慣的交互方式，包括人們日常生活情景的自然認知和對人機界面產品的積累認知，將相同的經驗延伸到手機界面中從而獲得自然好用的操作方式。在人們日常生活中就有應用的滑動、拖拽、旋轉、點擊等手勢操作自然隨意，無需視覺元素的提示，減少用戶記憶負擔。熟知電腦的用戶則對進度條和菊花轉等過渡特效不陌生，用手機上傳照片或發郵件的數據加載過程都會添加很好的過渡動效。

（二）操作的便捷性

首先，避免使用不必要的動畫，讓用戶的操作更少一點，讓界面更簡單一點。豐富的動效雖然可以讓人機交互更具活力，但任何的動效都需要基于需求的基礎之上，不能為了動而動。動效可以讓用戶減少焦慮，消除等待感，但處理不當也會引起用戶焦慮。例如發送短信過程中的進度條特效會使用戶產生離開當前界面，短信發送失敗的誤導，此時可以選擇后臺發送，告知用戶發送成功或失敗即可。其次，強調核心動作，突出產品重點功能，形成強烈印象。根據用戶的使用習慣，用戶操作過程可以分主要操作和次要操作，適當減少次要操作的視覺“分量”更能突出產品特點。

（三）提示的必要性

在用戶對某些界面操作感到不知所措時，應在界面上增加相應的提示告訴用戶該怎樣操作，就可以極大地提高操作的可用性。例如在欣賞相冊時通過“＋”、“－”符號提示照片放大或縮小的操作功能，或通過閃動箭頭、高亮的方式提示用戶滑動和點擊的操作功能。

[1][美]薩爾特曼.客戶如何思考［M］.李華飚，等譯.北京：機械工業出版社，2004.

[2]杜鵑.手機信息界面設計研究［D］.武漢理工大學，2007.