設(shè)計(jì)新趨勢(shì):化繁為簡(jiǎn)
我們?cè)谶@個(gè)“極簡(jiǎn)主義”的世界生活已經(jīng)有些時(shí)日了,之后又將去向何方?
過(guò)去幾個(gè)月來(lái),設(shè)計(jì)創(chuàng)新領(lǐng)域的先行者們,將“極簡(jiǎn)設(shè)計(jì)”推向了一個(gè)新的高度。Facebook、Airbnb和Apple都遵循著近似的原則,簡(jiǎn)化它們的核心產(chǎn)品,這種“化繁為簡(jiǎn)”(Complexion Reduction)的新趨勢(shì)就在它們的移動(dòng)端設(shè)計(jì)中得到體現(xiàn)。
“化繁為簡(jiǎn)”究竟是什么?
你是不是從沒(méi)聽說(shuō)過(guò)“化繁為簡(jiǎn)”的趨勢(shì)?那是肯定的,因?yàn)檫@只是我創(chuàng)造出來(lái)的術(shù)語(yǔ)。最近我留意到一種新的趨勢(shì),它超越了扁平化設(shè)計(jì),也超越了極簡(jiǎn)設(shè)計(jì),獨(dú)立性在逐漸削弱。有些人會(huì)說(shuō),這只是極簡(jiǎn)設(shè)計(jì)運(yùn)用到移動(dòng)端領(lǐng)域時(shí)開啟的新階段,但我認(rèn)為它截然不同。有一些明確的共性和特征可以定義這種新趨勢(shì)。所以我決定給它起個(gè)名字。起個(gè)名沒(méi)什么問(wèn)題吧?
這種橫掃硅谷的熱門新趨勢(shì),有以下這些決定性特征:
1. 加大加粗的標(biāo)題
2. 更簡(jiǎn)單更普遍的圖標(biāo)
3. 減少彩色的使用
結(jié)果呢?許多我們喜愛(ài)的應(yīng)用界面,開始越來(lái)越像是出自同一品牌。
證據(jù)
早在5月份,Instagram發(fā)布了新設(shè)計(jì)的UI時(shí),我第一次注意到這種新趨勢(shì)。他們此次改版的變化,其中包括去除了無(wú)處不在的藍(lán)色和深灰色,加粗了標(biāo)題,簡(jiǎn)化了底部導(dǎo)航欄和圖標(biāo)。只留下黑白界面和醒目的標(biāo)題,突顯內(nèi)容,功能清晰。我很欣賞這套簡(jiǎn)潔有序的界面,并且同時(shí)想起我仰慕已久的另一個(gè)平臺(tái):Medium。Medium自從2012年發(fā)布以來(lái),黑白界面就用得爐火純青,從那以后每次設(shè)計(jì)改版,都在去除繁雜;實(shí)際上Medium正是化繁為簡(jiǎn)的開山鼻祖之一,他們自己都不知道這點(diǎn)。真是要恭喜Medium!
Facebook的同行們更新了Instagram的界面之后不久,我打開了Airbnb,它看起來(lái)如此熟悉,令我深受震撼。自從他們4月份發(fā)布了新設(shè)計(jì)以來(lái),這是我第一次打開這個(gè)應(yīng)用,但我感覺(jué)這一套界面分外熟悉。
Airbnb的UI改版產(chǎn)生的媒體影響力,并沒(méi)有一個(gè)月后Instagram的改版那么大(可能因?yàn)樗鼪](méi)有一個(gè)光彩奪目的新圖標(biāo)),但它也使用了許多相同的化繁為簡(jiǎn)技巧。
移動(dòng)端的改版設(shè)計(jì)采用了更大更粗的標(biāo)題,去除了不必要的圖形和色彩,簡(jiǎn)化了圖標(biāo),使它們更通用、易識(shí)別。只留下黑白界面,突顯內(nèi)容,功能清晰。
Apple是最近的一個(gè)例子,設(shè)計(jì)師們迷上了化繁為簡(jiǎn)的趨勢(shì)。本月初,Apple的WWDC大會(huì)上,這個(gè)科技巨人發(fā)布了一系列值得期待的更新,包括iOS 10的發(fā)布,他們正在進(jìn)行調(diào)試,“iOS有史以來(lái)最重大更新!”(不過(guò)由于iOS 8時(shí)也這么說(shuō),所以至少是iOS 8以來(lái)最重大的更新)
發(fā)布會(huì)中有一點(diǎn)特別吸引我。那就是Apple Music的改版設(shè)計(jì)。雖然它改版的最重要方面是用戶體驗(yàn)提升和新增功能,但我首先注意到的是它的樸素。Caitlin McGarry,Macworld的本報(bào)記者就很準(zhǔn)確地描述了這次更新,“它有一套全新外觀,巨大的卡片、加大加粗的字體、干凈的白背景,突顯唱片藝術(shù)。”
聽起來(lái)很熟悉吧?這套設(shè)計(jì)與Instagram和Airbnb的設(shè)計(jì)略微有所區(qū)別(他們用的是實(shí)心圖標(biāo)!Apple在搞什么?)但關(guān)鍵元素都在:加大加粗的標(biāo)題,黑白界面。
所有這些意味這什么呢?
我在上文提過(guò),這意味著越來(lái)越多你喜愛(ài)的應(yīng)用會(huì)變得很相似。為什么?就像國(guó)家橄欖球聯(lián)盟(NFL),科技界也是個(gè)相互模仿的圈子。這些改版設(shè)計(jì)都得到了積極正面的反饋(有些人抱怨這些黑白界面“缺乏個(gè)性”,但他們很快就適應(yīng)了。你打開一個(gè)應(yīng)用是為了它的功能,并不是個(gè)性),所以我預(yù)測(cè),新老應(yīng)用都會(huì)踏上化繁為簡(jiǎn)的浪潮。
這意味著iPhone的主屏很快就會(huì)變成一塊彩色的馬賽克,這些鮮艷的入口會(huì)引領(lǐng)你進(jìn)入游樂(lè)場(chǎng)。
現(xiàn)在,無(wú)論你是否支持這種單色的時(shí)尚,它毫無(wú)疑問(wèn)是一個(gè)發(fā)展方向。產(chǎn)品設(shè)計(jì)流程正在發(fā)展和進(jìn)化,不再是從前那種分離式的方式,鼓勵(lì)過(guò)多的設(shè)計(jì),F(xiàn)在的流程更趨于整體,真正關(guān)注用戶。在從前的產(chǎn)品設(shè)計(jì)流程中,UI設(shè)計(jì)師可能會(huì)接過(guò)UX或產(chǎn)品給出的原型圖,要求“把它做漂亮點(diǎn)”。然后設(shè)計(jì)師就會(huì)畫上數(shù)小時(shí)、數(shù)天來(lái)添加、去除、調(diào)整顏色,或許最好的方案可能就一直擺在他們面前……直接用原型圖!由于在如今這個(gè)整體的設(shè)計(jì)流程中,UX和UI設(shè)計(jì)師的界限正變得模糊,設(shè)計(jì)師不必過(guò)分操心自己的具體職責(zé)(例如把它做漂亮點(diǎn)),轉(zhuǎn)而關(guān)注最終目標(biāo),為用戶打造最棒的產(chǎn)品。
化繁為簡(jiǎn)的終極指南!
你是否已經(jīng)接受了化繁為簡(jiǎn)的趨勢(shì),并準(zhǔn)備好踏上這波浪潮了?很好,遵循這些指南,你馬上就會(huì)創(chuàng)造出優(yōu)秀的應(yīng)用。
1. 去除彩色。當(dāng)然,你可以保留一種顏色,但要極度克制地使用它。其他一切最好是黑白的。讓內(nèi)容來(lái)為應(yīng)用填充顏色。
2. 加大、加粗、加黑的標(biāo)題?吹綐(biāo)題了嗎?把它加到20至30像素,并且加重。
3. 簡(jiǎn)潔、纖細(xì)、易辨識(shí)的圖標(biāo)。你的圖標(biāo)最好是通用的,也不能使用彩色。如果想做得更好,應(yīng)該按這個(gè)順序來(lái)排列:主界面、搜索、主操作、次要操作、我。
4. 留白區(qū)域變?yōu)樵瓉?lái)的兩倍……不對(duì),要三倍。甚至可以到四倍。這一點(diǎn)絕不能出錯(cuò)。
5. 應(yīng)用圖標(biāo)更鮮艷。如果你就是喜歡設(shè)計(jì)一些鮮艷閃耀的東西,可以用在應(yīng)用圖標(biāo)上。這是體現(xiàn)個(gè)性和品牌的地方,要讓它光彩奪目!
學(xué)習(xí) · 提示
相關(guān)教程
- 色彩知識(shí),動(dòng)態(tài)色彩設(shè)計(jì)師閉關(guān)修行必備
- 設(shè)計(jì)知識(shí),設(shè)計(jì)中的留白究竟為何?
- 這些設(shè)計(jì)師們,你們都是天才嗎?
- 設(shè)計(jì)小白如何學(xué)習(xí)平面設(shè)計(jì)?
- 設(shè)計(jì)技巧,五招讓你的設(shè)計(jì)不像那么丑
- 漸變教程,如何做出迷人的漸變?
- 包裝設(shè)計(jì),常用的八個(gè)包裝設(shè)計(jì)表現(xiàn)手法
- 字體知識(shí),分享一些字體設(shè)計(jì)的方法
- 三折頁(yè),分享20個(gè)三折頁(yè)設(shè)計(jì)小技巧
- 構(gòu)圖知識(shí),banner如何構(gòu)圖?
推薦教程
- 用戶體驗(yàn),如何讓用戶心動(dòng)?
- 用戶體驗(yàn),分享20個(gè)有影響力的包裝設(shè)計(jì)
- 圖片畫冊(cè)平面設(shè)計(jì)排版ps理論教程
- UI知識(shí),尺寸對(duì)UI設(shè)計(jì)的影響
- 色彩知識(shí),講解顏色基礎(chǔ)知識(shí)和配色理論
- 移動(dòng)設(shè)計(jì),移動(dòng)應(yīng)用導(dǎo)航模式設(shè)計(jì)方法
- 顏色管理,讓自己的照片在網(wǎng)上正確地顯示
- 設(shè)計(jì)界面最常用最舒服的12種顏色(含色
- 調(diào)色知識(shí),簡(jiǎn)單實(shí)用的調(diào)色原理
- Photoshop初級(jí)教程-命令的技巧