在手機應(yīng)用的交互細(xì)節(jié)上，Android 與 iOS 有哪些區(qū)別?
在 交互細(xì)節(jié)上有哪些區(qū)別，這問題回答起來估計就有難度了!
事先聲明，文長...... -_-'
首先從 導(dǎo)航模式開始，iOS 應(yīng)用大多數(shù)情況,只提供單一的路徑。無論什么樣的程序，都只有一個窗口，這個窗口用于放置程序的內(nèi)容和功能，用戶不會意識到這個窗口。在 iOS 設(shè)備中,用戶覺得程序就是依次呈現(xiàn)的一屏又一屏圖像。
可以把一屏圖像想象成一個離散的視覺狀態(tài)或者模態(tài)。一個程序擁有的屏數(shù)或多或少,每一屏都是各種素材和控件的組合，由此而衍生了iOS 應(yīng)用內(nèi)的多種導(dǎo)航模式，如：平鋪、列表及樹狀等。涉及到層級導(dǎo)航通過應(yīng)用內(nèi)左上角back鍵進(jìn)行返回操作(圖1)。
圖1
應(yīng)用內(nèi)的導(dǎo)航與系統(tǒng)導(dǎo)航分隔開，iOS應(yīng)用內(nèi)一般無「退出」選項，通過實體home按鍵返回主屏界面及退出應(yīng)用(手勢支持)。
Android 2.3和更早的系統(tǒng)依賴于手機硬件的返回鍵來支持應(yīng)用程序的導(dǎo)航。Android 3.0 中引入了操作欄,于是出現(xiàn)了第二種導(dǎo)航機制: “向上”按鈕(圖2)。
圖2
向上按鈕被用于基于層級關(guān)系的應(yīng)用程序中的界面切換。系統(tǒng)的“返回”按鍵是基于用戶最近查看，以時間倒敘的方式連接的界面歷史的導(dǎo)航(但有時候又不遵循這條邏輯)。
Android應(yīng)用導(dǎo)航主要分為以下三類：
1.應(yīng)用程序內(nèi)的導(dǎo)航
通過多個入口進(jìn)入到界面
界面內(nèi)的視圖間導(dǎo)航
同一層級的界面間導(dǎo)航
2.應(yīng)用程序外的導(dǎo)航(通過主屏Widgets和通知)
間接通知(通知欄內(nèi)的消息、mail內(nèi)的日歷等)
彈出通知
3.應(yīng)用程序間的導(dǎo)航
當(dāng)上一個查看的界面是當(dāng)前界面的父層級時,點擊“返回”按鍵和點擊“向上”按鍵的結(jié)果是一樣的。然而,與“向上”按鍵不同的是, “向上”按鍵可以確保用戶停留在應(yīng)用程序中,而“返回”按鍵可以讓用戶回到系統(tǒng)首頁,甚至?xí)氐搅硪粋€應(yīng)用戶程序。
圖3
Android 4.x后采用將四大天王實體鍵修改為三個虛擬按鍵(返回、Home、多任務(wù))，意在解決Android設(shè)備碎片化的問題，并希望能夠解決Android一直以為存在的導(dǎo)航問題，但在實際當(dāng)中該問題依然存在(魅族的Smart bar同樣在嘗試解決這個問題，通過有效的設(shè)計形成與其它手機的差異化)。
圖4
在為Android應(yīng)用進(jìn)行設(shè)計時，請充分考慮導(dǎo)航問題，避免用戶在使用過程中迷失，并且在考慮按鈕位置及操作方式時注意Android虛擬鍵的誤操作問題。
2. 操作欄(工具欄)
iOS工具欄一般處于屏幕的底部，但iPad端也可能出現(xiàn)在頂部。工具欄上的控件等寬放置。控件會隨著屏上內(nèi)容的切換而改變,因為內(nèi)容與用來操縱它的控件是匹配起來的。在工具欄上放置當(dāng)前情景下用戶最常用的功能。每個工具欄上的控件至少要保持 44×44 points的面積(Retina屏寬高均提高2倍 one point equals two pixels )，方便用戶操作。
圖5
Android操作欄是 Android 應(yīng)用程序的最重要的結(jié)構(gòu)元素。它幾乎在應(yīng)用程序的每個界面的頂部都有一塊專用的區(qū)域(圖6)。
圖6
大多數(shù)應(yīng)用程序的操作欄被劃分為四個不同的功能區(qū)域 ：
1.應(yīng)用程序的圖標(biāo)：圖標(biāo)能夠幫助用戶對應(yīng)用進(jìn)行識別，如果當(dāng)前顯示的不是應(yīng)用程序的最高層界面,保證在圖標(biāo)左邊顯示“向上”符號。
2.視圖控件 ：如果你的應(yīng)用程序在不同的視圖展示內(nèi)容,操作欄的這個部分可以允許用戶切換視圖
3.操作按鈕 ：操作欄里的操作按鈕會展示你的應(yīng)用程序的最重要的操作。
4.更多操作 ：把不常用的操作放到更多操作里。
Android 3.0在某些應(yīng)用界面引入了長按進(jìn)入選擇模式，4.x后對選擇模式進(jìn)行了改良引入了情境操作欄(CAB，contextual action bar)，與操作欄出現(xiàn)在同一個位置(圖7)，后面會與iOS的編輯模式進(jìn)行比較。
圖7
Ps. Android里也有底部操作欄，但僅為頂部操作欄的擴展，官方稱為「Split Action Bar」(圖7)。
圖8
在進(jìn)行設(shè)計的時候需要考慮操作欄如何適應(yīng)不同的屏幕方向和屏幕尺寸，進(jìn)行動態(tài)的調(diào)整以達(dá)到最優(yōu)的效果。
3. 多任務(wù)
iOS通過雙擊Home鍵及四指手勢激活多任務(wù)選擇器(圖6)。大多數(shù)程序在轉(zhuǎn)移到后臺的時候,會被掛起。被掛起的程序會展示在“多任務(wù)選擇器 (multitasking bar)”中，幫助用戶快速找到近期使用的程序。當(dāng)用戶重啟掛起的程序時,它能夠從退出時所在的那個點迅速恢復(fù),無需重新渲染界面。
當(dāng)用戶激活多任務(wù)選擇器后：
1.向左滑動，查看更多其它任務(wù)。
2.向右滑動(首屏任務(wù)界面)， 進(jìn)入側(cè)快捷面板區(qū)域。
3.長按任務(wù)，進(jìn)入刪除模式。
圖9
為iOS 應(yīng)用進(jìn)行設(shè)計時，請考慮iOS雙層狀態(tài)欄( double-high status bar)，顯示當(dāng)前正在進(jìn)行的任務(wù)：通話中、錄音中等，應(yīng)用布局不會因高度的變化而出現(xiàn)問題。
Android的多任務(wù)界面提供了一個最近使用的應(yīng)用程序之間切換的有效方式。并被賦予一個獨立的虛擬按鍵，位于導(dǎo)航欄的最右側(cè),用以顯示用戶最近使用的應(yīng)用程序及任務(wù),它們通過時間順序進(jìn)行組織排列,最近使用的應(yīng)用程序放置在近期任務(wù)界面的最底部。
近期任務(wù)管理，當(dāng)用戶點擊近期任務(wù)按鍵后：
1.選中任務(wù)左/右滑動，刪除任務(wù)。
2.長按任務(wù)，將彈出任務(wù)彈窗，「從列表中刪除」、「應(yīng)用信息」
圖10
4. 通知中心
早期iOS系統(tǒng)并沒有通知中心，后引入Android系統(tǒng)中通知中心設(shè)計，這是一種能夠使用戶更為簡單、方便的查看各種通知信息的方案。用戶通過手指從頂部邊緣下滑激活通知中心(與Android一樣)，在應(yīng)用全屏?xí)r用戶需要兩次操作才可激活通知中心(防止誤操作)。用戶在通知中心內(nèi)可實現(xiàn)應(yīng)用間的調(diào)用或跳轉(zhuǎn)，需要通過iOS的多任務(wù)才可返回之前應(yīng)用(Android采用系統(tǒng)的back鍵，導(dǎo)致應(yīng)用與應(yīng)用之前的邏輯復(fù)雜性的增加)。
通知中心一般承載以下類型信息：
1.消息。
2.事件。
3.更新。
4.狀態(tài)
圖11
通知中心是早期Android系統(tǒng)中的優(yōu)秀設(shè)計，在之后的更新中也不斷被賦予新的意義。Android的通知系統(tǒng)被設(shè)計為當(dāng)用戶聚焦某個任務(wù)時能快速告知用戶一些事件，但還是應(yīng)該謹(jǐn)慎決定創(chuàng)建一個通知。
用戶在通知中心內(nèi)實現(xiàn)應(yīng)用間的調(diào)用或跳轉(zhuǎn)，但需要詳盡考慮Android系統(tǒng)導(dǎo)航「back」、「up」對跳轉(zhuǎn)邏輯的影響。
因Android的開放性，導(dǎo)致通知中心所顯示的信息可進(jìn)行相應(yīng)的設(shè)計，但需注意以下幾條：
1.使其私有化 。
2.導(dǎo)航到正確的地方
3.對時間敏感事件請增加時間戳
4.對通知進(jìn)行合并
5.自我清理，如某個事件在具體時間發(fā)生，過期后該通知可能對用戶來說并不重要。
6.使用不同的圖標(biāo)或提示。
圖12
寫到這插個題外話，微軟的Win8木有通知中心的設(shè)計，不知道是因為趕工還是設(shè)計理念的原因，導(dǎo)致Surface平臺的通知有點像早期iOS的情況，Win8主要依靠三種通知方式進(jìn)行提示：1.屏幕右上角通知。 2.鎖屏界面的更新和詳細(xì)狀態(tài)。 3.「開始」屏幕上的磁貼。
5. 通知方式
目前iOS中的通知具體有四種方式：
1.條幅式通知。
2.彈出式通知。
3.Icon右上角消息式通知。
4.聲音通知。
每種通知方式給用戶的通知強度及心理影響均不同，在設(shè)計時考慮希望給用戶呈現(xiàn)的消息級別及相對應(yīng)的通知強度。應(yīng)用的通知及是否顯示在通知中心，用戶均可在設(shè)置中進(jìn)行設(shè)置，請謹(jǐn)慎使用通知，不要讓用戶感到困擾及厭煩。
圖13
Android中的通知具體有以下四種方式
1.通知區(qū)域提醒。
2.進(jìn)行中的通知
3.彈出式通知。
4.提示條通知。
其中彈出式及提示條通知僅在當(dāng)前運行的應(yīng)用中出現(xiàn)，顯示需要用戶立即處理的任務(wù)或提醒。進(jìn)行中的通知可讓用戶了解正在后臺運行的進(jìn)程。例如音樂播放器會在通知系統(tǒng)里一直顯示 當(dāng)前正在播放的曲目直到用戶手動停止播放。在頂部狀態(tài)欄通知區(qū)域以圖標(biāo)表示最近的通知，打開通知中心即可查看這些通知，平板電腦通知區(qū)域被集成到屏幕底部的系統(tǒng)欄中。
圖14
6. 編輯模式(選擇模式)
iOS應(yīng)用在可供用戶編輯的界面一般通過Table view的「編輯」鍵進(jìn)入編輯模式，進(jìn)入編輯后頂部導(dǎo)航欄發(fā)生變化，根據(jù)內(nèi)容的不同出現(xiàn)不同的編輯選項，允許對內(nèi)容進(jìn)行多項，執(zhí)行操作時將應(yīng)用到多項所選內(nèi)容，在編輯項過多時，可采用底部操作欄的設(shè)計。用戶在編輯模式下執(zhí)行完編輯后點擊「完成」退出當(dāng)前模式。
圖15
Android通過長按進(jìn)入選擇模式，選擇內(nèi)容后出現(xiàn)的情境操作欄(CAB)是一個覆蓋在你的應(yīng)用程序當(dāng)前操作欄上的臨時操作欄，它在用戶長按某個可被選擇的內(nèi)容項后出現(xiàn)(圖7，往上找哦)。 進(jìn)入選擇模式后，通過點擊可選擇多個內(nèi)容項，在情境操作欄觸發(fā)一個操作會應(yīng)用到所有被選中的內(nèi)容，執(zhí)行操作后將退出選擇模式，情景操作欄也隨著消失。
應(yīng)用程序需要支持同時選擇多個內(nèi)容項時，Android官方建議使用情境操作欄，并對長按手勢進(jìn)行預(yù)留。
圖16
iOS在文本視圖、web 視圖和圖片視圖里調(diào)出編輯菜單,來執(zhí)行剪切、粘貼和選擇等操作，菜單出現(xiàn)在需要進(jìn)行處理的內(nèi)容附近，與內(nèi)容產(chǎn)生關(guān)聯(lián)，輕量的懸浮式設(shè)計避免了模式化的狀態(tài)(用戶可點擊任何區(qū)域取消懸浮菜單)。應(yīng)用程序可調(diào)整菜單的行為，給用戶更多控制內(nèi)容的操作。
圖17
Android可以在文本框及其它文本視圖中長按選擇任何文字，這個操作會觸發(fā)一個文本選擇模式，便于擴展選擇或?qū)x定文本進(jìn)行操作。同樣，該選擇模式會激活情境操作欄。Android 4.x對選擇滑塊的處理很優(yōu)秀，便于用戶選擇，能夠精確進(jìn)行定位，單滑塊進(jìn)行光標(biāo)定位時尤為管用。
圖18
7. Widgets(小部件)
這個應(yīng)該先從Android談起，Widgets一直是Android系統(tǒng)的亮點(個人不太喜歡，可能是因為Android系統(tǒng)的復(fù)雜性)，Android系統(tǒng)導(dǎo)航層級就分為了主屏幕和應(yīng)用列表，主屏幕是一個可定制的區(qū)域，用以放置應(yīng)用程序的快捷方式、文件夾、及Widgets，通過用戶左右劃動屏幕切換到不同的主屏幕面板。 應(yīng)用列表內(nèi)區(qū)分為App區(qū)域及Widgets區(qū)域，隨著用戶安裝的應(yīng)用越來越多，相應(yīng)的Widgets也越來越多... -_-' 一個應(yīng)用可以弄多個不同size的Widgets， 好像又有點扯遠(yuǎn)了!
Android系統(tǒng)的Widgets分為以下四種類型：
1. 信息型Widgets
2. 聚合型Widgets
3. 控制型Widgets
4. 混合型Widgets
圖19
iOS平臺可能大多數(shù)人覺得并沒有Widgets的概念，通知中心內(nèi)的天氣及股票可以算是iOS對Widgets的試水(個人感受)，雖然簡單，但相信應(yīng)該會在未來看到iOS對這一方面更深入的嘗試吧。 ^_^
8. Tab欄
iOS的Tab欄用于切換子任務(wù)、視圖和模式。Tab欄位于屏幕的底部,并且始終可見。Tab 欄上展示圖標(biāo)和文字，當(dāng)用戶選中某個tab時，這個tab處于高亮狀態(tài)。
在 iPhone 上，tab 欄一次只能顯示 5 個以內(nèi)的頁簽。如果程序需要更多的tab，tab欄可以展示前四個，第五個放置「更多」，用列表的方式呈現(xiàn)其余的項目。
圖20
Android的Tab欄用于探索和切換不同視圖或功能,也可用于瀏覽不同分類的內(nèi)容集合。主要有三種tab類型：
1. 滾動tab
2. 固定tab
3. 堆疊tab
圖21
頭又開始痛了，不想寫了，就到這吧... T_T
兩個系統(tǒng)還有很多細(xì)節(jié)上的不同，像Android的邊界反饋效果與iOS的回拉效果、Activity Indicator的對比、dialog上確認(rèn)鍵兩個系統(tǒng)分別在不同的位置等，以及iOS特有功能上的一些交互特性Passbook、iCloud、iAd等等......
Ps.以上每個點均能單獨拿出來寫個長文
-- 完 --
