Android 4.0用戶界面設計和元素-ICS簡介

openkk 12年前發布 | 34K 次閱讀 Android 4.0

        最新的 Android 冰淇淋三明治(Ice Cream Sandwich, ICS)操作系統,不僅僅是用戶界面(UI)的簡單改變,它幾乎是對整個 Android 系統界面的重新定義。為了讓你更好地為 ICS 系統設計和開發應用,這里有一個簡單的介紹和指南。

        內容和活動導航:選項卡和下拉選項 (Tabs and Dropdowns)

        對于內容型應用,如何為你的用戶提供簡單直觀的導航是非常重要的。ICS 操作系統有幾個通用方法來實現,第一個就是可滑動選項卡。

Android 4.0用戶界面設計和元素-ICS簡介

Android 4.0用戶界面設計和元素-ICS簡介

        上圖: ICS 選項卡

        Android 一直是支持選項卡的,但是在 ICS 上面,這種導航變得更加時尚和簡單使用。如上圖所示,我們用兩個例子:1)聯系人應用和2)油Tube 應用來看一下新的功能。

        新用法: 用戶可以通過水平滑動在不同的選項卡界面切換 - 一個 ICS 支持的通用導航手勢。

        新外表: 被選中的選項卡用寬下劃線表示。選項卡,要么是圖標,要么是標簽。(圖和文字不兼得,和 iOS 不同)

        第二個是下拉選項(dropdowns)

Android 4.0用戶界面設計和元素-ICS簡介

        上圖:Android 4.0 ICS 日歷應用

        下拉選項在切換相似內容或者相似邏輯時是最好的導航選擇,就譬如說在日歷應用中 - 下拉選項被廣泛應用在單日,星期,月和用戶日程表之間的切換。除此以外,組之間的切換也建議使用下拉,譬如說在聯系人應用中,不同組的聯系人用下拉來選擇。

        下拉選項:選項卡右下角的小三角表示。

        動作欄:不是只在最上面。

        動作欄一直作為提供用戶快捷操作的最好方式包含在 Android API 里面。

Android 4.0用戶界面設計和元素-ICS簡介

Android 4.0用戶界面設計和元素-ICS簡介 

上圖:動作欄在 Email 和地圖應用中,與屏幕下沿對齊。

        動作欄,開發者應該把最重要的用戶操作放在這一欄。用 Android Email 應用來講,這些操作包括”寫 Email”,“搜索”,和“刷新”。動作欄根據當前界面的不同,所包括的操作也不同。當用戶在郵件界面,這些操作變成:”刪除”,“文件夾”和“前后郵 件”:

Android 4.0用戶界面設計和元素-ICS簡介

        上圖:在不同界面,動作欄的圖標和動作相應改變

        動作欄圖標設計:簡單,實體單色或使用文字:

Android 4.0用戶界面設計和元素-ICS簡介

        上圖:地圖應用中動作欄的文字提示

        應用的抬頭:活動導航(activity navigation)和其他動作

        如果你的應用的臺頭欄不是選項卡,它應該使用應用的圖標,以便用戶切換不同的活動。臺頭作為應用的切入點,應該被充分利用。

Android 4.0用戶界面設計和元素-ICS簡介

        上圖:地圖應用的不同界面,注意動作欄的標識

        在地圖應用中,默認臺頭是應用本身的圖標和名字或者 logo。當你開始使用應用,在不同界面,就會有不同的信息。開發人員應該充分利用這一欄為用戶提供快捷、直觀的導航。

        臺頭也可以作為信息展示:在單一目的地界面,臺頭顯示了我所搜索的目的地和到達所需時間。在 email 界面,臺頭顯示了我所搜索的聯系人信息和可以提供的動作。

Android 4.0用戶界面設計和元素-ICS簡介

        油Tube 的臺頭:錄像和搜索

Android 4.0用戶界面設計和元素-ICS簡介

        上圖:應用臺頭使用動作選項

         境況適應 (context-adapting):搜索和列表設定

        在 ICS 上,有兩個默認的動作:搜索和列表設定,給了用戶界面更加豐富的互動。

        當用戶選擇了搜索:

Android 4.0用戶界面設計和元素-ICS簡介

Android 4.0用戶界面設計和元素-ICS簡介

        上圖:搜索在聯系人和日歷應用中

        后退箭頭出現,然后臺頭被搜索條取代,開發者可以選擇包括語音搜索或者不包括。

        另外一個境況適應的例子是有復選框的列表。舉例來說,在 Email 應用中,當用戶在復選了 email 時,臺頭變成了一共 3 封 email 被選中。

Android 4.0用戶界面設計和元素-ICS簡介

        然后,相對應的,底部動作欄更新成了:對于選中的 email 可以執行的不同操作:刪除,標識,壓縮和 star 他們。

Android 4.0用戶界面設計和元素-ICS簡介

        ICS 的設計和風格哲學

        在這款新推出的 Android 系統中,我們可以看出他們更新了設計理念。這個不僅僅是方便使用,還保證了風格和一致性。這些努力讓 Android 的界面更加漂亮的同時,也讓她更加容易辨識:干凈、簡單、時尚。

我們去除了很多不必要的界面元素,開始更多地使用空白和視覺元素來創造通透的結構。我們使用更多的色彩,來創造光、影。

——Matias Duarte, Android UI/UX 組長

        這些都可以在 ICS 的細節之處體現-摁鈕沒有修飾,自然融合在界面設計中。文字框用線條拉開。在界面修飾中凸顯內容和圖像。顏色柔和但是鮮明。

Android 4.0用戶界面設計和元素-ICS簡介

        上圖:在日程表中添加項目

        更多信息:

        Android 4.0 SDK 下載.

        Engadget:Galaxy Nexus 的截圖 .

        希望這篇報道能夠幫助你們設計和開發出簡單、美觀、實用的應用。

        英文原文:actionbar   編譯:伯樂在線 – 潘文佳

 本文由用戶 openkk 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!