自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

iOS 7人機交互指南-UI設(shè)計基礎(chǔ):整合iOS系統(tǒng)

移動開發(fā) iOS
本文為大家介紹了iOS 7人機交互指南UI設(shè)計基礎(chǔ)的Integrating with iOS(整合iOS系統(tǒng)):使用標準UI元素;對設(shè)備使用方向(橫屏和豎屏)做出相應(yīng);弱化對文件和文檔的處理;如果需要,可提供app的設(shè)置選項。希望對大家有所幫助。

使用標準的UI元素

盡可能使用UIKit框架提供的標準UI元素,這樣用戶和開發(fā)者都能從中獲益:

對開發(fā)者而言,如果iOS進行了重新設(shè)計,那么標準的UI元素能夠在系統(tǒng)更新時自行更新,而自定義的元素則不會。

對用戶而言,標準的UI元素會讓他們覺得很舒服,這樣他們可以立即理解如何在應(yīng)用中使用這些標準的UI元素。

為了好好利用這些標準的UI元素,需注意以下至關(guān)重要的幾點:

遵循每個UI元素的使用指南。當UI元素的外觀、運行方式和用戶期望的一樣時,他們可依據(jù)此前的經(jīng)驗在你的app使用這些元素。你可以在Bars,Content ViewsControls以及Temporary Views中找到UI元素使用指南。

一般來說,不要使用自定義UI控件來執(zhí)行一個標準的交互操作。首先,要問問自己為什么要創(chuàng)建一個交互行為方 式與標準元素一致的自定義UI元素。如果你僅僅是想要一個自定義的外觀,那可以考慮通過使用UIKit框架的外觀自定義API來改變標準UI元素的外觀, 或者改變元素的色調(diào)。如果你想要一個略有不同的UI控件交互行為,那首先要確保通過對標準元素的調(diào)整可以達到你想要的效果。如果你想要一個完完全全的自定 義UI,那么***是設(shè)計一個和標準元素看起來很不一樣的自定義元素。

TIP:Interface Builder可以幫你簡單地創(chuàng)建標準的UI元素,使用外觀自定義API,設(shè)置屬性,并在控件中添加自定義圖標或者系統(tǒng)提供的圖標。關(guān)于Interface Builder更多詳情,可以查看Xcode 用戶指南

不要使用系統(tǒng)定義的按鈕和圖標來表達其他一些含義。你可以在應(yīng)用中使用iOS 提供的按鈕和圖標。要確保你已理解了相關(guān)文檔,理解了按鈕和圖標使用的語義環(huán)境,不要簡單依賴你對按鈕和圖標外觀的理解和看法。

如果系統(tǒng)沒有提供適當?shù)陌粹o或者圖標來準確地傳達app的功能,那么你可以自行創(chuàng)建一個。Bar Button Icons這一章節(jié)可以幫你更好地設(shè)計自定義圖標。

如果你的app能提供沉浸式的任務(wù)或體驗,那么創(chuàng)建完全自定義的控件就可能是合理的做法。因為你正在創(chuàng)建一種***的環(huán)境,并且知道如何在這類app中管理用戶體驗所期待的環(huán)境。

對設(shè)備使用方向(橫屏和豎屏)做出相應(yīng)

用戶一般期望在橫屏和豎屏模式下都能使用設(shè)備,所以你的app***能做出響應(yīng)。

不管設(shè)備處于什么方向,首先都要維持對主要內(nèi)容的聚焦和關(guān)注。用戶使用你的app來瀏覽他們關(guān)心的內(nèi)容或者與內(nèi)容進行交互。移動設(shè)備旋轉(zhuǎn)后,改變用戶的視覺焦點可能會讓他們倍感迷惑,并產(chǎn)生對app失控的感覺。

一般情況下,要讓app支持橫屏和豎屏兩種模式。用戶期望在任何模式下都能使用你的app,***能滿足用戶的要求,尤其是iPad用戶。不過,也有一些app只有橫屏或豎屏運行方式。如果你的app只能在一個方向(橫屏或豎屏)運行,你應(yīng)該:

1.不管設(shè)備處于橫屏模式還是豎屏模式,都要以應(yīng)用支持的方向啟動。比如,如果游戲app或者視頻觀看類app只能以橫屏模式運行,以橫屏模式啟動app是合乎情理的,即便當前設(shè)備處于豎屏模式。這樣即便用戶以豎屏模式啟動app,他們也知道把設(shè)備旋轉(zhuǎn)至橫屏模式。

2.避免用UI元素告知用戶需旋轉(zhuǎn)設(shè)備。以app支持的方向運行已經(jīng)清楚地告訴用戶需要旋轉(zhuǎn)設(shè)備,不需要增加多余雜亂的UI元素。

3.支持橫屏和豎屏兩種模式。比如,如果app僅支持橫屏模式,不管Home鍵在左還是在右,用戶應(yīng)該都會使用它。如果用戶把設(shè)備旋轉(zhuǎn)180度,那么app***也能作出旋轉(zhuǎn)180度的響應(yīng)。

如果旋轉(zhuǎn)設(shè)備持有方向是用戶“輸入”(或者行為輸入)的一部分,那么你可以以APP獨有的方式處理。比如, 一款游戲可以讓用戶通過旋轉(zhuǎn)設(shè)備來移動游戲塊,那么這款游戲就不能再對設(shè)備方向旋轉(zhuǎn)進行相應(yīng)。這種情況下,在用戶進入游戲的主任務(wù)之前,你的游戲應(yīng)當支持 橫屏和豎屏兩種模式,允許用戶在兩者之間進行選擇。在用戶開始應(yīng)用的主任務(wù)后,你可以以app“特有”的方式來相應(yīng)設(shè)備方向的更改(此處特有的方式指的是 旋轉(zhuǎn)設(shè)備來進行特定的游戲操作)。

在iPhone上,對設(shè)備方向更改進行相應(yīng)的同時也要預(yù)測用戶的需求所在。用戶從豎屏模式旋轉(zhuǎn)為橫屏模式,通常是想要查看“更多內(nèi)容”。僅按比例縮放內(nèi)容會難以滿足用戶心理期望。相反應(yīng)該重新設(shè)計文本的行數(shù),需要的話,也得更改一些UI元素的布局,這樣用戶才能在屏幕上看到更多內(nèi)容。

在iPad上,app要盡量支持所有的方向,努力滿足用戶的需求。iPad更大的屏幕降低了用戶旋轉(zhuǎn)設(shè)備以 “查看更多”內(nèi)容的欲望。用戶并不十分關(guān)心設(shè)備的框架或者Home鍵的位置,因此他們不認為設(shè)備應(yīng)該有一個默認的方向。不管設(shè)備處于什么方向,你的app 應(yīng)該能為用戶提供良好的用戶體驗,應(yīng)該盡可能地鼓勵用戶從不同方向(橫屏或豎屏)與iPad進行交互。

以下是iPad app設(shè)計相關(guān)的幾點規(guī)范:

1.考慮設(shè)備方向改變時如何展示輔助信息和功能。雖然重要內(nèi)容是視覺的焦點,但你也可以通過對設(shè)備方向更改的響應(yīng)來展示次要功能和內(nèi)容。

比如iPad上的Mail應(yīng)用,賬戶和郵箱列表屬于次要內(nèi)容(選中信息是主要內(nèi)容)。橫屏模式下,次要內(nèi)容展示在左側(cè)面板;而豎屏模式下,次要內(nèi)容展現(xiàn)在彈出面板中。

還有個例子,一款iPad游戲以橫屏模式展示了一個矩形游戲棋盤。在豎屏模式下,棋盤頂部和底部多出了一些空間,那么這款游戲就需要重新設(shè)計以適應(yīng)豎屏顯示模式。不是簡單地拉伸棋盤,而要展現(xiàn)補充信息來填充額外的空間。

2.避免無端地改變布局。如果可能的話,不管設(shè) 備處于橫屏模式還是豎屏模式,都要為用戶提供始終如一的用戶體驗。這樣當設(shè)備旋轉(zhuǎn)時,相似的使用體驗可以讓用戶維持一貫的使用模式。比如,你的iPad app在橫屏模式下以網(wǎng)格的形式展示圖片,那么在豎屏模式下,就沒必要以列表的形式展示相同的信息。

3.可能的話,在設(shè)備方向旋轉(zhuǎn)的情況下,盡量避免重新定義信息內(nèi)容和重新設(shè)計文本。不管設(shè)備處于什么方向,應(yīng)用都應(yīng)該維持相似的信息格式。如果用戶在閱讀文本,他們旋轉(zhuǎn)設(shè)備后,要避免用戶因離開原先閱讀的位置而感到迷惑。如果應(yīng)用內(nèi)容格式 更改是不可避免的,要用動畫來幫助用戶明白其中的改變。比如設(shè)備在橫屏和豎屏模式之間進行了切換,你必須增加或者刪除一些文字,這時候你可以考慮使用淡入 和淡出的動畫效果。為了設(shè)計出適當?shù)臋M屏豎屏方案,你可以思考下,在現(xiàn)實世界中你期望如何與內(nèi)容進行物理性的交互。

4.為app橫屏和豎屏模式各自設(shè)計一個***的啟動頁。不管當前設(shè)備處于什么方向,一個平滑運行的***的啟動頁可以讓用戶忽略設(shè)備當前的方向。與iPhone主屏形成了一個對比,iPad主屏支持橫屏和豎屏兩個模式,所以如果用戶剛從其他app中退出來,那么他會喜歡以上個app的使用方式啟動你的app。

弱化對文件和文檔的處理

iOS app可幫用戶創(chuàng)建和管理文件,但這并不意味著用戶不得不考慮iOS 設(shè)備上的文件系統(tǒng)。

在iOS app中,沒有一個類似OS X系統(tǒng)中的Finder,用戶不應(yīng)該被要求與文件進行交互,不應(yīng)該面對任何讓他們想到文件元數(shù)據(jù)或者儲存位置之類的信息。比如:

1.一個會暴露文件層級的打開或保存文件的對話框。

2.關(guān)于文件權(quán)限狀態(tài)的信息

盡量允許用戶在不需要打開電腦iTunes的情況下管理文檔。考慮使用iCloud來幫助用戶訪問他們所有設(shè)備上的內(nèi)容。App如何為用戶提供優(yōu)秀的iCould體驗?可參考iCould一節(jié)。

如果你的應(yīng)用幫助用戶創(chuàng)建和編輯文檔,那么可以嘗試提供某種文檔選擇器,來幫用戶打開現(xiàn)有文檔或創(chuàng)建新文檔。理想情況下,文檔選擇器應(yīng)該:

1.具有高質(zhì)量的圖形外觀。用戶應(yīng)該可以簡單地通過屏幕上文檔的可視化形式來識別出他們想要的文檔。

2.讓用戶使用最少的手勢來做他們想做的。比如用戶可能通過橫屏滾動或者網(wǎng)格的形式來操作文檔,并通過點擊來打開文檔。

3.提供新建文檔動能。文檔選擇器允許用戶點擊圖片占位符來創(chuàng)建新文檔,而不是讓用戶去某個地方創(chuàng)建新文檔。

TIP:你可以使用Quick Look預(yù)覽功能讓用戶在你的應(yīng)用中預(yù)覽文檔,即便你的app不支持打開文檔。如何在應(yīng)用中提供該功能呢?可參考Quick Look一節(jié)。

給用戶一種安全感,讓他們知道自己的工作進程始終會被保存,除非他們準確地執(zhí)行取消或者刪除。如果你的應(yīng)用為用戶提供創(chuàng)建和編輯文檔的功能,要讓用戶知道無需他們自己動手執(zhí)行保存。iOS app應(yīng)該承擔(dān)保存用戶輸入內(nèi)容的責(zé)任,無論是在他們打開一個不同的文檔時,或者與其他app進行切換時,app都能保存他們的輸入內(nèi)容。

如果你應(yīng)用的主要功能不是創(chuàng)造內(nèi)容,但你允許用戶在查看信息與編輯信息之間進行切換,那么這時候你可以要求用戶對信息變更進行保存。

這種情況下,在展示信息的視圖中提供一個編輯按鈕。當用戶點擊編輯按鈕進入編輯狀態(tài)后,你可以使用一個保存按鈕來替代編輯按鈕,并增加一個取消 按鈕。編輯按鈕的變化可以提醒用戶處于編輯狀態(tài),可能需要對內(nèi)容進行保存,而取消按鈕則為用戶提供了不保存內(nèi)容變更的情況下推出編輯狀態(tài)的選擇。

這種變化可以提醒人們,他們現(xiàn)在正處于編輯模式,可能需要執(zhí)行保存操作,而“取消”按鈕則為他們提供了在不保存變更的情況下直接退出編輯模式的出口。

如果需要,可提供app的設(shè)置選項

有些app可能需要為用戶提供配置或設(shè)置的選項,但是大多數(shù)app不需要這樣的設(shè)計,或者可以延遲對這個環(huán)節(jié)的設(shè)置。成功的app可以讓用戶快速上手,或者在主要的UI中提供一些可調(diào)整的方法。

可能的話,避免把用戶引導(dǎo)至“設(shè)置”需求中。很重要的一點,用戶必須首先離開你額應(yīng)用才能打開“Settings app”,你也不想鼓勵用戶這么做。

當你能按照大多數(shù)用戶期望的那樣來設(shè)計app,你也就降低了用戶設(shè)置app的需求。如果你需要用戶的某些信息,可先查詢系統(tǒng)儲存的用戶信息,而不是首先要求用戶為你提供。如果你確定你必須在iOS app中提供相關(guān)設(shè)置,可查看iOS app編程指南的“The Settings Bundle”一節(jié)。

如果需要,盡量讓用戶在你的app中進行操作。在app中集成配置選項可以讓變化同步表現(xiàn)出來,這樣用戶不需要離開你的app就能進行相關(guān)設(shè)置。

如果需要,盡量在主要的UI中提供設(shè)置選項。如果主要UI代表著主要任務(wù),或者是用戶可能會頻繁地更改設(shè)置,這些情況下,把設(shè)置選項放在主要UI中就非常有意義了。如果用戶只是偶爾改變下app的設(shè)置,那就把它們放在單獨的視圖中。

責(zé)任編輯:閆佳明 來源: cocoachina
相關(guān)推薦

2013-07-03 14:48:25

iOS 7人機交互iOS 7 UI設(shè)計Navigation

2013-07-03 15:29:45

iOS 7人機交互iOS 7 UI設(shè)計Interactivi

2013-06-17 16:12:23

iOS 7人機交互UI設(shè)計基礎(chǔ)

2013-07-03 16:36:35

iOS 7人機交互UI設(shè)計Animation動畫

2013-07-03 14:44:24

iOS 7人機交互iOS 7 UI設(shè)計Layout

2013-07-03 16:58:36

iOS 7人機交互UI設(shè)計Icons

2013-07-03 15:03:46

iOS 7人機交互iOS 7 UI設(shè)計Modal Conte

2013-07-03 13:34:57

iOS 7人機交互iOS 7 UI設(shè)計App Anatomy

2013-07-03 15:39:58

iOS 7人機交互UI設(shè)計Terminology

2013-07-03 17:04:12

iOS 7人機交互UI設(shè)計基礎(chǔ)Branding品牌化

2013-07-03 16:52:24

iOS 7人機交互UI設(shè)計基礎(chǔ)文字和色彩

2013-07-03 14:26:19

iOS 7人機交互iOS 7 UI設(shè)計iOS設(shè)計師

2013-06-24 11:01:30

IT技術(shù)周刊

2011-03-02 08:35:19

人機交互界面iOS

2015-11-04 09:54:34

ios9人機界面ui

2021-08-17 10:54:57

AI 數(shù)據(jù)人工智能

2021-08-17 09:54:05

人機交互交互模型國際主流

2013-02-28 15:22:44

iOS人機交互

2010-04-20 09:08:36

2020-12-08 09:12:22

人機交互智能
點贊
收藏

51CTO技術(shù)棧公眾號