谷歌是符合做好折疊屏適配的?我總結了這四點
近年來,盡管大眾持觀望態度,全球各大手機廠商仍然熱衷于折疊屏手機的研發與革新。本文以最新版的 MaterialDesign設計系統為基礎,對折疊屏手機的觸摸范圍、頁面分割、鉸鏈和彈窗四個方面對比式地進行討論,推薦感興趣的童鞋閱讀分享~
大家有沒有感覺到,最近關于折疊屏的新聞越來越多了。
雖然我周圍沒見到什么人買折疊屏,但架不住廠商熱情高漲啊。
全球各大廠商幾乎都在拼命鉆研折疊屏手機,幾乎每發布一款都有技術革新。
根據面板供應鏈市場研究機構 DSCC 的數據,2021 年第三季度折疊屏手機迎來了爆發性的銷量成長,除了比前一季度增加了215%,出貨量更是達到 260 萬臺。
雖然這點數據比起全球 2.66 億的手機總銷量來說不算什么,但未來的事情誰又說得準呢?
隨著折疊屏越來越火,作為一個做過好幾年手機 APP 的設計師,我內心隱隱有些不安。
如果折疊屏手機真的普及了,恐怕會給 UI 和交互設計帶來很大的變化。
到時候,稍微講究一點的 APP 都要補充很多適配規則,甚至可能需要重新設計布局架構,因為做不做折疊屏的適配,對體驗和視覺效果的影響真的很明顯。
例如,下圖就是 Google Due 為折疊屏做適配的真實案例:
做好適配后,折疊屏看起來酷炫,優勢展露無遺。
如果不做適配,折疊屏不但顯得毫無優勢,你還會覺得中間那條縫十分礙眼。
為了把折疊屏的優勢發揮出來,設計師們可以操心的地方多了去了。
蘋果現在是沒有折疊屏手機,所以想要了解折疊屏適配設計的話,最好是去看看 Android 系統—— Google 確實做了一番研究。
最新版的 MaterialDesign設計系統中,有專門針對折疊屏適配的研究,我今天就以此為基礎,給大家捋一捋:
- 觸摸范圍
- 頁面分割
- 鉸鏈
- 彈窗
一、觸摸范圍
折疊屏的手機屏幕更大,觸摸范圍肯定也不一樣。
非折疊屏手機以單手操作為主,但是折疊屏手機如果展開,就不可能單手操作了,以雙手為主。
上面三個區域中,3 號區需要手指彎曲較大,1 號區需要手指盡力,2 號區是操作起來最舒適的。
頂部,尤其是中間那一部分,手指很難觸達,避免放置常用操作。
二、頁面分割
首先,有的屏幕是原來手機的尺寸,從中間對折的,有的還沒有 90° 的狀態,要么折疊要么展開。
這種還比較好辦,因為大部分時間都是展開使用,不太需要額外的適配設計。
比較麻煩的是雙屏尺寸的折疊屏,因為這種屏幕會經常使用展開90° 的桌面模式。
最簡單的適配方式是下圖這種單列適配,適合上下翻折,但這種就對桌面模式很不友好。
這種不太適合左右翻折,否則中間容易看到一條豎直折痕。
如果是左右翻著,最好是考慮這種左右布局了,更大效率地利用 2 倍的屏幕空間。
但是這種左右布局也會有風險,折疊屏的展開寬度畢竟不及平板設備,也要考慮分成兩列之后空間夠不夠用。
桌面模式可能是看視頻或打字的常用模式,也要考慮如何快速切換布局:
三、鉸鏈
上面那么多模式,已經很讓人汗顏,但折疊屏的復雜性還不止如此。
因為硬件限制,折疊屏中間都會存在一個鉸鏈。
各大廠商都在努力抹平鉸鏈造成的視覺影響,但用久了幾乎沒有哪家不出現凹痕的。
那個小凹痕平時也沒什么,但如果圖片或文字段落跨越那道鉸鏈,就難保不看出問題。
退一萬步說,就算凹痕小到看不出來,鉸鏈依舊會給交互造成影響。
因為鉸鏈上的觸感肯定不怎么好,重要的信息和按鈕都最好避開那道杠。
更何況,還可能存在鉸鏈處觸控問題,甚至屏幕分段的問題。
四、彈窗
前面講了為什么鉸鏈的存在會給 APP 設計造成很大影響,這里就要說影響最大的一個組件了。
彈窗是不能直接用以前的樣式了,否則剛好卡在鉸鏈那個地方。
Material You 的解決辦法是,讓折疊屏的彈窗出現在屏幕一側。
哪怕是完全展開狀態,也不能把彈窗放在中間,因為你無法確定用戶的這個折疊屏,是不是真的無縫。
五、總結
今天這篇文章的內容有沒有用,主要還是取決于折疊屏會不會普及。
就我個人而言,如果要買折疊屏,估計主要奔著嘗鮮去,對用戶體驗這塊其實并沒有什么指望。
但是以后的事情真不好說,不知道大家怎么看?
#專欄作家#
作者:Z Yuhan,一名前華為騰訊留英設計師;公眾號:體驗進階。
本文原創發布于人人都是產品經理,未經作者許可,禁止轉載。
題圖來自Unsplash,基于CC0協議。
折疊屏最近在那些冬奧運動員的vlog里面見的比較多,挺新奇的,但是讓我買的話我還是會考慮一下的