iPad用戶(hù)體驗(yàn)準(zhǔn)則
![](http://image.woshipm.com/wp-files/img/43.jpg)
本文譯自《iPad User Experience Guidelines》,供個(gè)人學(xué)習(xí)之用,水平有限,難免有欠妥之處。
iPad用戶(hù)體驗(yàn)最主要體現(xiàn)在內(nèi)容和交互:
- 淡化程序UI,以便用戶(hù)關(guān)注所需的內(nèi)容。
- 美觀的內(nèi)容形式,富有真實(shí)感。
- 充分利用設(shè)備的性能來(lái)增強(qiáng)內(nèi)容的交互性。
支持所有方位
優(yōu)秀iPad程序的其中一個(gè)重要因素是可以在所有方位上運(yùn)行。豎向的大屏幕可以滿(mǎn)足用戶(hù)瀏覽內(nèi)容的需求(當(dāng)豎屏幕較小時(shí),用戶(hù)就會(huì)將屏幕旋轉(zhuǎn)為橫屏幕,這樣一行就可以顯示較多的文字)。用戶(hù)不太會(huì)注意最小設(shè)備結(jié)構(gòu)(minimaldevice frame;使用iPhone時(shí),用戶(hù)單手握住手機(jī)時(shí),屏幕多為豎向顯示;而雙手使用iPad,屏幕的顯示方位并不能確定)或者h(yuǎn)ome按鍵的位置,他們不認(rèn)為設(shè)備有默認(rèn)方位。這就導(dǎo)致用戶(hù)期望程序可以在當(dāng)前方位上運(yùn)行。所以程序盡量滿(mǎn)足iPad各方位的運(yùn)行要求。
保證以首要內(nèi)容為重點(diǎn)。當(dāng)旋轉(zhuǎn)iPad的方位時(shí),如重點(diǎn)顯示的內(nèi)容發(fā)生變化,用戶(hù)會(huì)感覺(jué)對(duì)程序失去控制。
旋轉(zhuǎn)時(shí)如何顯示輔助信息或者功能。盡管能保證上一條,還要考慮如何顯示較為次要的信息。例如郵箱功能中,首要內(nèi)容時(shí)發(fā)郵件,次要內(nèi)容是聯(lián)系人和收件箱的列表。
橫屏的次要內(nèi)容顯示在左邊的分視圖中
豎屏的次要內(nèi)容顯示在氣泡框中。
再如,橫屏?xí)r,一款游戲以長(zhǎng)方形顯示,當(dāng)旋轉(zhuǎn)到豎屏?xí)r,需要調(diào)整屏幕上的顯示區(qū)域,游戲顯示邊框的上面或者下面增加顯示空間,用于顯示輔助信息,而不是垂直拉伸顯示區(qū)域來(lái)?yè)螡M(mǎn)整個(gè)屏幕。
避免布局變化過(guò)大或者無(wú)緣由地改變。所有方位中都顯示相似的UI布局旋轉(zhuǎn)時(shí)盡可能保留信息和文本的原有格式。尤其閱讀文本時(shí),重要的是避免旋轉(zhuǎn)之后用戶(hù)找不到讀到哪兒了。如果非要對(duì)頁(yè)面重新布局,可以使用動(dòng)畫(huà)幫助用戶(hù)理解當(dāng)前頁(yè)面的變化。例如,當(dāng)旋轉(zhuǎn)時(shí)要必須增加或者移除文本框時(shí),可以選擇隱藏動(dòng)作并在新布局中簡(jiǎn)單地淡出。為了有助于合理地設(shè)計(jì)旋轉(zhuǎn)動(dòng)作,可考慮在真實(shí)的生活中是如何和它們交互的。
避免使用UI元素或者定義一個(gè)旋轉(zhuǎn)的手勢(shì)來(lái)完成旋轉(zhuǎn)動(dòng)作。應(yīng)該是內(nèi)容隨著iPad的旋轉(zhuǎn)而旋轉(zhuǎn)。
為每個(gè)顯示方位各提供一個(gè)啟動(dòng)圖片。比如提供1004×768和748×1024的圖片來(lái)滿(mǎn)足兩個(gè)方位的顯示要求。
仔細(xì)考慮程序是否可以在所有方位上運(yùn)行。有些程序只能在橫屏或者豎屏下顯示,此時(shí):
- 顯示程序?yàn)檎o@示方式,無(wú)論當(dāng)前iPad是什么方位。避免使用UI元素來(lái)告知用戶(hù)旋轉(zhuǎn)設(shè)備。支持180度旋轉(zhuǎn)。
- 可以特殊處理輸入式旋轉(zhuǎn)動(dòng)作。有些游戲把旋轉(zhuǎn)設(shè)備當(dāng)成操作方式,這時(shí)候橫豎屏切換時(shí),可不改變游戲的顯示方位。
增強(qiáng)交互
最好的iPad程序在用戶(hù)執(zhí)行明確的任務(wù)時(shí)提供新穎的交互方式。不要為了填滿(mǎn)整個(gè)大屏幕而增加一些和主要任務(wù)沒(méi)有直接關(guān)聯(lián)的功能,而是提升程序的用戶(hù)體驗(yàn)。
例如讀書(shū)程序中容許用戶(hù)閱讀時(shí)如能保留路徑會(huì)提升閱讀體驗(yàn),不需要跳轉(zhuǎn)到另外一個(gè)頁(yè)面而是使用氣泡框來(lái)變更路徑。程序可以讓用戶(hù)在文本中增加書(shū)簽和注釋?zhuān)瑤椭脩?hù)交換書(shū)目或者對(duì)比閱讀進(jìn)度。
信息扁平化
iPad的大屏幕和新UI元素可以顯示更多的信息,使用的得當(dāng)可以避免尋找信息時(shí)跳轉(zhuǎn)的次數(shù)過(guò)多,因此也改變iPhone的單屏顯示結(jié)構(gòu)。
使用分欄。兩級(jí)的內(nèi)容同時(shí)顯示使得信息扁平化。
使用氣泡框。頂部的氣泡框可以顯示控件或者工具,不必切換屏幕即可完成操作。
工具欄中顯示分段控件。分段控件可以顯示并列的信息。
使用標(biāo)簽欄。標(biāo)簽欄顯示不同種類(lèi)信息或者是不同的程序模塊。
減少全屏切換
相似的視覺(jué)元素,而在某一區(qū)域變更內(nèi)容。普遍的規(guī)則是寧愿轉(zhuǎn)換單獨(dú)的視圖或者組件,也不全屏切換,保證視覺(jué)穩(wěn)定性,幫助用戶(hù)理解自己所處的位置。
增強(qiáng)協(xié)作和聯(lián)系
用戶(hù)將iPad視為私人設(shè)備,但是它合宜的尺寸可以加強(qiáng)真實(shí)的協(xié)作和分享。
真實(shí)感
程序顯示和現(xiàn)實(shí)生活越為相似,用戶(hù)就越容易理解程序如何操作并喜歡使用。但也不必過(guò)于精確,通??鋸埖氖挛锟雌饋?lái)更為真實(shí)并能傳遞更多的意義,當(dāng)做是和用戶(hù)交流并表述程序本質(zhì)的一次機(jī)會(huì)。使用動(dòng)畫(huà)進(jìn)一步地增強(qiáng)程序的真實(shí)感。通常,動(dòng)作的真實(shí)感比程序的外觀更為重要,不符合物理規(guī)律的動(dòng)作會(huì)讓用戶(hù)感覺(jué)到迷惑。
令人驚嘆的圖形
高分辨率的iPad屏幕所支持豐富、美觀和動(dòng)人的圖形對(duì)用戶(hù)富有吸引力,因此可以嘗試增加程序中圖形的深度和細(xì)節(jié)。
弱化界面控件
通過(guò)設(shè)計(jì)程序中的UI來(lái)組織信息框架,減少控件的數(shù)量和淡化顯示效果,創(chuàng)建和程序風(fēng)格相符的控件,這樣既不突出,但又易于發(fā)現(xiàn)。
最少的模態(tài)對(duì)話(huà)框
模態(tài)對(duì)話(huà)框打斷用戶(hù)的工作流,需用在合適的情況下:
- 有必要吸引用戶(hù)注意力的時(shí)候。
- 避免用戶(hù)因誤操作而導(dǎo)致的數(shù)據(jù)丟失。
重新思考列表
列表(也就是表視圖)在iPhone中常用于顯示大量的數(shù)據(jù)信息,在iPad也是非常有用。但是還可以使用一個(gè)更豐富的方式來(lái)顯示同樣的信息。例如:iPhone中的聯(lián)系方式是一個(gè)很有效率的列表。而在iPad中的聯(lián)系方式看起來(lái)是一個(gè)美觀的通訊錄,iPad的列表可以顯示更多的信息。
多點(diǎn)觸摸
大屏幕支持自定義的多點(diǎn)觸摸,即使是多人同時(shí)使用iPad,牢記不用響應(yīng)不標(biāo)準(zhǔn)的觸摸手勢(shì),如果有的話(huà),也只用一種方式來(lái)執(zhí)行命令。
氣泡框
氣泡框和模態(tài)視圖有些相似,當(dāng)氣泡框顯示時(shí),不能操作主視圖。但模態(tài)視圖是模態(tài)的。然而氣泡框可以用在兩種途徑:
- 模態(tài)。氣泡框出現(xiàn)時(shí),周?chē)慕缑娴枰粋€(gè)明確的操作取消。
- 非模態(tài)。點(diǎn)擊氣泡框周?chē)慕缑嬉部梢匀∠麣馀菘颉?/li>
如果在iPhone中使用了模態(tài)視圖,可以考慮可以氣泡框替代它。以下問(wèn)題可以幫助你決定氣泡框的使用是否合理:
- 是否需要不同類(lèi)型的輸入?如果是,使用氣泡框。氣泡框更適合顯示一個(gè)選擇器或者列表選項(xiàng)。
- 是否需要用戶(hù)穿過(guò)多級(jí)視圖。如果是,使用氣泡框。氣泡框的結(jié)果適合顯示多級(jí)頁(yè)面,因?yàn)閷?duì)主視圖的改變較小。
- 可能在主視圖操作才可以完成任務(wù)嗎?如果是,使用非模態(tài)氣泡框。因?yàn)橛脩?hù)點(diǎn)擊主視圖即可取消氣泡框,容許用戶(hù)中止操作氣泡框并返回主視圖。
- 任務(wù)需要用戶(hù)深度投入并且是程序的一個(gè)主要功能?如果是,可能需要使用模態(tài)視圖。模態(tài)視圖的語(yǔ)境轉(zhuǎn)換幫助用戶(hù)在任務(wù)上集中注意力,較大模態(tài)視圖便于用戶(hù)輸入大量的字符段。
從另一方面而言,這個(gè)任務(wù)代表程序功能的重要一部分,但要是不需要用戶(hù)深度投入注意力的話(huà),氣泡框是更好的選擇,輕量級(jí)的視覺(jué)對(duì)于頻繁執(zhí)行的任務(wù)而言更為親切。
是否任務(wù)執(zhí)行只有一次或者很少,就像安裝任務(wù)。如果是,考慮使用模態(tài)視圖。用戶(hù)不會(huì)介意為了完成此類(lèi)任務(wù)而停留在當(dāng)前界面。
限制模態(tài)任務(wù)的復(fù)雜度
用戶(hù)樂(lè)于在一個(gè)模態(tài)視圖中完成一個(gè)子任務(wù),因?yàn)檎Z(yǔ)境的轉(zhuǎn)換清晰和短暫的。但是如果子任務(wù)太復(fù)雜,用戶(hù)會(huì)忽視主任務(wù),當(dāng)模態(tài)視圖全屏顯示并包含多個(gè)子視圖時(shí),這種危險(xiǎn)會(huì)增加。如果模態(tài)任務(wù)非要包含子視圖,確保給予用戶(hù)一個(gè)單獨(dú)和層次清晰的路徑,避免迂回。提供一個(gè)明顯和安全的方式退出模態(tài)任務(wù),用戶(hù)能預(yù)見(jiàn)此操作的后果。
淡化文件管理
盡管iPad程序容許用戶(hù)創(chuàng)建和操作文件,這并不意味著用戶(hù)應(yīng)該對(duì)于文件系統(tǒng)有意識(shí)。iPad沒(méi)有像Mac OS一樣的文件搜索,用戶(hù)也不必想在電腦上一樣和文件進(jìn)行交互。用戶(hù)不應(yīng)該考慮文件類(lèi)型和位置,比如:
- 打開(kāi)和保存對(duì)話(huà)框中出現(xiàn)文件層級(jí)關(guān)系。
- 文件的訪(fǎng)問(wèn)權(quán)限信息。
一個(gè)文件處理程序鼓勵(lì)用戶(hù)預(yù)覽內(nèi)容。如果iPad程序容許用戶(hù)創(chuàng)建和編輯文檔,最好提供文檔種類(lèi)選擇器便于用戶(hù)打開(kāi)一個(gè)現(xiàn)有文檔或者創(chuàng)建新文檔。理想情況下的文檔選擇器為:
- 高度圖形化。用戶(hù)看到文檔的視覺(jué)形式時(shí)能很容易識(shí)別出需要的文檔。
- 用戶(hù)使用最少的觸摸手勢(shì)找到需要的內(nèi)容。例如打開(kāi)一個(gè)文檔只需平移水平滾動(dòng)條和輕擊文檔。
- 創(chuàng)建新文檔的功能。當(dāng)用戶(hù)沒(méi)有找到想要的文檔時(shí),選擇器提供一個(gè)創(chuàng)建文檔的功能而不是到其他界面尋找此功能。
只有需要的時(shí)候才要求用戶(hù)保存
用戶(hù)應(yīng)該確信他們的工作是實(shí)時(shí)地被保存,除非他們明確取消或者刪除。如果程序幫助用戶(hù)創(chuàng)建和編輯文檔,保證用戶(hù)不需要明確地執(zhí)行保存命令。如果程序的主要功能不是創(chuàng)建內(nèi)容,但要容許用戶(hù)切換瀏覽和編輯模式,這時(shí)可以明確要求用戶(hù)保存修改內(nèi)容。在這種情況下,信息顯示的視圖中提供“編輯”按鈕,輕擊之后,該按鈕變?yōu)椤氨4妗卑粹o和“取消”按鈕?!熬庉嫛卑粹o的轉(zhuǎn)換提醒用戶(hù)當(dāng)前界面為編輯模式,“刪除”按鈕讓用戶(hù)不保存修改內(nèi)容的情況下退出程序。
工具欄移至頂部
與iPhone程序不同,iPad的工具欄在頂部,iPad寬大屏幕可以顯示工具欄中的所有功能。
立即啟動(dòng)
iPad程序啟動(dòng)時(shí)用戶(hù)無(wú)須等待即可開(kāi)始操作。當(dāng)啟動(dòng)時(shí),iPad程序:
- 顯示程序在當(dāng)前方位上的啟動(dòng)圖片,減輕用戶(hù)的等待感,讓用戶(hù)知道程序仍在運(yùn)行。
- 避免程序啟動(dòng)變慢。啟動(dòng)圖片(launch image)中顯示品牌信息是容許的,但是銘記用戶(hù)啟動(dòng)程序時(shí)每次都會(huì)看到這個(gè)內(nèi)容。如果非要使用啟動(dòng)畫(huà)面(splash screen),明確顯示時(shí)候不是過(guò)長(zhǎng)并且無(wú)需任何用戶(hù)交互。
- 恢復(fù)程序上一次運(yùn)行狀況。
- 避免要求用戶(hù)提供啟動(dòng)信息。取而代之的是:
- 關(guān)注80%的用戶(hù)需求。
- 從系統(tǒng)中獲取更多的信息。從系統(tǒng)中調(diào)取信息可以避免輸入。
- 用戶(hù)在輸入前受益。如果輸入不可避免,那也要在用戶(hù)先讓獲取有效信息。
隨時(shí)準(zhǔn)備停止
和iPhone一樣,iPad程序在用戶(hù)按“Home”鍵之后,因此:
- 盡快和合理地保存數(shù)據(jù)。
- 退出時(shí)保存界面的每一個(gè)細(xì)節(jié)。
來(lái)源:daichuanqing.com/index.php/archives/1212
深入簡(jiǎn)出,很棒