1. 程式人生 > >值得向iOS學習的15個APP設計技巧

值得向iOS學習的15個APP設計技巧

結合 減少 控件 系統設置 用戶信息 接下來 通知 保持 不同版本

iOS設計規範再閱讀

對比Google Material Design的設計規範,iOS有些大道至簡的味道,內容很少,但還是從中總(chao ) 結 ( xi ) 了一些設計技 ( tao)巧 ( lu )。

1、如何以內容為中心開發或重新設計一款應用?

? 保證核心功能突出且直接,並強調其相關性

? 直接使用iOS UIKit,給用戶統一視覺感受

? 保證UI在各種設備與操作間的適配


2、如何提升應用功能體驗並關註內容本身

? 充滿整個屏幕

? 減少視覺修飾與擬物化設計,擬物化的面板漸變及陰影使UI變得厚重,搶內容

? 使用半透明底板,半透明能使用戶看到更多的內容,並起到短暫的提示作用

? 保證應用清晰度

3、如何提升應用的清晰度?

? 使用大量留白,留白使內容和功能醒目,並傳達一種寧靜安詳的視覺感受,更好的讓用戶聚焦和高效交互

? 用顏色簡化UI,讓重點突出並巧妙的表示交互性

? 使用系統字體確保易讀性

? 使用無邊框的按鈕,默認下,所有bar上的按鈕都是無邊框的,在內容區域無邊框按鈕以文案、顏色及操作指引標題來傳 達按鈕功能,按鈕激活時高亮。

? 使用布局來溝通,布局包含的不僅是UI外觀,應該告訴用戶什麽是最重要的 ,他們的選擇是什麽,以及事物是如何關聯起來的,提升重要內容和功能,讓用戶容易集中註意在主要任務上

4、如何使用布局來提升應用重要內容和功能?

? 上半部分放置主要內容,以從左到右的習慣,從靠左側的屏幕開始

? 使用視覺的重量和平衡向用戶展示相關屏顯重要元素(大型控件吸引眼球,比小控件更容易在出現時被註意到。而且大型控件更容易被點擊)

? 使用對齊來讓閱讀更舒適,讓分組和層次之間更有秩序對齊讓應用整潔有序,也讓用戶在專註屏幕時更有空間,從而專註於重要信息,不同信息組的縮進與對齊讓它們之間的關聯更清晰,也讓用戶更容易找到某個控件

? 確保用戶明白處於默認尺寸和首要內容的含義例如,用戶無需水平滾動就能看到重要的文本,或不用放大就可以看到主體圖像

? 準備好改變字體大小(為了適應一些文本的大小變化,你需要調整布局)

? 盡量避免UI上不一致的表現(有著相似功能的控件看起來應該相似,用戶總是認為他們看到的不同總是有原因,而且他們傾向於花時間嘗試)

? 給每個互動元素充足空間,從而讓用戶容易操作這些內容和控件,常用的點按類控件的大小是44X44

5、如何提升軟件啟動時的體驗?

? 避免使用閃屏或者其他啟動體驗

? 用戶能夠在啟動後立即開始使用應用是最好的事情

? 避免讓用戶做過多設置

? 聚焦在滿足80%的用戶需求上,這樣主體用戶群就無需設置各種選項,因為你的應用已經默認處於他們想要的狀態,如果有些功能有少部分用戶想要,換句話,大部分用戶不需要的話,就別管他了

? 盡可能用其他方式獲取更多(用戶)信息,直接從系統中獲取減少用戶輸入
如果必須設置信息,在你的應用中直接向用戶詢問,並盡快保存這些設定,這樣用戶就無需強制跳出應用進入系統設置頁面了。如果用戶需要更改設置,他們可以在任何時候進入應用的設置選項進行修改

? 盡可能讓用戶晚一些登錄
理想狀態是,用戶在無需登錄的情況下盡可能多地瀏覽並使用部分內容

? 若必須先登錄後使用,那麽應該在登錄頁面描述為什麽必須先登錄,以及這樣對用戶的好處

? 謹慎使用新手引導在,使用新手應用前,盡可能使應用的功能直觀和易於尋找

? 若有請簡潔有針對性並且不妨礙用戶

6、如何設計新手引導?

  “好的應用不需要新手引導”

? 只提供開始使用應用所必需的信息

? 好的新手應用應該告訴用戶接下來第一步應該做什麽,在瀏覽你的應用之前,用戶遇到太多信息,讓用戶記住這些不是當前必須得內容,他們很可能會覺得你的應用難用,如果在某些特定場景下確實需要一些引導,那麽應該在用戶進入該場景後進行

? 用交互動畫吸引用戶,謹慎增加文字,不要指望用戶會閱讀大段文字,並謹慎使用應用截圖,因為應用截圖是死的,用戶可能會混淆截圖和應用的實際界限

? 能讓用戶簡單地取消和跳過新手引導

7、何種情況使用模態情景?

  不脫離主任務,去完成一個子任務或者獲得信息的方式在iOS中被稱為模態情境,模態情景會臨時性阻止用戶對應用其他部分的交互操作,理想情況下用戶與應用進行一種非線性交互,所以盡量減少應用中模態體驗

? 必須引起用戶關註的時候

? 一個獨立任務需要完成或者很明顯被放棄,為了避免在模棱兩可的狀態下遺漏用戶信息的時候

8、如何設計模態情景?

? 保持模態任務的簡單、簡短和高度聚焦。如果子任務過於復雜,用戶會在進入模態情景時忽略主要任務,在設計一個涉及視覺層次的模態任務時要特別考慮這點,因為用戶有可能迷失並且忘記如何回到之前的操作中去。如果一個模態任務包含不同視圖的子任務,確保給用戶一個獨立,清晰的導航路徑,並避免迂回

? 始終提供明顯、安全的途徑退出模態任務確保用戶在退出模態視圖時可以預期操作結果

? 一個任務需要多層級的模態視圖時,確保用戶理解點擊完成按鈕的結果點擊一個低層級視圖上的完成按鈕是完成這個視圖中任務的一部分,還是整個任務?因為存在這種疑惑的可能性,所以盡可能避免在下級視圖中添加完成按鈕

? 保證提醒對話框的內容都是重要且可操作的提醒對話框會打斷用戶的體驗並且要點擊才會消失,所以要讓用戶感到提醒信息是有用的,打斷是有價值的

? 尊重用戶關於接受通知的選擇用戶會設置接收,應用通知的形式,必須尊重用戶的喜好設置,否則可能觸怒用戶,導致其關閉所有的推送通知

9、如何提升交互性和反饋體驗?

? 對於用戶熟悉的標準手勢不要賦予不同的行為,除非是遊戲

? 不要創建和標準手勢功能相似的手勢操作用戶已經習慣標準手勢操作,沒有必要讓用戶學習達到同樣效果的不同操作

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

? 除非是遊戲,否則避免定義新手勢

? 在特定的環境中,可以考慮使用多指操作雖然復雜的操作不一定適用於所有應用,但對用戶會花大量時間使用的應用來說可以豐富體驗,例如遊戲

10、如何利用交互元素吸引用戶點擊?

? 暗示交互性,設計時可以使用很多線索。包括顏色、位置、上下文、表意明確地圖標和標簽。並不需要過於修飾元素向用戶展示可交互性

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

? 返回按鈕使用多個線索指明其可交互性並傳達其功能出現在導航中、顯示一個指向後方的圖標、使用了關鍵色、顯示了上一級頁面的標題

? 一個圖標或者標題提供了清晰的名稱指引用戶點擊它。例如,地圖中的標題“立交橋路線”、“定位到這裏”,清楚地說明了用戶可做的操作。結合關鍵色,可以省去按鈕邊界或者其他多余的修飾

? 在內容區域,有必要給按鈕添加邊界或背景

? 操作條中的按鈕、動作表單和提醒對話框可以不需要邊界,因為用戶知道在這種區域中大多數選項是可交互的。但是在內容區域,按鈕有必要使用邊界或背景將按鈕從其他內容中區分出來

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

11、如何設計有助於理解的反饋?

反饋會幫助用戶了解應用當前在做什麽,發現接下來可以做什麽以及理解動作產生的結果

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

? 避免顯示不必要的警告框。警告框是一種很強的反饋機制,只能在傳遞非常重要也是理論上可行的信息時才需要使用它,如果用戶常看到很多不是重要信息的警告框,他們很開就會忽略所有對話框提醒

12、在進行自定義圖標、顏色和字體,以及創建區別於其他應用的UI設計時,牢記以下幾點?

? 每個自定義的元素本身都具備良好的觀感和功能性,但也應該和與應用中其他元素保持一致無論應用中其他元素是自定義還是標準的

? 為了在ios中感覺舒適,你的應用雖然不必看起來和內置一樣,但是需要對它的遵從、清晰度和深度進行整合。花些時間弄清楚在你的應用中,遵從清晰和深度代表的異味,並把它們在你的自定義元素中表達出來

13、如何讓用戶意識到你的品牌?

  理想狀態下,你開發的某個特定品牌的應用應該通過創建獨特外觀和感覺來為用戶提供難忘的體驗

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

? 避免遠離用戶關心的內容考慮用低侵入性的方法無處不在地展示品牌,比如巧妙地定制屏幕背景

? 抵擋住誘惑,不要把你的logo貫穿整個應用對於用戶來說通常會很容易在不知道網頁所屬的情況下訪問一個網頁,但卻極少有用戶會在完全不看一個iOS系統中得應用圖標的情況下打開它

14、如何設計應用圖標?

? 將圖標設計當成一個講述應用背後的故事,以及與用戶建立情感連接的機會

? 圖標應該獨特、簡潔、打動人心、讓人印象深刻

? 圖標應該在不同的背景以及不用的規格下都同樣美觀。為了豐富大尺寸圖標的質感而添加的細節有可能讓圖標在小尺寸時變得不清楚

15、如何正確使用標準UI元素?

? 盡可能使用UIkit提供的標準UI元素,多使用標準元素而非自定義元素

? 嚴格遵循每個UI元素的設計規範,當你應用中UI元素的外觀與功能都是用戶所熟悉的,他們可以很容易的根據先前的經驗使用它,進而更好的使用你的應用

? 不要混用不同版本iOS裏的UI元素

? 請避免創造自定義UI元素來表現標準交互行為

? 不要用系統自帶的按鈕和元素表達其他含義

? 如果你的應用是沈浸式體驗,那麽創造全新的自定義UI是合理的

終於寫(chao)完了,好累 - -

來源:http://www.ui.cn/detail/43821.html

值得向iOS學習的15個APP設計技巧