由iPhone的UI設(shè)計看移動設(shè)備如何“突破”平臺
以前51CTO曾獨家譯文《移動設(shè)備UI設(shè)計的未來將是什么樣？》各種移動終端設(shè)備交互設(shè)計有一致也有不同，由于平臺本身的特性，不能照搬其他平臺的UI設(shè)計，讓用戶感覺是在真正的使用一個Android軟件或者iPhone軟件。
I think everything here is very relevant, and let’s keep them in mind.
“突破”平臺UI膜拜——由iPhone想到的
我想到了我們的設(shè)計創(chuàng)新，設(shè)計師的設(shè)計意識形態(tài)來源，遵循平臺的一些UI特性，但“突破”更在平臺之外。
以上兩圖顯示的是進行TAB排序的不同方法，雖然YouTube這種設(shè)計方式很優(yōu)秀，但YELP也不錯，這兩種不同的具體設(shè)計方式（我想可以稱之為設(shè)計等價式）同樣達到了功能需求，而YELP這種設(shè)計方式更在平臺UI之外，即使我們在web頁面，甚至在Android平臺看到這樣的方式也不足為奇，更談不上誰抄襲誰，誰照搬誰，只要是好的設(shè)計方式和設(shè)計特性，我們都可以去粗取精，合理應(yīng)用。
使用過大量的iPhone平臺客戶端，再回頭看看iPhone官方出的 iPhoneHuman Interface Guidelines關(guān)于iPhone設(shè)計組件的介紹，似乎這個百來頁的文檔更容易讓設(shè)計師縮手縮腳，以為這樣就是iPhone，遵循這樣的諸如picker，slidebar，web view 等設(shè)計方式才是真正的iPhone。
在具體的設(shè)計過程中，每當(dāng)提出一些設(shè)計方案，來自其他設(shè)計師或開發(fā)人員的質(zhì)疑竟然都是：有沒有這樣的設(shè)計，我想iPhone這樣做不太符合固有的一些規(guī)范…
我想完全錯了，它只是一個基本的不能再基本的規(guī)范，數(shù)以十萬級的iPhone客戶端各出奇招，將iPhone本來的基本設(shè)計規(guī)范演繹的精彩紛呈就是最好的證明（雖然這些客戶端中有些設(shè)計的不怎么樣，還有相當(dāng)多的客戶端將UI演繹到了極致）。
Central是一個非典型的單窗口應(yīng)用程序（alian cooper about face 一書中有關(guān)于單窗口，多窗口應(yīng)用程序的分析，雖然是針對web應(yīng)用，但對手機是同樣的道理），幾乎所有的操作都圍繞地圖進行，在展示地圖層級的方式上，central沒有使用Picker（實際上也不合適使用，具體可參看iPhoneHuman Interface Guidelines中的介紹）或者Table views，而是獨辟蹊徑彈出一列行為（圖標(biāo)）進行選擇，不同的行為（圖標(biāo)）產(chǎn)成不同的結(jié)果在地圖頁面展示，幾乎不需要任何的用戶短時記憶便可順利完成。
Central搜索功能，Location功能更是讓人眼前一亮，如果我們死扣所謂的“UI Guideline”，恐怕我們根本沒有辦法將如此豐富的功能恰當(dāng)?shù)陌才旁?20*480的舞臺上，這些功能松緊有度而又先后有序，誰能說這種優(yōu)良設(shè)計是iPhone平臺的專利？
直到現(xiàn)在從事iPhone或Android 設(shè)計，更多的人（甚至包括一些設(shè)計師）更愿意看到已經(jīng)存在的“設(shè)計樣本”才會結(jié)束原本“創(chuàng)意設(shè)計”的爭論，真是設(shè)計“突破”的大敵。
點擊頭像顯示的更多操作，MSN的處理方式相當(dāng)?shù)那擅?，操作的前后承接給用戶的引導(dǎo)恰到好處，whrrl的notification機制并沒有使用傳統(tǒng)的badge，而是在首頁以弧形截面標(biāo)識出來，當(dāng)有信息進來的時候，弧形截面就顯示為橘黃色以來提醒。
基于SNS的網(wǎng)站以及最近成為潮兒的微博，都有一個很重要的模塊：好友或關(guān)注的人的動態(tài)表單，因為這個動態(tài)的更新速度非常的快，不可能保存在本地讓用戶逐一閱讀（實際上這些動態(tài)不見得都是用戶需要的），有一個非常好的設(shè)計策略就是顯示最新的幾十條，如果查看舊的動態(tài)（相對新的而言），就點擊更多，當(dāng)然可能當(dāng)前查看的過程中，又有許多新的動態(tài)，但是沒有加載到當(dāng)前列表中，就需要刷新，上圖呈現(xiàn)的微博（新浪，騰訊）根據(jù) iPhone固有的UI特性（滑動到列表的底部開始緩沖，這個和一些顯示的物理現(xiàn)象非常貼切）以及從上到下的自然順序（習(xí)慣性的認(rèn)為上面是最新的，下面是最舊的，這是習(xí)慣用戶，可參考Do not make me think一書 關(guān)于習(xí)慣用法章節(jié)），產(chǎn)生的聰明設(shè)計“下拉刷新”，對于寸土寸金的iPhone屏幕，合理顯示且平易近人。
這種聰明設(shè)計并不是iPhone的設(shè)計專利，在具有同樣使用習(xí)慣的Android平臺上也一樣可以使用，只是使用方式有所差異（Android平臺并沒有滑動列表到底部緩沖的習(xí)慣，所以刷新按鈕和顯示更多按鈕需要顯性的出現(xiàn)在列表的起點和終點而不是像iPhone通過下拉操作完成刷新，所以可以藏起來）
Page indicator是多個頁面進行滑動切換的標(biāo)識，是iPhone平臺的一個聰明設(shè)計組件。
上圖顯示的appstore對某個產(chǎn)品進行介紹，產(chǎn)品圖片的瀏覽模式，恰當(dāng)?shù)氖褂胮age indicator，一方面防止過多的圖片累加導(dǎo)致頁面過長，另一方面在初期獲取數(shù)據(jù)的時候也適當(dāng)?shù)木徑饬朔?wù)器的壓力。
右圖是手機QQ瀏覽器1.2的首頁面，將快速鏈接以page indicator的形式來組織，恰當(dāng)利用了iPhone用戶的使用習(xí)慣，應(yīng)用非常的巧妙。
而whrrl將page indicator干脆放在了導(dǎo)航欄作為標(biāo)題的一部分，我不假思索就非常清楚左右滑動可以輕松切換至其他頁面。
本文來自：http://www.ucd-grow01.com/?p=207
【編輯推薦】
