带玩具逛街时突然按下按钮的故事,丰满的妺妺3伦理播放,新婚人妻不戴套国产精品,大肉大捧一进一出好爽视频百度

iOS 9人機界面指南(一):UI設計基礎(下)

轉載 收藏7 評論
舉報 2015-11-07

iOS 9人機界面指南(一):UI設計基礎(下)

來源:ISUX

譯者注:本文譯自蘋果官方人機界面指南 iOS Human Interface Guidelines (2015年10 月21日),由騰訊ISUX設計師翻譯整理,非發文者一人之作。譯文首發于ISUX博客,如在閱讀過程中發現錯誤與疏漏之處,歡迎不吝指出。后續章節會陸續更新,敬請期待。

下篇:

1.7 交互性與反饋(Interactivity and Feedback)
1.7.1 可交互元素吸引用戶點擊(Interactive Elements Invite Touch)
1.7.2 用戶所知道的標準手勢(Users Know the Standard Gestures)
1.7.3 反饋有助于理解(Feedback Aids Understanding)
1.7.4 輸入信息的方式要簡單(Inputting Information Should Be Easy)
1.8 動畫(Animation)
1.9 品牌推廣(Branding)
1.10 顏色與字體(Color and Typography)
1.10.1 色彩有助于增進溝通(Color Enhances Communication)
1.10.2 優秀的排版提供清晰的傳達(Great Typography Enables Clear Communication)
1.11 圖標和圖形(Icons and Graphics)
1.11.1 應用圖標(The App Icon)
1.11.2 小圖標(Small Icons)
1.11.3 圖形(Graphics)
1.12 術語和措辭(Terminology and Wording)
1.13 與iOS的整合(Integrating with iOS)
1.13.1 正確使用標準UI元素(Use Standard UI Elements Correctly)
1.13.2 弱化文件和文檔處理(Downplay File and Document Handing)
1.13.3 必要時提供可配置選項(Be Configurable If Necessary)
1.13.4 充分利用iOS技術(Take Advantage of iOS Technologies

1.7 交互性與反饋(Interactivity and Feedback)

1.7.1 可交互元素吸引用戶點擊(Interactive Elements Invite Touch)

為了暗示交互性,設計時會使用很多線索,包括點擊的反饋、顏色、位置、上下文、表意明確的圖標和標簽等。并不需要過于修飾元素來向用戶展示可交互性。

在支持3D Touch的設備上,當用戶按壓主屏上的圖標時,背景會虛化以此來暗示可以進行更多功能的選擇。

33.jpg

一個關鍵的顏色可以給用戶提供很強的視覺指引,尤其是沒有冗余的其它顏色時。為了對比,使用藍色來標記可交互的元素,同時能提供統一的、易識別的視覺風格。

34.jpg

返回按鈕使用多個線索指明其可交互并傳達其功能:它出現在導航中,顯示了一個指向后方的圖標,使用了關鍵色,并且顯示了上一級頁面的標題。

35.jpg

一個圖標或者標題提供了清晰的名稱指引用戶點擊它。例如,地圖中的標題“Flyover Tour”,“Directions to Here”,清晰的說明了用戶可做的操作。結合關鍵色,就可以省去按鈕邊界或其他多余的修飾。

36.jpg

在內容區域,必要時可以給按鈕添加邊界或背景。位于欄(Bar)、動作列表(Action Sheet)和警告框(Alert)中的按鈕可以不需要邊界,因為用戶知道在這種區域中大多數選項是可交互的。但是在內容區域,有必要使用邊界或背景將按鈕從其他內容中區分出來。例如,音樂,時鐘,照片,App Store在一些特別的場景中使用這種按鈕。

照片管理中給分享按鈕增加了邊框,從其他解釋性文本中區分出來。

37.jpg

時鐘在秒表和計時頁面中給按鈕增加背景來強調開始和暫停按鈕,并且使按鈕在易分散注意力的內容中更容易點擊。

38.jpg

應用商店中使用有邊界的按鈕,將按鈕和整個內容條區分開來,點擊整條內容查看詳細信息,點擊按鈕進行下載安裝。

39.jpg

1.7.2 用戶所知道的標準手勢(Users Know the Standard Gestures)

用戶使用點擊、拖拽、捏合等手勢與應用和他們的IOS設備進行交互。使用手勢拉近了用戶和設備之間的距離,并且增強了直接操縱感。用戶通常期待手勢在不同應用之間都是通用的。

用戶在使用3D Touch時不需要學習額外的手勢操作。當用戶輕按屏幕并得到反饋時,很容易就能發現3D Touch提供的額外的交互方式。

40.jpg

除了用戶熟悉的標準手勢,iOS還定義了一些系統范圍內的操作,例如呼出控制中心(Control Center)或消息中心(Notification Center)。用戶可以在任意應用下都使用這些手勢。

不要給標準手勢賦予不同的行為。除非你的應用是游戲,否則重新定義標準手勢會使用戶迷惑,且增加使用難度。

不要創建和標準手勢功能相似的手勢操作。用戶已經習慣了標準手勢的行為,沒有必要讓用戶額外學習不同的操作手勢來達到同樣的操作結果。

可以用復雜手勢作為完成某任務的快捷方式,但不能是唯一觸達方式。最好給用戶提供一些簡單,直接的方式完成某操作,即使這種方法需要他們額外地多點擊一到兩次。簡單的手勢能讓用戶集中于當前的體驗和內容,而不是交互操作本身。

除非是游戲,否則避免定義新的手勢。在游戲或其他沉浸式的應用中,操作手勢也是有趣體驗的一部分。但是在普通應用中,幫助用戶達成目標要比操作本身重要的多,所以最好使用標準手勢,盡量避免讓用戶去發覺和記憶新的操作。

在特定的環境中,可以考慮使用多指操作。雖然復雜的操作并不一定適用于所有應用,但對用戶會花大量時間使用的應用來說可以豐富體驗,例如游戲或創建內容環境。但因為非標準手勢可發現性差,要盡量少用,并且不要讓這類手勢成為完成任務的唯一方式。

1.7.3 反饋有助于理解(Feedback Aids Understanding)

反饋幫助用戶了解應用當前在做什么,發現接下來可以做什么以及理解他們動作產生的結果。UIKit的操作和視圖提供了很多反饋類型。

盡可能將狀態或其他的反饋信息整合到UI中。用戶不進行操作或不跳出當前內容就能獲得需要的信息是最好的。例如,郵箱將當前的狀態顯示在不影響當前內容的工具欄上。

41.png

避免顯示不必要的提醒對話框。對話框是很強的反饋機制,只有在傳遞非常重要,且可操作的信息時才需要使用它。如果用戶常看到很多沒有重要信息的對話框,他們很快就會忽略所有對話框提醒。想要了解更多信息,請參考Alert.(譯者注:Alert處在iOS Human Interface Guidelines的第4章 UI Elements部分,翻譯將在后續更新中放出,煩請各位耐心等候。若有需要,亦可先參考先前已翻譯的iOS7 UI Elements章節:下。)

1.7.4 輸入信息的方式要簡單(Inputting Information Should Be Easy)

不管用戶是點擊控件還是使用鍵盤,輸入信息都會花費時間和精力。如果在發揮有用的效用前就讓用戶輸入大量信息會減弱用戶繼續使用的欲望。

讓用戶更容易的進行選擇。例如,使用選擇器或者表格代替純文本,因為大部分用戶覺得從列表中進行選擇要比打字容易的多。

42.png

適時地從iOS中獲取信息。設備上存儲了大量的用戶信息。可以的話,不要讓用戶提供你可以輕易找到的信息,例如聯系人或日歷信息。

提供有用的反饋來平衡用戶的輸入。在使用應用的過程中,付出和回報的概念可以幫助用戶感到進程在被推進。

1.8 動畫(Animation)

細微、精美的動畫遍布iOS的用戶界面,他們使應用的體驗更具吸引力,更具動態性。適當的動畫可以:

● 傳達狀態和提供反饋
● 增強直接的操縱感
● 將用戶的操作可視化

43.jpg
(譯者注:以上為視頻截圖,完整視頻請點擊觀看)

謹慎地增加動畫,特別是在那些無法提供沉浸式體驗的應用中。過多和無理由的動畫會阻礙應用的流暢性,降低性能,還會分散用戶在操作中的注意力。

尤其是要有目的地,合理地應用動效和UIKit中的動態控件,并確保對結果進行測試。合理地使用動效可以提升用戶的理解程度和愉悅感;應用過度使用動效會給用戶帶來迷惑和難以掌控的感覺。

如果可以,保持自定義動畫和內置動畫的一致性。用戶習慣于內置iOS應用使用的精細動畫。事實上,用戶傾向于把視圖之間的平滑切換,對設備方向改變的流暢相應和基于物理的滾動效果看做是iOS體驗的一部分。除非,你的應用要給用戶提供類似游戲應用的沉浸式體驗,這種情況下自定義的動畫可以區別于內置動畫。

使用風格類型一致的動畫。自定義動畫之間也需要保持一致性,這樣可以讓用戶在使用應用以之前建立的經驗為基礎。

一般來說,自定義的動畫要考慮動畫的現實性和可信性。人們樂意接受自由的藝術創作,但是當動效不合理或者違反物理學時,用戶會感到困惑。例如,當你從屏幕頂部下滑拖出一個視圖的時候,你也要上滑將它收起,因為這么做可以幫助用戶記住這個視圖從何而來。如果你下滑到屏幕底部關閉這個視圖,用戶關于從屏幕上方呼起的心理模型就會被打破。

1.9 品牌推廣(Branding)

成功的品牌推廣不僅僅包括在應用中添加品牌元素。優秀的應用應該通過創建獨特的外觀和感覺來為用戶提供愉悅、難忘的體驗。

在iOS系統之下可以很容易地使用自定義的圖標、顏色和字體來創建區別于其他應用的UI。當你進行這些元素的設計時,牢記以下兩點:

每個自定義的元素本身都需要具備良好的觀感和功能性,但它也應該與應用中其他元素保持一致,無論應用中其他元素是自定義的還是標準的。
● 為了在iOS中感覺舒適,你的應用雖然不必看起來跟內置的一樣,但是需要對它的遵從、清晰度和深度(如欲了解更多,參見1 為iOS而設計(Design for iOS))進行整合。花些時間弄清楚在你的應用中遵從、清晰和深度所代表的意味,并把它們在你的自定義元素中表達出來。

當你需要讓用戶意識到你的品牌時,你應該遵循以下幾點:

以精致優雅不唐突的方式植入品牌元素。用戶使用你的應用來完成事務或者進行娛樂,他們不希望被強迫著去觀看廣告。為了獲得最好的用戶體驗,你可以通過字體、顏色和圖像的設計來潛移默化地地提醒用戶你的品牌身份。

44.png

避免遠離用戶關心的內容。不要像上圖中的反例那樣將僅有品牌意義的內容放在屏幕頂部二級欄上持續展示,使正文內容空間被壓縮,而是考慮以其他低侵入性的方法無處不在地展示品牌,如使用自定義顏色、字體,或巧妙地定制屏幕的背景。

抵抗住誘惑,不要把你的logo貫穿整個應用。移動設備的屏幕多數相當小,logo的每一次出現都會占據空間,從而將用戶與他們想看的內容隔離開。而且,在應用中顯示logo并不能像在網頁中顯示logo那樣達到相同的目的:對于用戶來說通常會很容易在不知道網頁所屬的情況下訪問一個網頁,但卻極少有用戶會在完全不看一個iOS系統中的應用圖標的情況下就打開它。

1.10 顏色與字體(Color and Typography)

1.10.1 色彩有助于增進溝通(Color Enhances Communication)

在iOS系統中,顏色會用于表明交互,傳遞活性以及提供視覺連續性。內置的應用程序選擇使用那些看起來更具個性的、純粹、干凈的顏色,并輔以或亮或暗的背景組合。

45.jpg

如果你要創建多樣的自定義顏色,要確保它們能夠和諧共存。例如,如果你的應用的基本風格是柔和的色調,你就應該創建一個協調的柔和色調的色板用于整個應用。

注意在不同情境下的顏色對比。例如,如果在導航欄的背景與欄按鈕標題之間沒有足夠的對比,按鈕就會很難被用戶看到。一個快速但不嚴謹的方法是通過將設備置于不同的光照環境之中(包括晴朗的室外)來測試設備上的顏色是否具有足夠的對比度。

雖然在設備上查看你的應用能夠在一定程度上幫助你找到需要調整的地方,但這仍代替不了能產生可靠結果的更科學客觀的方法。這種方法涉及到判定前景色和背景色的亮度值是否符合一定的比率。這個比率值可以通過在線對比度計算器或者根據WCAG2.0標準中提供的公式自己計算獲得。你應用中理想的顏色對比度應該是4.5:1或更高。

當你使用自定義的欄顏色時,著重考慮半透明的欄和應用內容。當你需要創建能匹配特別顏色的欄顏色時(比如一個已有品牌中的顏色),可能在你獲得你想要的結果之前,你需要用各種顏色進行實驗。欄的顯示將會同時受到iOS系統所提供的半透明欄與藏在欄后面的應用內容的呈現所影響。

API注:使用淺色(tintColor)的屬性值給予欄按鈕顏色,使用欄淺色(barTintColor)的屬性值為欄本身賦色。欲了解更多關于欄屬性的內容,可參見UINavigationBar Class Reference,,UITabBar Class Reference,UIToolbar Class Reference和 UISearchBar Class Reference.

注意顏色的盲區。多數色盲的人很難區分紅色與綠色。需要對你的應用進行測試以確保在其中你沒有將紅色與綠色作為區分兩個不同狀態或值的唯一方式,一些圖像編輯軟件或工具能夠有效的幫你驗證顏色的盲區。通常意義來說,使用多種方式來表征原色的交互性是非常好的(需要了解更多關于在iOS系統中表征交互性的信息,請參閱Interactive Elements Invite Touch)。

考慮選擇一種基準色顏色來表征交互性與狀態。內置的應用里的基準色包括比如備忘錄中的黃色,和日歷中的紅色等等。如果你定義一種用于表征交互和狀態的基準色,要確保你的應用中的其他顏色不會與它發生沖突。

避免給可交互和不可交互的元素使用相同的顏色。色彩是表明UI元素交互屬性的方式之一。如果可交互和不可交互的元素使用相同的顏色,用戶將會難以判斷哪些區域是可點的。

色彩可以向用戶傳達信息,但不一定會以你希望的方式。每個人眼中的色彩是不一樣的,不同的文化為色彩賦予的意義也是不相同的。花時間來研究如何使用色彩才可能會被其他國家或者文化接受。你要盡可能確定應用中運用的色彩向用戶傳達了恰當的信息。

大多數情況下,不能讓顏色喧賓奪主,讓用戶分心。除非色彩是應用的目的和本質所在,通常情況下色彩應該用來從細微細節之處提升用戶體驗。

1.10.2 優秀的排版提供清晰的傳達(Great Typography Enables Clear Communication)

Apple為全平臺設計了San Francisco字體以提供一種優雅的、一致的排版方式和閱讀體驗。在iOS 9及未來的版本中,San Francisco 是系統字體。

San Francisco搭配Dynamic Type,可以為您提供:

● 一系列的字號大小,在任何用戶設置,包括可訪問性設置下,可獲得優質的清晰度和極佳的閱讀體驗。
● 自動調整文字的粗細,字母間距以及行高的能力。
● 為語義上有區別的文本模塊指定不同的文本樣式,比如正文、腳注或者標題。
● 文本可以根據用戶在字號設置和可訪問性設置中指定字體大小的變化作出適當的響應的能力

下載San Francisco可訪問 https://developer.apple.com/fonts/.(注意:iOS9中的San Francisco字體取名為SF-UI)。當你在你的app中采用San Francisco時,你可以調整模擬器>設置中的值來測試在不同尺寸下你的app的文本。

注:如果你是用自定義字體,你仍然可以采用Dynamic Type或根據系統的字號設置來規劃字體范圍。當用戶改變設置時,你的應用也必須響應式的配合。如需了解如何使用文字樣式并確保當用戶改變文字型號設置時你的應用能夠獲取通知,可以參考Text Styles.

San Francisco 有兩類尺寸: 文本模式(Text)和 展示模式(Display)。 文本模式適用于小于20點(points)的尺寸,展示模式適用于大于20點(points)的尺寸。當你在你的app中使用San Francisco時,iOS會自動在適當的時機在文本模式和展示模式中切換。

注:如果你使用應用程序如Sketch或Photoshop來生成你的設計,那么當你設置的字體不小于20點的時候,你需要切換到展示模式。iOS會根據字體大小為San Francisco自動調整字間距。(字間距是以用作于修改文字間距)。表格10-1 和 10-2分別是文本模式(Text)和展示模式(Display) 在不同字號下的間距值。

46.jpg

47.jpg

為了突出某些文字或者為了在內容塊之間建立視覺關聯,你可以依賴由Dynamic Type支持的語義化樣式,如標題、正文,你也可以指定字體權重,如細體或者半粗。使用 Dynamic Type樣式使得你的內容能更好地表達含義,但如果你想要對你的設計有更好的把控能力,你可以對特定的文字設置特定的權重。(想要了解更多關于調整字體權重, 可以參閱UIFont Class Reference.)

例如,你可能想要增加某些文字的權重,來幫助用戶可視化你的內容的層次結構,或者把用戶的注意力吸引到特定的詞或短語。另外,你可以通過增加較小文字的權重和減小較大文字的權重,在多個不同字號的、相鄰的標簽中建立視覺凝聚。字體權重在內容的整體風格和表達中有重要影響,因此你可以選擇特定的權重來達到設計目的。

文本尺寸的響應式變化需要優先考慮內容。并不是所有的內容對于用戶都是同等重要的。當用戶選擇更大的文本尺寸時,他們是想要使他們關注的內容更容易閱讀;他們并不總是想要屏幕上的每個單詞都更大。

例如,當用戶選擇具備更大易用性的文本尺寸時,郵件將會以更大的尺寸顯示郵件的主題和內容,而對于那些沒那么重要的信息——如時間和收件人——則采用較小的尺寸。

48.jpg

確保一個自定義字體在不同尺寸下的所有類型都具備可讀性。實現這一效果的方法之一是效仿在不同的文本尺寸下iOS系統呈現字體樣式的一些方法。例如:

● 文本永遠都不應該小于11點(points),即使是用戶選擇極小的文本尺寸。相較而言,內容樣式使用17點的字號作為大尺寸,這也是默認的文本字號。
● 通常來說,字號與行距值在每一檔的文本尺寸設置中差別為1點。唯一例外的是兩種標題的樣式,它們在極小、小和中尺寸的設置中均使用相同的字號、行距和字距。
● 在最小的三種文本尺寸中,字間距相對較大;而在最大的三中文本尺寸中,字間距相對緊湊。
● 標題和內容的樣式使用相同的字體尺寸,同時,為了區分標題與內容樣式,標題樣式使用更重的值。
● 導航控制欄的文本使用相同的字號,而內容文本的樣式則使用大尺寸的設置(值為17點)。
● 文本總是使用常規或者中重,一般不適用輕或者加粗。

通常情況下,應用中整體應該使用單一字體。多種字體的混雜會使你的應用看上去支離破碎和草率。相反,使用一種字體和少數樣式。根據語義用途,使用UIFont類的API來定義不同文本區域的樣式,比如正文或者標題。

49.jpg

1.11 圖標和圖形(Icons and Graphics)

1.11.1 應用圖標(The App Icon)

每個應用都需要一個漂亮的圖標。用戶常常會在看到應用圖標的時候便建立起對應用的第一印象,并以此評判應用的品質、作用以及可靠性。

以下幾點是你在設計應用圖標時應當記住的。當你確定要開始設計時,請參考App Icon來獲取更詳細的設計規格與指導。(譯者注:App Icon處在iOS Human Interface Guidelines的Icon and Image Design部分,翻譯將在后續更新中放出,煩請各位耐心等候。)

● 應用圖標是整個應用品牌的重要組成部分。將圖標設計當成一個講述應用背后的故事,以及與用戶建立情感連接的機會。
● 最好的應用圖標是獨特的,整潔的,打動人心的,讓人印象深刻的。
● 一個好的應用圖標應該在不同的背景以及不同的規格下都同樣美觀。為了豐富大尺寸圖標的質感而添加的細節有可能讓圖標在小尺寸時變得不清晰。

1.11.2 小圖標(Small Icons)

iOS提供了一系列小的icon,用以代表各種常見任務與操作,它們常用在標簽欄(Tab Bar)、工具欄(Toolbars)與導航欄(Navigation Bar)中。用戶通常都已經了解這些內置圖標的含義了,因此可以盡可能的多使用它們。

50.jpg

如果需要自定義動作或者內容,你也可以設計自定義圖標。設計這些小的線性圖標與設計應用圖標有很大的區別,請參考Bar Button Icons來了解更多內容。(譯者注:Bar Button Icons章節處在iOS Human Interface Guidelines的Icon and Image Design部分,翻譯將在后續更新中放出,煩請各位耐心等候)

請注意,你有時候也可以用文字來代替工具欄和導航欄的圖標。 就像iOS的日歷里面,工具欄上便是使用”今天”,”日歷”和”收件箱”來代替圖標進行表意的。

51.jpg

想要決定在工具欄和導航欄中到底是用圖標還是文字,可以優先考慮一屏中最多會同時出現多少個圖標。同一屏幕中圖標的數量過多可能會讓整個應用看起來難以理解。使用圖標還是文字還取決于屏幕方向是橫向還是縱向,因為水平視圖下通常會擁有更多的空間,可以承載更多的文字。

1.11.3 圖形(Graphics)

iOS應用大多數圖形豐富。無論是你需要展示用戶的照片,還是需要創建自定義圖片,以下這些需求都應該遵守:

● 支持Retina顯示屏。確保你應用中的所有圖片資源都提供了高分辨率規格。尤其需要注意的是,iPhone 6 Plus需要提供@3x規格的圖片,而所有其他的高分辨率iOS設備都需要提供@2x規格的圖片。
● 顯示照片或圖片時請使用原始尺寸,并不要將它拉伸到大于100%。你不會希望在你的應用中看到拉伸和變形的圖片。可以讓用戶自己來選擇他們是否想要縮放圖片。

不要使用從蘋果系列產品中復制的圖形。這些圖形均受版權保護,而且產品的設計可能會頻繁改變。

不要將蘋果的應用圖標,圖像或者截圖用于你的設計中。所有蘋果的設計均受版權保護并且不允許出現在你的UI中,除非它們是由系統直接提供的。

1.12 術語和措辭(Terminology and Wording)

你在應用中呈現的每一個字都是與用戶進行對話的一部分。把握這樣的對話機會,為你的用戶提供清晰的表意與愉悅的體驗。

設置是面向全體用戶的一個基礎應用,因此它使用了簡明扼要的語言來描述用戶可以進行的操作。舉個例子,設置→勿擾模式(Do Not Disturb)就沒有使用難以理解的復雜技術術語,而是用了簡單的語言,給用戶描述了里頭的一系列操作。

52.jpg

保證你使用的術語是用戶能理解的。根據你對用戶群的理解來決定在應用中使用什么樣的詞匯。舉個例子,在一款針對小白用戶的應用中使用技術術語是不合適的,但對于針對高端用戶的應用來說,使用技術術語是很自然的事情。

使用非正式的友好語氣,但不需要太過卑微。避免太正式太僵化,或者太過嘻嘻哈哈,傲慢無禮。請記住,用戶可能會反復閱讀這些文本,因此有些起初看上去很俏皮的語句,多看幾次之后可能會顯得煩人。

像新聞編輯一般遣詞造句,避免不必要的冗余語句。當你的文案足夠簡明扼要,用戶就可以很輕松地閱讀和理解它。確定最重要的信息,精煉它并且突出它,讓用戶不需要讀一大段文字才能了解他們在找什么,以及下一步要做什么。

給控件加上短標簽或者容易理解的圖標。讓用戶只掃一眼就能知道這個控件是干什么的。

描述時間時要注意準確性。今天和明天這些詞匯確實顯得比較友好,但有時候會讓用戶費解,因為你可能沒有辦法確定用戶當前的時區和時間。舉個例子,假如有一項活動會在半夜12點前開始,對于在同一個時區的用戶而言,這個活動是在今天開始的,但對于那些在早一點的時區里的用戶而言,這個活動在昨天就已經開始了。

為你的應用寫一則漂亮的App Store描述,最大程度地把握住這個與潛在用戶溝通的絕佳機會。除了準確描述你的應用、強調應用的品質與亮點以外,你還需要:

● 修正所有的拼寫、語法與標點符號錯誤。這些小錯誤也許不會影響用戶正常使用,但是可能會讓他們對應用的整體品質產生負面印象。
● 盡量少用全大寫的詞匯。雖然大寫單詞有時候可以吸引注意力,但是全大寫的段落不適合閱讀,而且會產生一種朝用戶扯著嗓子吼的感覺。
● 可以描述bug修復情況。如果您的應用新版包含用戶一直期待的bug修復,那在你的軟件描述中提到這一點就是個很好的做法。

1.13 與iOS的整合(Integrating with iOS)

與iOS整合,指的是在當前平臺上給用戶提供一種舒適的、賓至如歸般的體驗,當然這并不意味著我們要把每一個應用做的和內置應用一模一樣。

最好的與iOS整合的方式便是深刻地了解iOS的主題與核心——這一部分在上文為iOS而設計(Designing for iOS)部分中已有詳細描述,并尋求出如何在你的應用中融合與表達這種主題。當你這么做的時候,遵循本章中的指引可以幫助你為你的用戶提供他們想要的體驗。

1.13.1 正確使用標準UI元素(Use Standard UI Elements Correctly)

盡可能使用UIkit提供的標準UI元素是一個好主意。多使用標準元素而非自定義元素,你與你的用戶都將受益:

● 標準UI元素會根據iOS官方的更新而自動更新——而自定義元素不會。
● 標準UI元素對于你自定義外觀和行為來說擁有優秀的擴展性。舉個例子,iOS中所有的視圖(Views,從UIView中繼承的對象)都是可以使用TintColor屬性來定義顏色的,它讓應用配色變得很簡單。
● 用戶更熟悉和習慣標準的元素,因為他們可以立刻明白你的應用中這些元素的用途。

想要充分地利用標準UI元素的優點,有一些關鍵點需要特別注意:

嚴格遵循每個UI元素的設計規范。當你應用中的UI元素的外觀與功能都是用戶所熟悉的,他們可以很容易地根據先前的經驗來使用他們,進而更好地使用你的應用。你可以從這些章節中找到各種UI元素的設計規范:Bars, Content Views, Controls, Temporary Views.

(譯者注:上文提到的章節均處在iOS Human Interface Guidelines的第4章,翻譯將在后續更新中放出,煩請各位耐心等候。若有需要,亦可先參考先前已翻譯的iOS7 UI Elements章節:上,下。)

不要混用不同版本的iOS里的UI元素。你一定不希望讓用戶覺得你的UI元素來自于與當前用戶的設備版本不同的iOS系統。

大體來說,請避免創造自定義UI元素來表現標準交互行為。先問問你自己為什么一定要創建一個與標準UI元素行為完全相同的自定義元素。如果你只是想改變標準UI元素的外觀,可以考慮使用UIKit外觀定制API(UIKit appearance customization APIs),或者給元素填充別的顏色。如果你需要定義一個與標準控件稍有不同的行為,請確保你在改變了這個UI元素的屬性和行為之后,這個元素仍然能完成你所希望的操作。如果你需要完全自定義一個行為,最好是設計一個與標準元素完全不相像的自定義元素。

提示:Interface Builder讓獲取標準UI元素,使用外觀定制API(the appearance customization APIs),獲取屬性,以及在你的應用里使用自定義和系統自帶圖標變得很簡單。想要了解更多Interface Builder的內容,請參閱Xcode Overview.

不要用系統自帶的按鈕和圖標表達其他含義。iOS提供了多種可用的按鈕和圖標。請確認你了解它們的準確表意;不要單純憑借你看到這些圖標樣式的猜測和理解來解讀和使用它們。(你可以在Toolbar and Navigation Bar ButtonsTab Bar Icons中了解到這些按鈕和圖標的準確含義。)

如果你所需要的功能無法用系統提供的按鈕和圖標來表現,你也可以設計自定義按鈕。自定義按鈕的設計可以參考 Bar Button Icons.

(譯者注:上文提到的章節均處在iOS Human Interface Guidelines的第4章,翻譯將在后續更新中放出,煩請各位耐心等候。若有需要,亦可先參考先前已翻譯的iOS7 UI Elements章節:上,下。)

如果你的app是沉浸式體驗,那么創造全新的自定義UI是合理的。因為你在創造一個統一的體驗環境,讓用戶在其中能夠有所期待并探索如何控制應用。

1.13.2 弱化文件和文檔處理(Downplay File and Document Handing)

iOS應用可以幫助用戶創建和處理文件,但這并不意味著用戶需要過分考慮iOS設備的文件系統如何運作。

如果你的應用中支持用戶創建和編輯文檔,那么提供一個清晰的圖形庫視圖(document library view)讓用戶能夠方便地打開或者新建文檔是一個好的做法。理想狀況下,這樣的圖形庫視圖擁有以下特征:

● 高度圖形化。用戶通過屏幕上的縮略圖就可以一目了然,快速找出自己想要的文件。
● 讓用戶用最少的動作完成自己的任務。比如說,用戶可以快速地水平滾動文件列表,然后輕點一下自己想要的文件來打開它。
● 包含新建文檔功能。一個圖形庫視圖應該支持讓用戶點擊一個新建文檔的占位圖便完成新建文檔操作,而不是讓用戶通過訪問別的地方來新建文檔。

舉個例子,Pages的圖形庫視圖里面,既展示了用戶已存在的文檔,也加入了便捷的新建文檔操作。

53.png

提示:你可以使用Quick Look Preview功能來讓用戶預覽你的應用中的文件,哪怕你的應用不能打開這些文件。想要了解如何在你的應用中提供這個功能,請參閱Quick Look.

如果你的應用允許用戶使用在其他應用中創建的文檔,你可以通過模態文檔選擇視圖控制器(modal document picker view controller)來幫助用戶觸達它們。這個控制器可以提取用戶在iCloud中的文檔,還可以通過文檔提供者擴展(Document Provider extensions)來提取在其它應用中創建和儲存的文件。想要了解更多文檔提供者擴展的內容,可以參考Document Provider Extensions; 想要了解更多文檔提取視圖控制器,請參考Document Picker Programming Guide.

給用戶足夠的信心,讓他們相信除非主動取消或者刪除,他們的成果會被隨時妥善保存。如果你的應用幫助用戶創建于管理文檔,不能要求用戶每次都能及時保存。無論是打開另一個文檔或切換應用的時候,iOS應用都應當承擔起幫助用戶保存輸入內容的責任。

如果你的應用的主要功能不是創造內容,但又允許用戶查看或編輯信息,這種情況下你需要詢問用戶是否要保存修改。在這種場景下,比較好的做法是提供“編輯”按鈕,點擊后進入編輯狀態,同時編輯按鈕變成“保存”和“取消”按鈕,這種變化可以提示用戶當前處于編輯模式。“保存”可以保留修改內容,“取消”則退出編輯模式。

1.13.3 必要時提供可配置選項(Be Configurable If Necessary)

某些應用需要用戶手動安裝或設置選項,但是大部分應用不需要如此。一個好的應用可以讓大部分用戶快速上手,并通過主界面給用戶提供便捷的調整體驗的方式。

當你的應用在默認狀態下就能滿足大部分用戶的期望,用戶對設置的需求就減少了。如果你需要儲存用戶的基本資料,可以優先向系統請求和拉取相關信息,而不是上來就讓用戶自己填寫它。如果你一定要提供用戶鮮少用到的設置項,請參考App Programming Guide for iOS中的The Setting Bundle部分來了解如何在代碼中定義它們。

盡可能在主UI中提供設置選項。如果這個設置項代表著用戶一個基本任務,又或者用戶在進行主線任務時有可能頻繁改變設置,那么將設置項放在主UI中會很方便。如果用戶只是偶爾才會用到設置項,那么可以將其放在獨立的視圖中。

如果應用內相關設置需要在系統設置中改變,幫助用戶直接訪問系統設置。尤其是,如果你要用一段文字來描述如何改變這個設置,比如“設置>隱私>定位服務”,倒不如直接放置一個按鈕,點擊后即可到達設置中的定位服務。想要了解如何實現,請參考 Settings Launch URL.

1.13.4 充分利用iOS技術(Take Advantage of iOS Technologies)

iOS提供了豐富的技術方式來支持用戶完成他們所期望的各種任務和場景。這意味著在絕大多數情況下,將系統提供的技術整合到你的應用中,往往比自定義一種新的技術更為可靠。

某些iOS技術,比如多任務并行(Multitasking)與語音向導(VoiceOver)等等,是所有應用都應該包含的系統級特性。而另外一些技術是否整合到應用中,則取決于應用本身的功能性。比如處理門票和禮品卡的應用(Wallet)支持用戶在應用內內購(In-App Purchase),展示應用內置廣告(iAd Rich Media Ads)則可以整合 Game Center,同時支持iCloud.

本章英文原文訪問地址:iOS Human Interface Guidelines
本章中文翻譯PDF下載:點此下載

iOS 9人機界面指南(一):UI設計基礎(上)

本文系作者授權數英發表,內容為作者獨立觀點,不代表數英立場。
轉載請在文章開頭和結尾顯眼處標注:作者、出處和鏈接。不按規范轉載侵權必究。
本文系作者授權數英發表,內容為作者獨立觀點,不代表數英立場。
未經授權嚴禁轉載,授權事宜請聯系作者本人,侵權必究。
本內容為作者獨立觀點,不代表數英立場。
本文禁止轉載,侵權必究。
本文系數英原創,未經允許不得轉載。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權,侵權必究。

    評論

    文明發言,無意義評論將很快被刪除,異常行為可能被禁言
    DIGITALING
    登錄后參與評論

    評論

    文明發言,無意義評論將很快被刪除,異常行為可能被禁言
    800

    推薦評論

    暫無評論哦,快來評論一下吧!

    全部評論(0條)

    主站蜘蛛池模板: 义马市| 温州市| 新密市| 东明县| 潮安县| 陵川县| 浦县| 淳化县| 房产| 巴林右旗| 株洲市| 阜新市| 获嘉县| 沁源县| 河源市| 涿州市| 崇阳县| 磴口县| 佛坪县| 皋兰县| 梧州市| 台江县| 会昌县| 徐州市| 房产| 汉川市| 龙江县| 栾川县| 屏东县| 景东| 屏边| 宁明县| 华亭县| 桂林市| 道孚县| 宜丰县| 炎陵县| 罗平县| 兴隆县| 怀远县| 德保县|