設計師必看:iOS 13 體驗新特性大盤點
筆者以設計師的立場出發,對新發布的 IOS1313 系統進行了梳理,盤點分析了新的功能體驗,與大家分享。
自從iPhone11和iOS13手拉手問世后,迎來了一大波褒貶不一的聲音。也許是蘋果太久沒給我們帶來早些年那種動人心弦、激情澎湃,賣腎都要“買它”的沖動了。
經歷了iOS 11的災難級別表現后,蘋果這次對性能還是下了狠功夫的。
- Face ID的解鎖的速度提升了30%
- APP的體積縮小了50%
- 更新包的體積縮小60%
- 應用的啟動速度提升了2倍
- ……
單看這些數據還是挺振奮人心的。
轉眼已經一個月過去,關于要不要割腎、要不要升級、新功能、新體驗的文章帖子已經鋪天蓋地。這里臭臉君想講的是作為一枚設計師面對本次iOS13的新特性,可以有哪些機會點能夠為自己的產品做哪些應變呢~~
01 彈窗視圖(Sheet)
這樣的彈窗視圖在Human Interface Guideline(蘋果設計指南)中被稱為Sheet。新版的視圖有助于用戶明確信息的層級,便于用戶找回此前被暫停的任務。
可參見官方設計指南:https://developer.apple.com/design/human-interface-guidelines/ios/app-architecture/modality/
說到任務層級就想到安卓機上標配的物理返回鍵,它與任務鍵、主頁鍵并稱三大金剛,所有的交互邏輯都以此為基礎建立。
iPhone一直以來只支持從左側邊緣內滑,也不像MIUI一樣靈活可以左右開弓、隨心所欲。隨著APP功能越來越厚重,iPhone的屏幕越來越大,引入新的層級體驗想必也是為了解決這個困境。
新版的視圖彈窗(Sheet)提供三種關閉方式:從屏幕頂部向下滑動、當卡片內容滾動到頂部時,從屏幕上的任何位置向下滑動 、點擊導航欄的按鈕。
但并不是所有彈窗都要兼具這三種方式(譬如彈窗內支持下拉刷新),可以根據頁面呈現內容和操作的需要,可以自由選擇一種或多種形式。
彈窗的功能非常強大,可以承載以往全頁面上的所有操作體驗。但根據蘋果在HIG中的建議,依然要注意彈窗中的任務需要簡單、簡短,避免過于復雜而導致用戶忘了此前他們所暫停的任務,進而“迷路”。
目前原生應用內也存在使用混亂的問題,不知道是bug還是內部沒打成統一呢ㄟ( ▔, ▔ )ㄏ
對于設計而言,不失為是一次對產品層級洗禮的機會,尤其對于復雜業務邏輯的APP可以考慮將主頁面獨立分支的功能使用Sheet來承載。
在使用時需要注意:
- 模態任務會打斷對當前頁面的展示和操作,因此使用在獨立業務分支且需要用戶暫時集中注意力的場景下
- 避免模態任務太復雜,當人們進入模態上下文時,他們可能會忽略他們暫停的任務。
- 謹慎地創建涉及多層次結構的模態任務,因為人們可能會迷失方向,而忘記了如何追溯其步驟。
- 始終包含一個退出模態視圖的按鈕。無論是“取消”、“完成”、“叉叉”,不能只存在隱晦的手勢操作。
02 HapticTouch
Apple本次將3DTouch改為長按,命名為HapticTouch。從英文翻譯過來,Haptic Touch的含義為觸覺觸控。
3D Touch有Peek(輕按)、Pop(重壓)兩種手勢,并且可以識別用戶按壓的力度大小,根據力度給出不同的振動反饋。haptic touch只有輕按和重按,沒有了中間的力度,也不支持靈敏度調節。
從結構上看,Taptic Engine很可能在3D Touch基礎上少了“電容式壓力傳感器”,因而無法識別用戶按壓力度。
以往輕按桌面圖標可進入排列編輯模式,重按呼出菜單,改用HapticTouch之后就不再區分輕按和重按。
先通過長按呼出菜單,“重新排列桌面”變成了菜單中的一個選項。又或者長按呼出菜單后繼續長按,也能進入排列編輯模式。
顯然這個改動對于經常有調整APP排序需求的用戶帶來了不便(就比如……臭臉君),或許是因為3DTouch自問世就吐槽不斷,甚至有些人壓根不知道還能重按操作。
另外,把長按只用在APP排列太大材小用,因此做了二者的結合。
3Dtouch硬件成本高,并且會對iPhone的厚度產生影響,如果將3Dtouch模塊移除 iPhone可以多出一部分內部空間來增加電池容量。為iPhoneXR等不支持3D Touch的設備也增加了觸感觸控。
設計師需要注意,蘋果此次將菜單圖標從3Dtouch時期體量感很強的面型改成了更加輕量的線型,UI上需要同步更新。
03 手勢編輯操作
本次iOS 13 增加了不少文本編輯的手勢:
- 復制:三指捏合
- 剪切:兩次三指捏合
- 粘貼:三指松開
- 撤銷:三指向左劃動(或三指雙擊)
- 重做:三指向右劃動
- 快捷菜單:三指單擊
操作后頂部會出現對應的反饋,嘗試下來有些過于花哨,很容易因為操作不當或記憶錯誤而反復嘗試。尤其是在小屏機子上,笨重的大豬蹄肯定是無處安放的ㄟ(▔,▔)ㄏ,還不如本本分分的長按呼出菜單欄。
這里需要注意的是快捷手勢是系統默認支持的,如果不想響應該功能需要從技術層面去禁用。
- 雙指滑動:列表選擇
要重點表揚一下針對信息列表的雙指滑動手勢,可以讓列表快速進入編輯模式,在編輯模式下繼續雙指滑動就可以快速多選。第一次嘗試操作的時候真的有被感動到,過度流暢又細膩,再也不用費勁巴拉的逐一點擊啦。
如果你的產品也擁有類似的信息呈現方式和功能操作,不妨試試這個小而美的體驗升級。
04 dark模式
從魅族16開始,國內的安卓手機廠商們就在積極地發展黑暗模式,此次iOS13蘋果終于給用戶們帶來了期待已久的深色模式,可以通過系統設置或控制中心打開。
在深色模式下,系統應用的背景都會隨之變成黑色,還支持自由調整切換時間,根據自己的習慣自動切換模式。
據說蘋果已經要求開發者在明年4月前必須適配iOS13,對于最先相應的一批產品還在App Store上做了推薦(忘記截圖留證據,目前已去掉了推薦模塊)。所以敏感的設計師一定也要趕緊上車,盡快為自己的產品做出適配方案。
“APP以前自行做的夜間模式是否需要提前下崗呢?”針對這個問題目前來看dark只是系統的一種皮膚模式,文字與底色之間的對比很強烈,并不是我們理解的夜間模式,不然蘋果自己也不會保留“夜覽”啦。
05 carplay支持深色模式、功能更強大
iOS13的CarPlay也支持深色模式,并且可以把多項功能顯示在同一屏幕,更方便查看和操作,支持更多機型。
如果你的產品也具備CarPlay功能,是時候重新審視一下如何利用此次機會啦。
06 用Memoji 制作表情包
通過 Face ID 實現的 Memoji 在推出之后受到了很多人喜歡,可以通過自己的雙手“再造”一個自己。
iOS13對此做了升級,新的Memoji表情自定選項,包括新的發型、頭飾、妝容和環飾。生成的表情包包在“信息”、“郵件”和第三方 App 中可用,并適用于所有 iPhone 機型。
目前微信已支持,可以考慮下自己的產品尤其是社交屬性相關的功能是否需要支持。
07 音量控制
在iOS13之前的版本中,音量的調節圖標是顯示在屏幕中間一個巨大的鈴鐺,鈴鐺下面會有音量大小的進度條,嚴重干擾用戶視線,因此很多應用(尤其是視頻相關APP)都自行做了顯示優化。
iOS13對音量控制圖標做了全新的設計,將其設計在了屏幕左側。在音量的調節過程中,非常直觀的顯示大小的變化。還支持滑動調整,類似控制菜單中的音量調節。
此次還做了鈴聲和音量的顯示分離,有音頻播放時按上下鍵在左側顯示音量調節,無音頻時則在頂部顯示音量的高低。終于解決了我用iOS12時總是摸不清調音量還是調鈴聲的困擾。
如果你的APP曾經也為音量調節做過UI的特殊處理,可以考慮針對不同系統做展示。iOS13的用戶統一使用系統的音量形式,功能強大的同時還能體驗更一致。
最后還有一些臭臉君覺得有意思的體驗新增,也跟大家分享一下??纯词欠窨梢员蛔约旱漠a品為之所用~
08 Safari保存長圖
在Safari中截屏進入編輯模式后,支持以長圖的形式保存整個頁面。也可以直接將網頁以PDF的形式進行郵件共享。存長圖功能在很多安卓機上早已支持,希望蘋果可以將該功能擴展到更多場景下,并開放給第三方APP。
09 滑動鍵盤
iOS 的原生輸入法一直以響應速度和穩定性著稱,但不可否認的是輸入方式非常單一。
自 Cliff Kushler 在 swype 輸入法上創造出滑動輸入以來,這種輸入方式已經成為了許多熱衷于高效輸入的用戶的選擇。
此次iOS13也引入了這種直接滑動就可以輸入的操作形式,對于嘗鮮用戶來說有一定的使用門檻,但如果手機大小、持機方式、手指長度三者間達到良好的配合,習慣后效率便可明顯提升。
10 AirPods共享音樂
iOS13通過 NFC 感應可以將兩位同時佩戴 AirPods 的用戶進行配對,還能通過 iPhone 觸碰的方式進行音頻分享。
11 滾動條拖拽
細心的你可能已經發現,在iOS13之前如果頁面有滾動條,會在頁面停止后快速的消失,而在iOS13中會停留一段時間才消失。因為進度條除了表明你當前所在的頁面位置外,還具備了新的操作體驗。
當右側出現有滾動條出現時,可以按住滾動條(按住后滾動條會變粗)進行拖拽實現頁面快速滾動,就像在PC上用鼠標拖拽滾動條一樣。
12 隔空傳送方向感知
針對iPhone11用戶,在使用隔空傳送給朋友發送資料時,只要將箭頭指向他,系統就可以優先給他發送。(因為窮,沒有實際嘗試過ㄟ( ▔, ▔ )ㄏ)
13 地圖共享
如果對方是iOS13的系統,你可以將自己的實時位置和到達時間分享給他。如果對方不是iPhone用戶。也可以通過短信的形式分享自己的到達時間。
all~如果你也發現了有趣的功能或體驗,歡迎分享交流~
#專欄作家#
臭臉任,微信公眾號:臭臉任的慢生活,人人都是產品經理專欄作家。
本文由 @臭臉任 原創發布于人人都是產品經理。未經許可,禁止轉載
題圖來自網絡
冒個泡,嘿嘿嘿