張欣悅

摘要：移動4G時代的到來讓人們越來越離不開手機，離不開手機應用。該文首先介紹了4G時代UI設計的重要性和UI設計的特點；分析了移動設備的特點。并在此基礎上將App開發(fā)中的UI設計技巧進行了簡單的總結和分析。

關鍵詞：UI；App；界面設計

中圖分類號：TP311 文獻標識碼：A 文章編號：1009-3044（2016）02-0082-02

在3G商用近五年之后，工信部正式發(fā)放4G牌照，國內的三大電信運營商中國移動、中國電信、中國聯(lián)通，拿到了啟動4G商用的資格。4G網絡正式在中國推出。中國的4G時代隨之到來，移動4G的到來成為了眾多企業(yè)發(fā)展的新風標。以前人們在電腦上的很多工作都轉移到了手機上來，手機上購物、繳費、手機導航、炒股、看新聞等等，人們對手機的依賴程度日益增大。政府機構、事業(yè)單位、各大銀行紛紛開發(fā)了相應業(yè)務的手機端應用，而各大企業(yè)尤其是互聯(lián)網企業(yè)更是重視移動端各種App應用的開發(fā)。

1 UI設計的重要性

UI即User Interface（用戶界面）的簡稱。UI設計則是指對軟件的人機交互、操作邏輯、界面美觀的整體設計。如果App的開發(fā)僅限于編碼開發(fā)實現必要功能，圖形化的界面和簡單易用的交互式方式沒有得到體現，那么這類App將沒有任何市場競爭力。所以，界面設計不僅僅是簡單的美術繪畫，他在藝術設計的基礎上需要考量使用者的喜好、使用的環(huán)境、使用的人群特點等眾多因素，最終使用者的用戶體驗是評價UI設計好壞的關鍵因素。因此，界面設計與使用人群分析要緊密結合。

隨著App應用的不斷普及，具有類似功能的App應用數量繁多，企業(yè)怎樣才能讓自身的App應用在讓人應接不暇的App中脫穎而出？友好的界面設計是提升用戶體驗的有效方法之一。一款成熟的App應用不僅僅要具有實用的功能、安全的保障，還要具有令人愉悅、方便使用的用戶界面。好的UI設計具有以下特點：

1）具有友好的操作界面，能讓使用者操作便捷，易上手。用戶體驗因人而異，然而好的用戶界面一定是簡單、易用的，能引導用戶順利完成相應的操作。

2）讓App應用有自己的個性和特色，進而提高品牌的識別度。如蘋果手機中的基本應用一樣，具有自己鮮明的風格。

3）能延長App的使用壽命，讓應用深入人心，提升在App市場上的競爭力。

2 移動設備的特點

與電腦相比，移動設備的屏幕要小很多，因此顯示的內容要盡量保持內容簡潔。簡單直觀的交互能幫助用戶快速地完成任務。由于移動設備的便攜性，用戶很有可能是在移動的環(huán)境下進行設備的操作，而無線網絡通常不太不穩(wěn)定，所以用戶在一次屏幕更新后，應該盡量獲得較多的信息，因此，顯示的控件數量或有效信息也不能過少。

不同品牌不同型號的移動設備有不同的屏幕尺寸和分辨率，在設計前需要針對不同的移動設備進行相應的測試。分辨率和像素是我們需要測試的兩個必要指標。屏幕分辨率通常是對經典VGA分辨率的修改，經典VGA分辨率是640*480?，F在，移動手機端最大的尺寸是800*480（WVGA）。小一點的尺寸是豎屏，大一點的尺寸是橫屏。目前很多移動手機端可以改變方向。大多數移動手機端的屏幕尺寸以240*320或者QVGA為主。也有許多公司涉及1920*1080的比例或者超高的清晰度。對于屏幕的像素，常見的幾個標準像素密度有：Idpi（像素密度：100dpi-140dpi）、mdpi（像素密度：140dpi-190dpi）、hdpi（像素密度：大于等于190dpi）和xhdpi（像素密度：320dpi）。

3 App開發(fā)中的UI設計

一個完整的App設計由編碼設計與UI設計構成。長期以來，開發(fā)者都重視功能的開發(fā)而忽略了UI的設計，導致很多實用性很強的App用戶下載安裝后不會用，或者覺得操作復雜不好用。由此，界面設計慢慢被互聯(lián)網企業(yè)所重視，認為界面設計也是產品的重要賣點。

界面的設計大致需要經過目標人群確定、用戶需求調查、交互式流程設計、界面風格定位功能icon的設計、整體視覺效果的優(yōu)化和應用icon的設計幾個階段。其中目標人群確定、用戶需求調查和交互式流程設計需要軟件開發(fā)人員和設計人員共同完成。同時，App產品的UI設計需要對相應的功能需求有清晰的把握。由此，將界面設計的技巧總結如下：

1）頁面布局

在開發(fā)前期進行App的原型設計，針對Android和ios制定不同的輸出規(guī)范，而在頁面布局時則可盡量兼顧Android系統(tǒng)和ios系統(tǒng)，在后期經過微調后輸出適用安卓和ios不同的尺寸要求即可。同時，針對目標人群要盡量使用用戶熟悉的界面風格，方便用戶按照以往的使用習慣來操作軟件，這樣更容易讓用戶接受。如果設計得過于另類，則可能會很難符合大眾口味，而不被大眾接受。

2）顏色和字體

合理的色彩搭配和色彩選取將直接影響整個項目的成功與否，客戶的滿意度等等，所以在進行美工前，要確定好App的用色標準。一般，重要的顏色不要多于3種，而在這其中又要分為：用于特別強調或者需要重點突出的文字、按鈕等小面積使用的色彩；用于普通級信息、文字等信息的通用色彩；和用于標題、列表等比較重要信息的顏色。其中用于背景色和需要弱化顯示的信息要用較弱的顏色。

針對字體也要分為重要字體、較重要字體和一般字體；根據文字信息的重要性來確定文字的字體和字號。其中重要的文字一般為大標題、導航欄；較重要的文字為二級頁面小標題、欄目標題等；一般字體為普通正文文字和說明性文字。在字體字號選擇時，還可以結合其相應的背景色來選擇，運用色彩的搭配太突出顯示或者弱化顯示相應的文字。

3）圖標、按鈕設計

功能icon是在App中用來表達某一操作或者功能示意的圖形，如“主頁”、“設置”等功能能圖標。功能圖標的設計應當盡可能的形象、簡潔，力求能準確的表達其代表的功能。而針對應用icon的設計要在界面設計的最后再進行，便于讓icon與整體界面的風格相匹配。同時，還需要輸出不同尺寸的應用到界面上。icon設計需要創(chuàng)建的是一套不同尺寸的PNG文件（大小：29*29px～1024*1024px），且需要與應用捆綁。

設計中要善于利用圖標語義引導用戶行為，設計者可以用象形圖形來制作圖標，如日歷、短信、通訊簿等；也可以用字符來制作圖標，如IE瀏覽器、支付寶的圖標；此外還可以用一些抽象的符號來隱喻要代表的應用，當目標人群反復使用和查看這些圖標，會普遍認可這些符號的含義。

4）風格的統(tǒng)一

在界面設計前，要對界面進行風格定位，讓界面的整體風格符合視覺流程，符合目標人群的偏好。

第一，統(tǒng)一界面各個元素間的間距。正文的行間距、按鈕與按鈕之間的距離、欄目標題與正文之間的距離、導航與欄目之間的距離，都需要進行統(tǒng)一，這樣能使界面整潔清晰，條理清楚。

第二，善于使用用圓角效果。在App應用中，通常會有按鈕、彈出的信息提示框等必要元素，而這些必要元素通常會設計成各種大小不一的矩形。我們可以為矩形設計圓角效果，統(tǒng)一矩形的圓角像素來軟化用戶界面，并形成統(tǒng)一風格。

第三，適當使用光照效果。在成套的圖標設計中，在彈出框的使用時，可以為這些元素添加一定的光照效果，讓他們更加立體化。但在使用光照效果時，要注意保持光照角度的一致性，這樣才能保證元素的陰影在屏幕上的朝向是一致的。

4 小結

隨著App應用的普及，軟件開發(fā)師越來越重視用戶體驗的效果。因此，在開發(fā)中必須要與前端開發(fā)、產品經理達成共識，以用戶對界面的需求變化為出發(fā)點， 使用戶界面的外在形式和App實際應用的內部功能都能符合不用用戶的需求。

參考文獻：

[1] 梅哲.圖形圖像界面中的圖標設計[D].武漢： 武漢理工大學，2009.

[2]馬克波斯特. 信息方式[M]. 周憲，譯.北京：商務印書館，2000.