移動軟件開發中的UI設計

鄭 卉 鄧 晶

重慶電子工程職業學院，重慶 401331

對于用戶而言，應用程序中最重要的就是用戶界面，對相當一部分用戶而言，用戶界面就是應用程序。桌面系統的應用程序可以有相當復雜的用戶界面，但是移動設備上的用戶界面最好的應用程序中最重要的單一功能。針對目前移動設備的運行平臺主要是Android和IOS，本文討論的移動設備中主要是指Android平臺下的移動設備。

1 桌面系統軟件開發中UI設計的規則

界面色彩要求，用戶在較長時間使用后不感到視覺疲勞，要避免顏色種類過多。整個界面要主次分明，要將最重要的內容放在最易引起用戶注意的位置，例如最上部或者左邊欄。整個界面的排版要整齊，樣式要統一，設置導航以方便用戶的使用，排版應當留有一定的間隙。

需要展示的數據應當集中顯示，在視覺上使用戶容易察覺數據之間的關系。在有較多文本信息的情況下，對文本字體、色彩上增加格式的變化，使內容有層次變化，更容易辨識。頁面適當留白，以增強可讀性，例如在段落間添加空行的做法，可以減輕用戶的視覺疲勞。

頁面相應速度要快，實在無法響應，應當有提示彈出等變化告知用戶。鼠標移動的距離應當盡量的短，并且點擊時鼠標狀態應當有變化。

2 移動設備的特點

移動設備的屏幕要比桌面系統的屏幕小得多，所以對顯示控件的數量要進行嚴格的限制。同時移動設備的應用輕便也是其主要特性之一，移動設備上不會采取復雜的類似PC輸入端的操作，相比輸入大量的信息，用戶更加偏向用手指寫寫畫畫選擇信息，從而取代在移動設備上輸入長篇大論。

由于無線網絡的不穩定性，對移動設備本地緩存數據要優于通過無線方式獲得數據。同時，用戶在一次屏幕更新后，應該盡量獲得較多的信息，避免切換時等待時間較長。

由于移動設備的高攜帶性，用戶很有可能是在移動的環境下進行對設備的操作，開發相應應用程序時，就應當注意針對移動環境下，例如抖動和行走，進行相應設計。

移動設備的平面尺寸比較小，同時使用的環境一般情況是比較多樣，例如，夜晚，應當考慮用戶讀取信息的方便和容易，設計針對夜間光線模式以及放大字體都是比較好的選擇。

由于不同設備有不同的屏幕尺寸和分辨率，針對不同的設備尺寸和功能進行相應的測試是十分必要的。一般存在下列幾種屏幕：特大屏幕，指比大屏幕更大的屏幕；大屏幕，比標準智能手記的屏幕大，一般指平板電腦或者上網本大小的屏幕；中等屏幕，與智能手機典型的屏幕大小一樣，一般為3. 2英寸；小屏幕，比標準的智能手機屏幕小。

像素密度是另一個需要考慮的問題，常見的幾個標準像素密度有：Idpi指像素密度在100dpi-140dpi；mdpi的像素密度一般在140dpi-190dpi；hdpi的像素密度大于等于190dpi；xhdpi的像素密度為320dpi。

移動設備更廣泛的利用了觸控技術進行操作，支持通過設備的上下左右搖擺，以及手指對屏幕的觸控進行功能項的操作。

3 構建移動UI的策略

受移動設備屏幕尺寸的影響，不應當讓用戶看到太多的表單元素。受移動性的影響，用戶可能在各種各樣的情況下使用移動設備，可能是在早上繁忙的交通工具中，也可能是在戶外運動中，此時，表單元素應當足夠的大，并方便用戶的使用，當然對于屏幕比較小的設備，表單元素也應當適合屏幕。

由于不同設備有不同的屏幕尺寸和像素密度，針對不同的設備尺寸和功能進行相應的測試是十分必要的。值得注意的是，移動設備屏幕有著越來越大的傾向，例如目前市場上出現的5英寸智能機，甚至出現了7～8英寸的智能設備。根據Google在2010年8月進行的一次調查，大約97%的設備擁有mdpi或hdpi像素密度，在開發時，我們完全可以假定設備擁有較高的像素密度。具體操作中，需要注意以下幾點：盡量不使用絕對定位；避免在代碼中直接設置像素值；在多個物理設備中對各種配置的應用程序進行測試。

對于菜單的處理，移動設備的屏幕空間是非常珍貴的，比較大屏幕的桌面系統，菜單的要求更加靈活，要求既可以提供程序功能，同時又不占用額外屏幕空間的機制。多級菜單和上下文菜單都是不錯的處理方式。

允許滾動控件。合理使用虛擬鍵盤。提供狀態列表，方便用戶選擇使用。提供自動完成功能來輸入一些特定的值，例如國家、地名等。合理使用位置服務來獲取用戶當前的位置，減少對地址信息的輸入。

4 總結

移動軟件開發是目前發展十分迅速的一類軟件開發，同時移動設備具有高攜帶性，輕便性，以及屏幕較傳統PC小等特點。針對移動設備進行軟件開發時，應當根據設備的特點，進行軟件UI設計，本文正是針對移動UI設計的討論，整理提出了一些通用的設計策略。

[1]Wallance B. McClure，Nathan Blevins，John J. Croft IV，etc. C#開發Android應用實戰——使用Mono for Android 和. NET/C#，清華大學出版社，2013，1

[2]http://developer. android. com/design/get-started/uioverview. html 2014-3-13

[3]王東明. 精彩絕倫的Android UI設計:響應式用戶界面與設計模式，Juhani Lehtimaki，中國科技信息，2013，20

[4]朱振恒. B/S界面規范，季靜，科技信息，2009，2