2020年,移動端用戶體驗設計趨勢

0 評論 6011 瀏覽 32 收藏 10 分鐘

2020年的設計趨勢似乎并沒有什么改變,許多趨勢仍在發(fā)生:無界面模式(chromeless)的設計、手勢、漸變、半扁平化、粗大的字體等等,它們仍然存在,并將在2020年繼續(xù)占據(jù)主導地位。

以下是一些將在2020年繼續(xù)增長的新移動趨勢:

一、暗黑模式

是的,我知道這已經(jīng)是老生常談了,但你知道他們是怎么說的:“一旦蘋果決定使用暗黑模式,就沒有人可以不使用…了…”。隨著iOS13的發(fā)布,暗黑模式已經(jīng)內置在每一個運行在蘋果設備上的移動應用程序。

當然,不僅僅蘋果這么做,因為Android和Windows也支持這種模式,但蘋果有一種快速推進這類舉措的方式,設備幾乎立即與最新的操作系統(tǒng)版本同步,開發(fā)者社區(qū)也非常嚴格地遵循蘋果的設計規(guī)范。

就我個人而言,我并不是這個模式的超級粉絲,主要是因為大多數(shù)應用程序目前都在使用純黑和純白顏色,非常刺眼,容易引起眼睛疲勞。

規(guī)則很簡單:

1. 不要在純白色背景上使用純黑色

大多數(shù)設計師都知道這一點(只要查看大多數(shù)網(wǎng)站或應用程序,你就會發(fā)現(xiàn)黑色通常是深灰色的),但出于某種原因,太多的應用程序開發(fā)人員忽略了適用于設計暗黑模式的相應規(guī)則:

2. 不要使用純黑色作為您的暗黑模式的背景

不幸的是,許多應用程序使用純黑色作為背景,造成過度刺激。

展望2020年,我確信這一問題將得到解決。

我相信,我們將看到應用程序設計者會逐漸優(yōu)化他們暗黑模式的設計,增加一些創(chuàng)造性,并且讓它從視覺上看起來更舒適。

一些公司(例如Notion和Slack)已經(jīng)在這樣做了:

在純黑色上呈現(xiàn)鮮艷的顏色太刺眼了??梢杂蒙罨疑?。

二、巨型手機是新的標準

一年前,巨型的智能手機仍然是一個“趨勢”,但現(xiàn)在它們成了標準:

  • 在2018年10月,只有16.3%的Missbeez手機用戶在使用大屏的iPhone(X/XS/XR, etc.)
  • 到2019年12月份,這個數(shù)字是41%,并且每月都在增長。

這使得開發(fā)人員可以將應用程序的內容增加一倍或三倍,同時不會造成混亂或在白空間上妥協(xié)。

三、多樣化的設計

大型手機提供更大的屏幕,可以在一個屏幕上組合多個視圖類型,而不會造成混亂:由于屏幕尺寸的不斷變大,諸如快捷方式、故事、照片輪播、標簽欄,都有整合在一起的空間。

這里是Yelp的一個完美的例子:

大一些的手機可以在一個屏幕上組合多個視圖類型,而不會造成混亂。

四、創(chuàng)建品牌已經(jīng)消失,但品牌依然存在

我去年提到過這一點,隱藏顏色、圖標和標志等品牌相關元素的趨勢在2019年繼續(xù),并可能在2020年延續(xù)下去。

再來看一個經(jīng)過重大翻新的應用是Spark,它以前是藍色的,由框架和邊框組成,最近才被重新設計成潔白干凈,就像大多數(shù)主流的應用程序一樣。

不再有品牌色彩和形象–呈現(xiàn)出來的都是關于內容的。

因此,公司將繼續(xù)擺脫不必要的顏色和視覺效果,騰出空間用于更多內容,但更重要的是–讓用戶更容易集中精力,專注于真正重要的內容。

五、底部導航控制

隨著設備變得越來越大,想要觸摸到智能手機的頂部就變得不太可能了。

UI元素不再像過去被放置在屏幕頂部,隨之出現(xiàn)了一些新的導航選項。

下面是一些導航元素位于底部的示例:

  • Pocket的漢堡包菜單現(xiàn)在位于左下角
  • Freedly的側邊欄是從點擊標簽欄彈出來的
  • Superhuman的動作面板從點擊屏幕底部區(qū)域而來
  • Uber的使用手勢滑動即可激活刷卡功能

還是印象不深刻?請查看下面更多示例:

  • IMDb現(xiàn)在把搜索框放在了屏幕底部
  • Microsoft To-Do 有豐富的任務欄入口,位于鍵盤頂部,不用再伸手指點更遠的地方就可以添加任務細節(jié)
  • Clash Royale新的信息卡片是自下而上設計的??次蚁矏鄣慕巧獴andit和Witch頁面。

搜索框、快捷入口、信息卡片現(xiàn)在都被放在了屏幕底部

搜索欄去哪了?

六、故事正在成為一種設計模式

故事在社交媒體上變得如此流行,不久我們會看到越來越多的應用程序借用故事風格的UI概念,并以新的創(chuàng)造性方式實現(xiàn)它們。

這里有兩個我非常喜歡的例子zest和Shazam;

移動app中的故事界面風格

Zest應用程序在頂部使用分頁指示,來提高用戶在發(fā)布內容時的清晰度和引導(幾個步驟過程)。

在Shazam中,你現(xiàn)在可以看到由你最喜歡的藝術家發(fā)布的短剪輯集合。

這個UI允許你通過點擊屏幕的左或右區(qū)域,實現(xiàn)在短視頻片段之間快速跳轉。當你專注于歌曲時,不需要精確。

這是一個很好的表現(xiàn)移動體驗的例子:該設計很好地利用了屏幕,導航指示被放置在頂部(不容易觸及到,但非常清晰),導航是通過點擊屏幕的兩側完成的,根本不需要特別準確,更不用提向左/右滑動、向上/向下滑動以獲得更多選項的選項。

太完美了。

下面是這種方法的一個更通用的示例:

七、擬物化是否過時還是會繼續(xù)流行?

在2012/2013年之前,它一直是一個被探討的大問題,但當世界變得扁平時,我們已經(jīng)看不到任何深度或陰影的跡象。

去年,我寫了關于漸變和陰影卷土重來的文章–就是我們知道的扁平化2.0,或者半扁平化。

到2020年,我們將看到更多的這種趨勢:更多的陰影,更多的3D,更深的深度,甚至一點…(聲音)…擬物化。

不相信我?

來看下iOS13上的例子:

這就是這一輪的設計趨勢,在2020年,移動將用更多的創(chuàng)新、驚人的可用性和偉大的體驗繼續(xù)引領設計世界。

 

作者:Gil Bouhnick

原文鏈接:https://www.mobilespoon.net/2019/12/mobile-ux-design-trends-2020.html

編譯作者:afang;公眾號:交譯所;校對:馮嬋

本文由 @交譯所 翻譯發(fā)布于人人都是產品經(jīng)理。未經(jīng)許可,禁止轉載

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

更多精彩內容,請關注人人都是產品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 目前還沒評論,等你發(fā)揮!