Android平板電腦的設計

作者：鄭萌,華清遠見嵌入式培訓中心講師。

沒有什麼時候比現在更需要設計師去為各種各樣的行動裝置營造體驗了。隨著平板電腦被不斷接受，我們已經步入“後PC時代”，公司會利用平板電腦的經驗品質來爭奪使用者的注意力。設計成功的Android平板電腦應用程式，不但需要一個很棒的概念來鼓勵使用者下載、使用和保留，還需要一種使Android使用者很直觀的發現並適應使用環境的使用者體驗。

接下來通過瞭解ipad iOS使用者介面與Android 3.x “Honeycomb” 使用者介面 設計規範和元素之間的不同，可以協助設計師熟悉Android平板電腦應用程式設計。我們還將分析Honeycomb的設計模式和布局策略，然後查看一些那裡面非常好的Android平板電腦應用程式。

注意，雖然智能手機上Android 2.x應用程式也可以在平板電腦上運行，Android 3.0 Honeycomb 系統是專門為平板電腦設計和推出的。Future updates 承諾將Honeycomb的特性植入智能手機裝置中，並使它更容易在多種多樣的螢幕尺寸上設計和構建。

對於我們大多數人，我們第一次接觸平板電腦是通過ipad. 正因為這個原因，開始比較二者的使用者介面是合理的。通過比較，我們可以組織整理我們已經瞭解的平板電腦的知識，並去關注二者的關鍵不同點，這樣我們就可以滿足Android使用者獨特的使用者介面要求。在將已存在於iPad上的應用程式轉換到Android平板電腦上的時候，這不但可以使我們速度更快，而且變得非常重要。

只要做得像iPad就行，對嗎？

雖然Android 平板電腦和iPad的體驗方面有很多的相似之處（觸控手勢、應用程式啟動表徵圖、情態表達等），設計師在作出假設和繪製螢幕流之前應該熟知二者的差異。

螢幕尺寸和方向

這兩個平台之間最大的不同就是外形尺寸。iPad的布局尺寸是768×1024物理像素，並且iPad將縱向顯示方向作為它預設的查看方向。
而Android平板電腦，由於擁有眾多的裝置生產廠家，稍微有一些複雜。 概括地講，有7英寸和10英寸的Android平板電腦螢幕尺寸（自左上方至右下角的對角線長度），以及介於二者之間的尺寸。然而，大多數平板電腦是10英寸左右。

換算成像素，這意味著什嗎？一個不錯的布局基準是1280×752像素（不包括系統欄），基於10英寸的螢幕尺寸大小並且將橫向（而不是縱向）作為預設的方向。如同在iPad上一樣，Android上的內容可以在橫向和縱向兩個方向上查閱，但橫向模式往往更受人喜歡。

然而，對於Android來說，螢幕尺寸只是差異中的一半因素。Android平板電腦在“螢幕密度”（螢幕特定地區的像素數量）方面也有所不同。不要關注太多細節，設計師只能為三種不同的螢幕密度準備所有的生產型備用位元影像，放大每個位元影像到原大小的1.5倍或2倍。所以，被設定為100×100像素大小的位元影像應該也要有150 × 150 和 200 × 200大小的副本。通過製作三種縮放尺寸的位元影像，你可以將你的位元影像轉換成為中、高、超高密度的平板電腦螢幕而不會損害圖片的品質。

系統欄

雖然iOS平台將系統欄做的盡量小，但是Android Honeycomb 擴大了系統欄的尺寸並包含通知和軟導覽按鈕。其中包括返回按鈕、首頁按鈕和最新應用程式按鈕。

Android Honeycomb系統欄

Android Honeycomb的系統欄和按鈕在螢幕底部始終存在，無論開啟的是什麼應用程式。你可以把它當作永久性的UI固定裝置。唯一的例外是“關燈”模式，它是將系統欄變暗來顯示沈浸式內容，例如視頻和遊戲。

返回按鈕

雖然Honeycomb笨重、永久存在的系統欄對設計師來說可能是一個阻礙，但它確實解放了在iPad應用程式中通常被返回鍵佔據的固定位置。Honeycomb系統欄中的返回鍵在世界上所有的應用程式中都存在。

操作欄

兩個平台之間大多數使用者介面的不同點在於其頂部的操作欄。Android 為操作欄元素的具體布置和具體的視覺形式提供了建議，包括icon或logo的位置、導航（例如下拉式功能表或標籤）及常用操作。這是Android Honeycomb系統應用程式最統一的設計模式之一，因而在嘗試使用自訂設定或類似iPad的東西之前，讓你自己熟悉此操作欄是值得的。之後將對這個普遍存在的操作欄做更多的分析。

控制項

能使iPad使用者感到新穎的將是Android的控制項。顧名思義，控制項主要是小的通知欄和快捷使用工具，使用者可以將其設定出現在啟動螢幕中。控制項可以被設計為堆棧視圖、網格視圖和列表視圖，在Android 3.1中它們現在可以調整大小。

通知

iOS 的通知系統將簡單的提醒推送到啟動螢幕中，而Honeycomb是在螢幕的右下角位置彈出（我們通常稱它們為toast）豐富的通知,非常像Mac OS X中的Growl.通知的自訂布局可以是表徵圖、滾動文本或可操作按鈕中的任何形式。

設定

iPad應用程式中的設定通常是以快顯視窗呈現，在點擊“i”按鈕後觸發；而且設定項被分解成易於視覺識別的諸多表格。Honeycomb系統有不同的規範。它看起來更像iOS的“常規設定”屏，使用者可以在左側進行類型導航，在右側查看詳情。這是Honeycomb系統上呈現多設定項的首選（也是更雅緻的）一種方式。

UI元素
如同大家所想的那樣，Android系統竭盡全力把一切做的與它的競爭者相反（這叫做差異化！）。Honeycomb有其自己的UI規範，並且它現在有一種新的“全息UI”視覺語言，用於諸如選擇時間日期、選擇一個選項，設定音量等日常操作中。瞭解這種UI語言對建立螢幕流和設計布局至關重要。

字型

iPad4.3可以使用多少種字型？答案是57種。

Android多少種？只有3種。

是的，它們是 Droid Sans, Droid Serif and Droid Sans Mono.然而有積極的一方面。雖然平台只有這三種字型，但開發人員可以自由地將其他字型綁定他們的應用程式。

什麼相同?

對iPad已經熟悉的設計師是幸運的，這兩個平台有一些相似之處。

觸控手勢。

點擊、雙擊、滑動、拖動、收縮、旋轉和任意滾動。

UI 分割檢視和多窗格使用者介面。

分割檢視是平板電腦中最常見的布局之一。它由兩個並排的窗格組成。當然，你可以為更加複雜的布局增加窗格。

嵌入式多媒體

兩個平台都允許嵌入音頻、視頻和地圖。

剪貼簿

支援應用程式內外的資訊複製和粘貼。

拖放

兩個平台都有拖放功能。

設計模式

Honeycomb沿用了很多在Android 2.0中引入的設計模式，並擴充了它們。如果你對設計模式不熟悉，正如Android中定義的，它們是一種“應對反覆出現的問題的一般性解決方案”。設計模式是Android維護者設計的關鍵的使用者介面規範，意圖是助於使用者體驗的一致性、給予設計師和開發人員一個工作模板。它們是可以定製的，所以沒有必要擔憂。

如前所述，操作欄是Android 使用者介面中最為突出的組成部分，也是這裡的重點所在。

表徵圖或標誌

表徵圖或標誌在操作欄的最左邊。它是可操作的；點擊後使用者被帶到應用程式的首頁螢幕。

導航

下面，我們找了幾種典型的導航形式，下拉式功能表形式或標籤菜單形式。Honeycomb使用一個三角圖形指示下拉式功能表，並為標籤提供了一系列的底線；底線通常佔據大多數操作欄的自身空間。

左箭頭也可能出現在表徵圖或標誌抑或標籤的左側，用作返回導航或者取消主要操作。

常用操作

常用操作，顧名思義，就是給使用者類似搜尋、分享和溢出菜單的東西。它們總是被放置在操作欄的右側，遠離任何標籤。

溢出菜單

溢出菜單是常見操作組的一部分，有時候會被一根垂直的線分隔開。這個位置放置多種功能表項目，比如設定、協助和反饋。

搜尋

搜尋也是常見操作組的一部分。搜尋的獨特性在於它的展開和收縮動作。點擊搜尋表徵圖後搜尋方塊展開讓你輸入查詢關鍵詞。點擊“×”取消搜尋，此時搜尋方塊收縮，又變成單個按鈕的狀態。這是在有很多操作鍵或表徵圖需要展示的情況下節約顯示空間的一種方法。

語境操作

當某個項目被選中的時候，語境操作會改變操作欄的格式，展示出的選項不同於其他項目。例如，照片應用程式正在展示縮圖，一旦一張圖片被選中，操作欄就可能發生變化，為編輯這張圖片提供語境操作。

使用者可以點擊“取消”或操作欄中的“完成”來退出語境操作欄。

平板電腦布局策略

使用片段和多窗格視圖:

Honeycomb設計的構建模組是“片段”.片段是自成體系的布局組成部分，它可以根據螢幕的方向和尺寸改變自身的尺寸和布局位置。為多種尺寸外觀而設計這個問題的進一步解決方案是：給設計師和開發人員一種途徑使他們的螢幕布局組成部分具有彈性和堆疊性，並取決於運行應用程式的裝置螢幕限制。螢幕組成部分可以被展開、堆疊、擴充或者收縮、展示或者隱藏。

片段架構給了設計者和開發人員幾種選擇，在跨越多種螢幕尺寸和方向的情形下維護他們的布局。

是什麼讓片段變得如此特別？通過相容性庫，開發人員可以將這種功能帶入到1.6版以上的Android智能手機中，使他們能夠使用一種尺寸適配多種裝置的策略來建立應用程式。簡言之，它能夠使設計師和開發人員只開發一個應用程式而適配所有規格的裝置。

雖然片段可能是一個更多的被開發人員使用的術語，但設計師仍然應該對壓縮的內容如何任意展開、堆疊、擴充和隱藏有一個基本的瞭解。

最常見的片段排布方式是分割視圖。這種布局在新聞應用程式和電子郵件用戶端中較為常見，通常列表在較窄的一欄中呈現，詳情視圖在較寬的一欄中呈現。

呈現分割視圖的另一種方式是在它的一側轉換方向。這種情況下，側邊的列表片段變成了輪播，支援水平方向上的導航而不再是垂直方向上的。

方向策略

片段是將一種設計應用到多個螢幕尺寸上的好辦法，同時對設定方向策略亦是非常有用的。你的螢幕設計在橫向視圖時也許看起來很不錯，但面對狹窄的縱向視圖包含三欄的情況的時候你要做些什麼呢？你可以再次選擇展開、堆疊或者隱藏內容。可以把片段想象成一堆可伸展的拼圖，你可以根據需要四處移動、塑造或者刪除它。

關於動畫

Honeycomb架構允許設計師和開發人員運用豐富多彩的動畫效果。根據Android 3.0 要點，“動畫可以建立淡出效果、不同狀態間的運動、迴圈播放一張動態圖片、或者退齣動畫、改變顏色以及更多。”Honeycomb還擁有展現2D或3D映像的高效能機制。

嵌入式及3G相關資源及學習請點擊：嵌入式開發視頻 android開發視頻 android培訓 3G培訓 QT培訓 QT開發視頻 物聯網培訓 物聯網技術視頻 嵌入式學習