參加了DevFest 2010,才發現到原來我先前Google I/O 2010的影片有漏看XD

真是悔不當初阿~

Android UI design patterns

在更早之前,2010/5/12 Google Android Develop網站同時針對Android的UI Design
給了一個參考的範例Twitter for Android
PS:同樣的概念也可以參考Google 為Google I/O 2010 所製作的小程式 ,Android Market可抓到
,關鍵字就是Google I/O 2010 ,作者也有將Source Code Release出來給大家參考
http://code.google.com/p/iosched/,可到Source分類用SVN Checkout出來,可以很清楚看出整
個系統架構。
圖片來源 : http://3.bp.blogspot.com/_GTM_W5mVPTU/S-rlV2NLU0I/AAAAAAAAAD0/fQUmdTS6cdA/s400/home01.png
這2支AP很明白的介紹了5個重要的Pattern
1.Dashboard
很清楚的表達這個AP到底有哪些重要功能! 就像上面兩張首頁,中間放了幾個大大的ICON
也因為手機可以橫向操作,空間也有限,因此建議是3~6個
2.Action Bar
具有導覽的功用,更重要是,把小小的Title Bar給置換掉,改把標題放在這另外,也可以放
一些不會因為該頁面而需要調整的功能,例如搜尋按鈕,回到首頁的按鈕,防止使用者在逛
AP的途中迷路XD ,會因為Active內容而要調整的按鈕,不建議放在這的原因是怕使用者搞
混上述的定義 ( 不要同時放會改變跟不改的按鈕 )
如果有這樣需求,建議改用下面Search Bar模式或Quick Actions
3.Quick Actions
跟Active相關的按鈕或功能,Ex: 聯絡人清單可以按鈕選撥號或寄信
按鈕只有一層功能,或者是只有很簡單的(很多的功能就可以考慮改用Context Menu)

4.Search Bar
再輸入框前可以放上搜尋類別,搭配Quick Actions去做選取,官方也建議在下方可以放
過去的搜尋條件,方便第一時間使用先前的紀錄。
5.Widget
為了讓使用者對你的軟體黏度更高,建議加Widget,方便使用者可以在桌面上新增,直接操作
,並注意,介面的呈現要更加的直覺使用。
補充:
在本堂課的尾聲,作者補充了針對效能跟好的設計習慣,UI該怎樣的搭配
1. 9-patch drawables 的概念
框+顏色=顏色框 (Drawable.SetColor……..))方便換顏色
2.resource qualifiers(有priority順序,會根據機器設定的條件去找相對應資料夾的資源用)
how android finds the best-matching resource
重要的觀念!!!!

don’t simply port
+
feel right at home
=> 不要只是單方面把軟體由其他的平台移植,要針對Android特性調整

don’t confuse the user
=> 如同APP按鈕配置的邏輯跟版面要合乎Pattern原則,否則容易混淆
don’t create rigid,absolute positioned layout
=> 這概念跟HTML的CSS排版原則很像,使用相對取代絕對定位,這也是擔心萬一在不同解
析度或者是橫向瀏覽時,版面異常問題
don’t use px units use dp or sp for text
=>跟版面一樣概念,不建議使用PX這種絕對的大小單位

don’t use small font sizes
+
do make large,obvious tab rargets(buttons,list items)
=>為了使用者方便閱讀,字體要適中,同時,按鈕跟list設計也一樣,要方便手指頭點選
don’t make me think
=>如同上面的Pattern一樣,操作的方式跟呈現要清楚,不要放一些特殊的設計
do create versions of all resources for high density screens
=>為了畫面清晰,要配合高解析度的螢幕,圖檔也要有相對應的高解析度資料,另外,也建
議把不同解析度分資料夾放,不建議用動態計算方式去做縮圖,怕失針也怕吃運算資源跟耗電
do follow android icon guidelines
+
do use proper margins and padding
=>Icon設計要合乎設計原則,Icon外圍要適度空白

Leave a Reply

Your email address will not be published. Required fields are marked *