手機客戶端UI設計之手機平台之爭

1. 當前手機平台的爭鋒

為了佔領移動互聯網的製高點,當前的幾大IT巨頭都以手機平台為基礎展開爭奪。佔領移動平台就是佔領了用戶的移動桌面,也就為自身的移動服務爭取到了最佳位置。

微軟公司推出windows phone 7, 曝光了windows 8;蘋果公司也開了iOS 5的發布會;谷歌的Andr​​oid 3.0的發布,Android 2.4 的若隱若現等等;大家都在努力提昇平台體驗。另外,惠普的Web OS、黑莓公司也都在研製和發布新平台,也引起了業內人士的極大關注。

從當前市場佔有率和未來的發展趨勢看,客戶端適配上,主要還是考慮iOS ,Windows,Android三個系統為主,其他的系統在國內還難佔據主流,這裡不解釋。 Android手機的增長最快;iOS手機在國內的佔有量也增長很快,利好消息也不斷,電信、移動都在談;Windows主要看與Nokia的未來合作,前景不小。

因此,在本文中,簡單的介紹一下這三個主流平台的交互特性,以幫助剛從事客戶端交互設計的同行們更快地了解它們的基本特性,為能開發出更好體驗的客戶端提供便利。

2. 各個平台的特點及優勢

1)平台的硬件特性

a)   平台的按鍵

手機按鍵是系統自帶的,平台也會把按鍵的功能帶入到系統的客戶端應用中,他也天然地與用戶操作相融合。

手機按鍵一般分為兩類,功能鍵和導航鍵。功能鍵被指派為特定的功能,用戶按了後,觸發對應的功能,一般與屏幕內容關係不大,如拍照鍵,只是啟動拍照,在其他的客戶端中基本無效。

另一類是導航鍵,被賦予了特定的邏輯規則,她的操作與屏幕有一個邏輯映射的關係,但操作與操作對象分離,用戶按鍵後,在屏幕中得到對應的反饋。如【Back】映射為返回前一頁,點擊【Back】後,屏幕的內容返回到上一頁。

功能鍵能直接啟動功能,它本身對交互的影響不是很大。而導航鍵則是交互設計的重要組成部分。主要應該注意以下幾點:

(1)  客戶端的交互導航設計應該支持平台的導航按鍵的操作。不管你是否已經在屏幕中有虛擬按鈕代替了按鍵已有的功能,也應該支持系統按鍵​​的導航邏輯。

(2)  客戶端用到了平台的功能鍵對應的功能,應該支持功能鍵的操作。如,在客戶端中需要調節音量,則應該支持系統音量的按鍵來控制。

(3)  所有客戶端對按鍵的操作都必須保持一致,不要隨意互用。

b)   平台的屏幕適配

由於不同平台的開放程度很不一樣,不同的平台產品對於屏幕的大小的設計很不一樣,有些只有很少的尺寸分佈;有些有很多不同的尺寸,這給適配帶來了很多問題和麻煩。屏幕適配設計參見我之前的博文。

c)   平台支持的其他硬件:傳感器,屏幕特性等

iPhone 推出來後,迅速風靡全球,創造了一個革新的時代(也有人說iPhone本身不是革命,但是他創造了一次革命),除了設計本身外,幾個傳感器的合理使用也立下了汗馬功勞。主要包括,重力加速度傳感器、陀螺儀、接近傳感器、電子羅盤等。這些傳感器在不同的情景下,創造了很多獨特的體驗,極大的增強了手機的可玩性。

不同的平台或是手機會支持不同的傳感器,在界面設計時,也需要考慮它們在不同平台上支持的普及程度,以及不支持的時,能提供的相關代替設計方案。

2)平台的界面特性

a)   應用​​入口形式

應用程序的啟動入口是指用戶啟動程序的交互界面及操作形式。不同的平台上,對於啟動入口操作和界面也有較大的區別,這是展示平台特性的第一印象。同時,不同平台及手機公司為了使品牌形象更加突出也會在這裡多做文章。

從交互特性上看,應用程序的啟動入口主要有以下幾個特徵和注意點:

b)   頁面基本結構

頁面的基本結構佈局,決定了手機界面的主要風格,在不同的平台上為了表現出設計的差異和風格,在界面佈局上都有所不同。但是,總的來說還是沒有與iOS有何本質的不同,主要在形式上略微的不同。

iOS:

Android:

Windows Phone7:

Android 的手機廠商都更改了原生系統的界面,不同Android手機在界面的展示上多有不同。在Android客戶端的設計上,本身有不少都是從iOS上直接移植了界面,導致了它的更多不同。但是不管怎麼樣,界面上操作和導航邏輯要符合平臺本身的特徵。

在框架的設計上,我是傾向於把最核心的操作放在底部,方便用戶的單手操作。 iOS的設計把導航按鈕方在左上角,遠離大拇指的操作區域,就是容易造成用戶脫手“甩機”,也影響操作效率。

c)   主要導航特性:

導航作為一個平台的主要交互特性之一,不同平台之間也存在較大的差異。 iOS在設計上邏輯嚴密,所有的應用自成一體、渾然天成;相比之下,Android像是由iOS和android設計師雜交的產物,在不同的應用上導航系統混亂,不太成體系;Windows Phone 7 的導航在界面展示上,標題採用全景圖的形式,真是另闢蹊徑,自成體系。

在這裡主要講一下不同平台下的導航按鍵、title和Tab、返回邏輯、退出程序幾個小點。

d)   菜單及操作形式

這幾個代表當前最高水平的移動平台,都是以手指觸摸為基礎的直接操作界面。 iOS只提供了直接操作的方式;Android和Win Phone 7 還增加了幾個硬鍵按鈕配合操作,但總體也是以直接操作為主。幾個平台都有菜單操作,但是展示的形式不同,但也在相互的借鑒。

由於手機屏幕較小,一屏內容往往顯示一個對像或信息單元,toolbar的操作正是對這個單元進行操作的。如果是對單元內的對像操作,更多的設計都是在界面中直接設置操作對象(如屏幕內的操作按鈕)。

e)   信息提示

信息提示方式,各個平台之間也都在相互學習。信息list作為Android系統的最核心的設計優勢,現在iOS5也開始應用。同時許多Android手機及鎖屏應用在鎖屏界面與提示信息間做更多地權衡,使用戶能更快地處理信息,提升效率。

各個平台都提供了對話框的形式,只是在叫法上略有不同,如alert,popup,dialog,raw notification等,其主要的交互操作沒有區別,都是對話框的基本操作形式。也有一些變異的反饋提示框,如android系統提供的快速消失的反饋提示,做成輕量級的,對用戶干擾也減到更少。

Android系統提供的狀態欄的消息提示機制,是處理多應用push信息的一個十分創新的設計,可以說是android系統的最佳設計。用戶可以在任何界面中,快速的向下撥動狀態欄呼出信息list,也可以再向上撥動手指收起提示信息。但是,在最近看到的iOS5上也看到了它的更新特性中,這一點就赫然在列。所以,有好的特性,不同的平台也會相互學習。

iOS上也有它的創新提示,就是在程序圖標上來進行新消息數量的提示,這在後面的幾個平台上都有應用,只是不同的平台上,表現形式略微不同,就是視覺上微創新。

Windows Phone 7 提供了tile形式的提示信息顯示方式,那隻是樣式上的不同,在設計的本質上,差異不大。

具體可以參見鍾磊的博文,《手機系統消息通知設計的整理和分析

3. 移動應用在多平台適配的原則

一個產品的規劃,很少會僅局限於某一個平台,都會進行跨平台的適配。那應該如何進行適配呢?

這裡主要有兩個觀點,以設備為中心來設計還是以應用為中心來設計;以設備為中心的設計師認為,應用界面應該與設備的設計規範保持一致,讓用戶快速上手,不覺得陌生。以應用為中心的設計師認為,保持所有的平台上的一致性,同時,很多多平台的應用開發工具也是為開發人員提供了多平台界面移植的便利,但是對用戶體驗是否好,卻有待思考。

在多平台適配中遵循如下原則

1)  客戶端的設計規範應該以平台規範為基礎

2)  在多平台中,應保持統一的品牌標識,包括logo,視覺風格,核心功能點等等。

3)  更多地與平台的特性相融合,運用平台提供的特色功能,來減少用戶的輸入或者其他體驗提升點。如拍照輸入,傳感器的使用等。

每個平台都需要注意的問題有:

1)  移動的特性決定了手機信號的強弱不均,如何處理在弱信號下的設計?

2)  需要考慮在斷網情況下,如何快速恢復中斷?

3)  如何設計手機推送的問題?

4)  如何盡量避免手機的固有限制,如屏幕小,輸入不方便,電源緊張等?

5)  如何盡量通過手機的特有特性來提升體驗,如各類傳感器,聲音提示等?

4. 後記

當我從3月份擬好提綱寫這幾篇文章到現在,不過短短幾個月時間,各大公司的移動平台就都推出了新的版本,對平台特性總結的速度有些趕不上平台更新的速度。

從本質上說,iOS是一個開創性的設計,也引發了客戶端的高潮,其他的平台還沒有脫離iOS的痕跡,雖然各大公司都在努力創新,形成自己的風格,但是還遠沒有到開創、革命的程度。

除了這三大平台外,Blackberry,Palm WebOS也都在發布新品,體驗也不遜色與三大平台,在客戶端的設計上,非常值得大家更多地研究一二,說不定哪天主流平台就把他們的有點給抄了,你也是在為你的新設計做知識儲備。

從客戶端的交互設計上來說,我們要做的是如何發揮平台的特性上的設計優點,把客戶端的體驗去做好,而不是去改變平台的設計特性。所以,做客戶端設計的設計師,需要時刻關注平台特性的更新,這都是你提升客戶端體驗的契機。

來源:http:// ued.taobao.com/blog/2011/07/06/mobile-ui-guideline-analysis-of-different-mobile-platforms/

特別注意:本站所有轉載文章言論不代表本站觀點,本站所提供的攝影照片,插畫,設計作品,如需使用,請與原作者聯繫,文章轉自alibuybuy

Comments are closed.