iOS Human Interface Guidelines 閱讀心得 ～ 彼得潘的 iOS App 作業
這真的是一份難以置信的 UI/UX 設計指導方針啊啊啊！！
一、閱讀前的心理建設與準備
恩恩～很好！整份文件是全英文！🤭😳😅
天啊！對一個英文不太好的人來說！真的是一個很大的挑戰！
還好後來有找到好心人士分享的翻譯文章！
那份中文版是iOS 12，目前官網已經是iOS 13，所以有部分新增內容。
但還是決定先看英文版，不懂的地方就Google和查閱那份中文版。
提供相關連結給有需要的朋友參考查閱：
Human Interface Guidelines
iOS 12 人機互動指南（總結篇）
Human Interface Guidelines（HIG）是蘋果公司為其裝置的作業系統，提供操作界面開發的人機互動指南，在閱讀過程中也有查看其他相關文章，發現HIG根本就是為了iOS、macOS、tvOS、watchOS的開發者精心設計的！因為蘋果很清楚知道一件事，就是大部分的開發者應該都和我一樣，沒有設計相關經驗或背景…Orz
所以這份人機互動指南真的對我幫助很大，雖然內容真的很多，很多地方都還不太懂，但透過持續學習與請教有經驗的朋友，相信會慢慢熟悉HIG所建議與提醒的事項；我想除非本身是設計相關轉型或是產品經理，才會一開始就具備UI/UX的基礎知識和經驗，當然～更不用說本身就是UI/UX工程師轉型或是雙修的朋友，相信閱讀HIG應該會更快上手。（這時候要趕快找設計師朋友的大腿來抱了！）😆😍
Human Interface Guidelines 就是關於開發過程的建議與參考準則，同時涵蓋UI (User Interface)和UX (User Experience)，這部分對我來說是完全沒概念的，所以查詢了相關資料，以下關於UI/UX 的文章與連結，雖然是以使用者與電腦間的人機互動做為該文的撰寫依據，但整體內容和觀念都和HIG所要傳達的理念是一致的，有興趣的朋友可以自行參考閱讀。
UX (User Experience)
全名為使用者經驗，強調的是「使用者體驗的過程」。使用者體驗，是根據使用者的習慣，安排整個網站頁面的內容規劃，像是哪些區塊的內容要先在網站上出現，哪些按鈕一定要在哪，重大責任就是要確保產品從這一步流動到下一步符合邏輯。要辦到這點，UX 設計師用的其中一個方法就是實施真人測試，觀察使用者行為，檢查說得出來和沒說出來的使用障礙，經過不斷修改以創造出「最棒的」使用者經驗。例如說創造一個舒服的入門流程給使用者。
UI (User Interface)
全名為使用者介面，設計頁面上的功能，顧及使用的便利性與整個設計的美學，維持並創造網站的美觀性。使用者介面設計師專精於「產品怎麼呈現」。他們負責設計每一個與使用者互動的網頁或畫面，然後確認 UI 在視覺上能傳達 UX 設計師展示的路徑。UI可以是將UX理念實踐的美學工程師，包括整個網站的顏色、字型、字體大小、配置安排。使用者與電腦之間進行溝通的介面，利用電腦的功能去「輸入」來達成「輸出」的成果，而輸入與輸出的規劃就是介面，透過介面來操作電腦完成所需。
還是覺得很模糊的話，說穿了，簡而言之，UX是大腦所想的，UI是眼睛所看見的，UX設計師設計的是一個「產品的使用感覺」，而UI設計師設計的是一個「產品的呈現」。
UX/UI傻傻分不清楚？其實差很多！
https://gremlinworks.com.tw/ui-ux/ui-ux-comparison/
UI UX設計是什麼？用9個提高網站轉換率的方法告訴你
https://transbiz.com.tw/ui-ux-design-difference/
二、iOS Human Interface Guidelines
第一章：主題與基本介面元素
主要分為三大設計原則和六大基本特性，還有三大基本介面元素。
其中還有一項是關於Mac Catalyst，當您使用Mac Catalyst創建Mac版本的iPad應用程序時，您可以將應用程序提供給新的使用者，同時讓現有用戶有機會在新的環境中享受它。這部分比較偏Mac和Ipad的新資訊，我的能力現階段還無法完全理解，未來有機會再將這部分資訊補齊，謝謝。
三大設計原則：
清晰(Clarity)、遵從(Deference)、深度(Depth)
- 所謂清晰，意味著所有表現層面的文字、圖示、影象等均是清晰易懂的，且應該是本著功能驅動設計的原則，最終能達到可以巧妙的突出重點內容且表達其不同的可互動性。
- 而遵從，更強調的是通過乾淨美觀的介面和清晰流暢的動態效果，去幫助使用者更好的理解介面內容並與之進行互動。
- 最後所謂的深度，其實想表達的一方面是單頁面中視覺層面的層級，另一方面則是整體應用不同頁面間的互動層面上的層級。
六大基本特性：
美學完整性(Aesthetic Integrity)、直接操作性(Direct Manipulation)、隱喻性(Metaphors)、一致性(Consistency)、反饋性(Feedback)和使用者控制性(User Control)
- 其中美學完整性，代表了一款應用的視覺表現和互動行為與其功能整合的優良程度，如：功能性應用比較適合通過標準化的控制元件和可預知的互動行為，來保持使用者的專注性；而反之，遊戲類應用則需要利用更加吸引人的視覺表現，來鼓勵使用者深入探索的同時，為其帶來無窮的樂趣和刺激。
- 直接操作性，以微信搖一搖為例，講述了通過包括旋轉螢幕或手勢控制等方式直接對螢幕上的物件進行互動，會更有助於使用者理解從而提升使用者的參與度。
- 隱喻性，以控制開關為例，通過隱喻使用者在現實中的互動方式，能夠使使用者更快的學會使用應用。
- 一致性更為容易理解，一致的介面元素，風格統一的圖示，標準的字型樣式及一致的文字描述。
- 反饋性，拿進度條為例，旨在表明應用應該對使用者的每個互動行為都提供明確的反饋。
- 最後使用者控制性，也是蘋果比較注重的，其實側面體現了蘋果對於使用者的尊重，一定不能剝奪使用者的控制權，但可以通過建議或警告的方式對使用者進行引導。
基本介面元素（Interface Essentials）
以下便是UIKit中三大基本介面元素：
- 欄(Bars)，欄可以告知使用者其當前所在應用中的具體位置，提供導覽，還有可能包含按鈕或其他可以用來觸發功能或交流信息的元素。
- 視圖(Views)，視圖包含了使用者所最關注的內容，如文字、圖形、動畫及一些互動元素。而視圖更是支持滾動、插入、刪除及排列等行為方式。
- 控件(controls)，控件用於觸發功能及傳遞信息，像按鈕、開關、輸入框、進度條等，便是極經典型的控件。
對於這三大設計原則和六大基本特性，我真的覺得每一項都非常重要，因為當使用者在操作手機App時，擁有一定的控制權及直接操作性，會讓人們更想要持續使用該App所提供的服務，如果整體規劃是有一致性且清晰易懂，還擁有好的視覺效果和互動及適時反饋，我相信這將會是一個留得住人心的好App，當然一個設計完善的App，三大基本介面元素也是缺一不可唷！
後面還有九個章節，每個章節平均有5~13個小節，內容實在是太多，沒辦法全部放進來…有興趣的朋友可以看官網最新版的HIG，至於上面提供的另一個連結，請參考即可，因為最新版HIG的各章節和內容都有部分調整與修改，請自行評估和參閱。
三、讀後心得與感想
這邊真的只能對蘋果提供的 Human Interface Guidelines（HIG）致上最高敬意，為什麼會這樣說呢？
因為～這份人機互動指南幾乎涵括了所有開發者應該考量到的一切，舉凡所有元件都有其建議與規範外，包括App架構、使用者互動、系統功能、視覺設計、圖標和圖像、欄、視圖、控件、擴展功能等，每一樣都有其詳細的規範與指導方針外，在這些項目內又分為好幾個細項做說明與提醒，難怪網路上很多文章都強力推薦Apple的Human Interface Guidelines，真的是UI/UX設計師及iOS工程師必須熟讀的開發設計指南。
由於內容實在太多，目前只能盡最大的努力，將中英文版交叉對照閱讀一次…雖然眼睛真的看得有點酸，但至少對內容有一定程度的了解與吸收，我相信若持續遵循HIG的設計方針，並透過經驗的累績，未來一定可以開發出使用者介面與使用者體驗都更加完善的App。
最後～這份文件真的要看！因為聽說未來App上架前的送審，若有遵從設計規範，過審核的速度會快一下，也比較不容易被退件唷！
希望未來有一天可以把所有內容都吸收到腦袋瓜裡，這樣開發速度應該也可以更快更有效率！搞不好有機會成為雙修或三修的三刀流索隆。(這邊是指有機會的話，也能成為跨界UI/UX設計師或是傳說中的斜槓青年！）
總之，持續努力加油！！衝呀呀呀！！😆✌️
