編輯導(dǎo)讀：iOS14系統(tǒng)在發(fā)布之后，有用戶表示越來越像android。事實正是如此嗎？本文作者基于親身經(jīng)歷，從使用體驗和官方設(shè)計規(guī)范兩個方面對iOS14系統(tǒng)展開分析，希望對你有幫助。

iOS14系統(tǒng)以及發(fā)布有段時間了，想必很多朋友已經(jīng)更新了最新的系統(tǒng)嘗嘗鮮，而當(dāng)時發(fā)布沒多久之后就看到很多“iOS越來越像android，小組件很早就已經(jīng)在android上出現(xiàn)了”之類的話題。

那么今天就講講這個內(nèi)容吧。說真的，我已經(jīng)有5年沒有使用過安卓手機(jī)了，對安卓系統(tǒng)知之甚少，翻看前人留下的文章，觀看YouTube，最后去旗艦店做了一次實際體驗。

一、使用體驗

下面是對SAMSUNG、華為、OPPO、iPhone11四款機(jī)型的體驗：

1. 三星

實際體驗視頻點(diǎn)擊這里觀看

交互：

1. 長按主屏幕空白處顯示主界面分頁和「小組件」等功能，點(diǎn)擊小組件icon進(jìn)入選擇預(yù)設(shè)APP組件頁面，左右滑動查看不同應(yīng)用的小組件；
2. 點(diǎn)擊APP組件進(jìn)入選擇樣式頁面（以4×1,4×2,4×4等形式告知用戶一個小組件的多種樣式選擇）；
3. 長摁進(jìn)入主界面選擇放置小組件，當(dāng)前屏幕無位置放置時會toast提示。

體驗：

• 小組件通過增加背景框來保持系統(tǒng)的統(tǒng)一性，瀏覽舒適。
• 在選擇具體樣式之前體驗流暢，但在放置小組件時，想多次通過點(diǎn)擊的形式添加，好在toast提示需要長按拖拽。在最后階段可能用戶可能更希望通過點(diǎn)擊的形式操作，而非長按（此處代入用戶心理模型，實際有待求證）。

2. 華為

華為系統(tǒng)為EMUI10.1而非的android。

實際體驗視頻點(diǎn)擊這里觀看

交互：

1. 雙指對角向內(nèi)滑動，調(diào)出主屏幕分頁及功能icon，點(diǎn)擊「窗口小工具」隱藏功能icon，顯示預(yù)設(shè)小工具。
2. 點(diǎn)擊應(yīng)用預(yù)設(shè)工具，顯示不同樣式。
3. 拖拽至主屏幕分頁放置小工具。
4. 長按小工具顯示編輯狀態(tài)可調(diào)節(jié)大小。

體驗：

功能顯示與三星類似，但在選擇組件和放置組件時體驗更好。

1. 沒有切換頁面，用戶操作時間更短；
2. 主屏幕分頁可左右滑動選擇合適的位置，用戶可以得知什么位置可以添加小工具。
3. 對小工具可以進(jìn)行大小調(diào)控。

但也存在一些小問題：

• 當(dāng)小工具類型增加到一定數(shù)量時，僅通過底部一行展示3個的形式來讓用戶查找想要的組件時會相對費(fèi)時。
• 小工具的樣式多樣，不夠統(tǒng)一。

3. OPPO

實際體驗視頻點(diǎn)擊這里觀看

交互：

1. 雙指對角向內(nèi)滑動，調(diào)出主屏幕分頁及功能icon，點(diǎn)擊「應(yīng)用組件」隱藏功能icon，顯示預(yù)設(shè)「組件」；
2. 拖拽「組件」至主屏幕放置；
3. 長按可調(diào)節(jié)組件大小。

體驗：

1. 添加了背景框保持應(yīng)用統(tǒng)一；
2. 應(yīng)用組件未做二級細(xì)分選擇，而是在當(dāng)前頁面直接展示不同的比例。

4. iPhone11

實際體驗視頻點(diǎn)擊這里觀看

交互：

1. 左滑顯示負(fù)空間界面，長按單個組件顯示操作功能（編輯主屏幕、移除小組件）。
2. 點(diǎn)擊編輯主屏幕，界面處于可編輯狀態(tài)，可移除小組件，也可點(diǎn)擊左上角“加號button”來添加小組件。
3. 點(diǎn)擊加號，顯示模態(tài)，選擇不同應(yīng)用小組件，點(diǎn)擊小組件模態(tài)選擇小中大三中不同的組件樣式。
4. 點(diǎn)擊底部“+wiggle button”收起模態(tài)，返回主界面編輯狀態(tài)。
5. 點(diǎn)擊完成，小組件添加完成。
6. 在應(yīng)用主界面通過長按空白區(qū)域或長按應(yīng)用選擇彈窗快捷功能“編輯主界面”，其他交互流程同上。

體驗：

1. 打開編輯狀態(tài)與主屏幕應(yīng)用移動分組保持一致。
2. 使用模態(tài)選擇小組件，用戶操作行為較輕。
3. 固定三種比例尺寸選擇添加，保證系統(tǒng)體驗和視覺的統(tǒng)一。
4. 展示部分組件，其他以應(yīng)用圖標(biāo) 來展示。很大程度上避免了APP小組件過多導(dǎo)致瀏覽效率變低的情況。
5. 添加小組件的功能入口較為隱蔽，難于被發(fā)現(xiàn)。
6. 在視覺上小組件的內(nèi)容更易引起用戶注意。

5. 小結(jié)

二、官方設(shè)計規(guī)范

1. Android

“小組件可顯示有關(guān)應(yīng)用程序最重要的數(shù)據(jù)和功能的信息”，官方一句話簡單描述了小組件，從類型和行為兩方便做了一些介紹：

1）類型

官方提供了四種類型：信息、集合、控制和混合。

混合小組件實例

2）行為

滾動：基于列表或基于網(wǎng)格的集合窗口小部件通常會擴(kuò)大或縮小垂直滾動區(qū)域。

縮放：用戶可以使用拖動手柄或窗口小部件角來設(shè)置所需的大小。

導(dǎo)航：提供指向應(yīng)用程序經(jīng)常使用區(qū)域的導(dǎo)航鏈接。

2. iOS14

介紹：小部件可提升您應(yīng)用中的關(guān)鍵內(nèi)容，并將其顯示在人們可以在iPhone，iPad和Mac上一目了然的位置，有用且令人愉悅的小部件還可以幫助人們以獨(dú)特的方式個性化iPhone主屏幕。

1）對顯示內(nèi)容的設(shè)定（創(chuàng)建一個有用，集中的小組件）

小組件的主要目的是顯示少量及時的個人相關(guān)信息。

• 將小組件集中在一個信息上。
• 每個小組件顯示的信息密切相關(guān)。
• 立即訪問的內(nèi)容有意義。
• 提供多種尺寸，增加價值。
• 偏好全天變化的動態(tài)內(nèi)容，吸引用戶經(jīng)常查看。
• 尋找驚喜和喜悅的機(jī)會。比如節(jié)日視覺特殊化。

2）支持小組件配置和交互

• 提供合理的可配置小組件，用戶可查看制定的信息。
• 確保點(diǎn)擊小組件正確打開應(yīng)用對應(yīng)頁面。
• 避免過多的點(diǎn)擊交互（中、大小組件可設(shè)置多個點(diǎn)擊交互）。
• 引導(dǎo)用戶登錄應(yīng)用以獲得更多有用信息。

3）設(shè)計漂亮的小組件

獨(dú)特，美觀的小部件不僅提供有用的信息，還使人們有機(jī)會個性化主屏幕。

• 通過顏色，版式和圖像傳達(dá)品牌。
• 舒適的信息密度。
• 使用顏色增強(qiáng)外觀，但不影響內(nèi)容識別。
• 支持暗黑模式。
• 使用SF Pro。
• 使用文本元素，以更好的自適應(yīng)縮放。
• 設(shè)計逼真的預(yù)覽，引導(dǎo)用戶添加小組件，數(shù)據(jù)無法實時更新時可設(shè)置模擬數(shù)據(jù)。
• 設(shè)計占位符，在數(shù)據(jù)加載時便于用戶辨認(rèn)應(yīng)用。
• 增加簡單的描述，便于用戶理解小組件的功能。

4）適應(yīng)不同的屏幕尺寸

3. 小結(jié)

通過android Material Design規(guī)范和iOS設(shè)計規(guī)范可以看出：

android對于組件的功能更加開放、自由，對于設(shè)計的限定較少。而iOS從小組件定義、內(nèi)容、色彩、字體、邊距、尺寸、交互多個角度告知設(shè)計師和開發(fā)者應(yīng)該設(shè)計什么樣的組件。以保證系統(tǒng)體驗的一致性、小組件的有用、美觀和個性化。相對的對于小組件的功能可交互性沒有android靈活，但也可以做一些內(nèi)容的配置讓用戶選擇需要展示的信息。

這是一段毫無意義的猜想，請你保持獨(dú)立思考。

• iOS14正式發(fā)布之后可能會涌現(xiàn)一大批第三方小組件應(yīng)用。
• iOS14小組件化應(yīng)用場景除了iPhone、iPod、Mac之外更加實用的或許會是車機(jī)大屏，個性化和一目了然在汽車駕駛的過程中能夠非常有效的識別信息。但也存在數(shù)據(jù)刷新同步的問題。
• 在未來小而美的工具類應(yīng)用的使用頻率會增加，比如：Noto筆記、墨跡天氣、offscreen、Terllo等。

作者：YuZJ設(shè)計，公眾號：YuZJ Design

本文由 @YuZJ設(shè)計 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載

題圖來自 Unsplash，基于 CC0 協(xié)議