Hello，我是 Samuel，目前在 Hahow 好學校擔任 Product Owner & Software Developer。在（上）篇中和各位夥伴介紹了 Dark Mode 以及衍生的 Material 設計；在（下）篇中會再和大家聊聊更多 iOS 13 在設計上帶來的改變，如果還沒有讀過（上）篇的文章可以透過這個連結前往閱讀。

• 全新的 SF Symbol
• Modal 新類型「Sheet」，如果沒注意到就麻煩啦！
• Context Menu 的新互動
• 最後讓我們來聊聊 iPad UI 吧

20190624 補充說明：

感謝好友 Tommy 提出，WWDC 的講者針對 iPad Split Screen 這點的說明是「We are going to expect that “MOST” of the applications, “UNLESS you want to provide a truly immersive experience”, are going to support split screen multitasking.」，看起來似乎沒有強制要求，但是強烈建議，強制要求的是一定要使用 Launch Screen 和不再接受 letterboxing。

但實際上 Apple 到底會怎麼做呢？我們等正式上線來好好看看，因為這個問題比較嚴重，在 Apple Developer Forum 已有相關討論進行中，會持續追蹤回覆給各位夥伴：）

全新的 SF Symbol

iOS 13 支援了 SF Symbol，提供超過 1500 個高識別、一致性、同時與系統字體 San Francisco 無縫整合的 Icon。

更棒的是它還同步支援各種尺寸、重量型態，也讓工程師、設計師們再也不需要垂直置中的問題，不需要擔心模糊的問題；對於不懂設計的工程師或者需要快速開發產品的團隊而言，根本就是佛心來的啦！

如果你想要建立客製化的 Symbol，隨著 MacOS 更新提供的 Mac App — SF Symbols 讓你可以用 Sketch 或者 illustrator 自己客製化需要的 icon，並匯入 SF Symbols App 後進行使用。想瞭解更多夥伴可以參考 iOS Human Interface Guildline — SF Symbol。

Modal 新類型「Sheet」，如果沒注意到就麻煩啦！

Yap！iOS 13 中「系統預設」的 Modal 跳出頁面將會轉變為下圖的型態（已經實際測試過），稱為「Sheet」，操作的視圖會被縮小同時淡化至於新跳出視圖的下方，而不像 iOS 13 之前會是完整覆蓋的畫面 →

讓我們放大些來看：

新版本的 Sheet 採用卡片式的設計風格（整個 Dark Mode 都是一個卡片式的概念啊🤔），透過淡化卻仍然存在的概念，幫助使用者記得上一個視圖的樣貌與行為，同時，新版本的 Sheet 也提供使用者一些系統預設的行為或者「自定義的行為（點擊按鈕）」跳出這張卡片：

1. 從卡片上方往下滑動
2. 當卡片（如果內容是 ScrollView）滑至內容最上方時，從卡片的任何一個方向往下滑動

根據 Human Interface Guideline 中的堅毅，如果跳出來的 Sheet 中有「修改未儲存的資料」這類型的行為，應該要提醒使用者有「未儲存的資訊」，結合 Alert 視窗與使用者進行互動，同時透過程式關閉掉「從卡片上方往下滑動」這類型的離開行為，畢竟…如果使用者沒有儲存不小心關閉畫面就尷尬了（笑）。Apple 表示 Sheet 的使用情境在於「非沈浸式（nonimmersive）」的操作介面，請確保 Sheet 上「至少有」關閉的按鈕提供使用者使用（不應該仰賴 Swipe 的的預設關閉行為），彈出的任務不應該過於複雜，使用者也不應該被輕易綁在畫面當中。以 Calendar 為例，編輯和新增事件這種事件任務就非常適合使用 Sheet：

但像拍照、錄影、照片編修、文件編輯這種需要沈浸式、較複雜的使用場景就適合維持 Fullscreen 的呈現型態（原本的 Modal）：

當然，即使 Apple 強烈推薦我們採用新的 Modal Presentation Mode，但原本覆蓋的視圖呈現型態仍然可以透過程式碼去修改，但務必記得「預設的已經改成上圖的樣式」、「預設的已經改成上圖的樣式」、「預設的已經改成上圖的樣式」很重要所以說三次！如果各位的 App 不希望透過上圖的樣式跳出頁面，請務必提醒自己工程師在 iOS 13 上線前進行修改（笑）。

Context Menu 的新互動

不知道各位夥伴有沒有注意到配合「 Force Touch + 上滑」在 iOS 的相簿中可以產生底下的互動（Peak and Pop）：

在 iOS 13 新增了一個非常類似的互動行為 — Context Menu

• 支援不同的裝置
• 更直覺的操作（不需上滑），同時不再只支援 Force Touch 這種手勢
• 支援更多的排版樣式（包含分隔線）

Context Menu 最主要的價值除了提供更多的互動型態之外，Apple 在 Human Interface Guideline 中也特別提出幾個重點：

• 避免和 Edit Menu（下圖）合用，會讓使用者混淆

• 擺放最常用的行為在 Context Menu 中
• 使用Submenus 來處理複雜的行為，但 Submenus 不要超過一層

其實…Context Menu 某種程度就是在模仿 MacOS 上「右鍵」的操作行為，使用者可以透過這個快速彈出的 Menu 在畫面中進行更多的操作，Apple 建議 Me畢竟…接下來 iPadOS 的 App 快要可以無痛轉移到 MacOS 的 App 啦（笑）。

最後讓我們來聊聊 iPad UI 吧

iPhone 的部分大致上告一個段落（終於），我們最後來聊聊 iPad 的部分吧（笑），竟然還有？！好啦我們簡單整理一下就好！首先，Apple 在今年的 WWDC 中將 iPad 獨立出一個「iPadOS」：

除了主頁面的 UI 調整之外，也支援首頁釘選 App 的功能。但 iPadOS 最主要的特色在於所謂「滑動置前與分割顯示」 →

針對 iPadOS，Apple 耗費了大量的心力在多視窗的互動上面，就如同在 MacOS 上可以有多個視窗的操作一樣。更多的細節可以直接上 Apple 網站上面看，但這邊我想和大家多聊聊的是由於 Split Screen 分屏所產生的特性，Apple 特別建議「你需要讓你的 App 變得 Resizable」。

在 iOS 13 之前，iPad 的 App 可以關閉掉 Split Screen 的特性，讓你的 App 不能同時和其他 App 一起使用，但這一切都將在 2020 年 4 月停止！你的 App 「一定要支援 Split Screen」，這就是 Apple 啊乾（眼神死）。

感謝好友 Tommy 提出，WWDC 的講者針對 iPad Split Screen 這點的說明是「We are going to expect that “MOST” of the applications, “UNLESS you want to provide a truly immersive experience”, are going to support split screen multitasking.」，看起來似乎沒有強制要求，但是強烈建議，強制要求的是一定要使用 Launch Screen 和不再接受 letterboxing。

但實際上 Apple 到底會怎麼做呢？我們等正式上線來好好看看，因為這個問題比較嚴重，在 Apple Developer Forum 已有相關討論進行中，會持續追蹤回覆給各位夥伴：）

這大概是唯一一個讓我想特別拿出來提的調整，讓我們一起…攜手努力吧哈哈哈哈哈哈啊。

感謝大家願意花時間閱讀小弟的文章，我想…iOS 13 在設計上面改動的重點幾乎都整理在這兩篇裡面囉！更詳細的內容請參考：

希望能夠幫助各位在 iOS 13 來臨之前提前做好準備，避免被這些設計上面的改動給影響（淚水）。

如果喜歡這篇文章，反正鼓掌不需要花錢🙏，用力地按下50次鼓掌給予一些鼓勵吧！

您好，我是Samuel，目前任職於Hahow，擔任Product Owner & Software Developer，TEAMUP和Kapi的共同創辦人;正在努力培養跨領域的思維，認為分享和傳遞資訊這個行為能夠改變整個環境與業界氛圍。熱愛設計，技術實作，創業和攝影，有任何想法或者合作的機會都歡迎一起喝杯咖啡。Website：www.samuel-kao.com 
Facebook：https：//www.facebook.com/citysite1025
Instagram：https://www.instagram.com/citysite1025/