熱評 超仔?

首先得分清楚,國外和國內(nèi)的區(qū)別。國外用戶思維比較單純、單一,過渡復(fù)雜的信息他們無法在短時間內(nèi)瞬間理清思緒,所以國外的設(shè)計通常只會把最重要的信息外露即可,同時他們并不追求效率,他們更崇尚事情單一路徑化和簡單的目標(biāo)化?。。。。?!而國內(nèi)用戶在信息尋找中為高效,面對信息的處理已經(jīng)被國內(nèi)市場教育得很好了,所以國內(nèi)更多強調(diào)數(shù)據(jù)的橫向?qū)Ρ榷葟亩T導(dǎo)用戶快速篩選內(nèi)容,在空間上和入口處瘋狂在各其他頁面制造入口,目的都是為了提升點擊率和到達(dá)率?。。。?!這是兩種不同的思維方式也是兩種不同的國情?。。。。。≈劣陲L(fēng)格是否適應(yīng)中文的APP,或者內(nèi)容外露的增減是需要跟產(chǎn)品或者領(lǐng)導(dǎo)有一個漫長的博弈過程的。

編者按:這篇文章來自資深設(shè)計總監(jiān) Diana Malewicz,她根據(jù)實際經(jīng)驗和設(shè)計流行趨勢總結(jié)了梳理了當(dāng)下可能是最有效的「摩登極簡風(fēng)」的設(shè)計指南:

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

我一直期待出現(xiàn)一種全新的、功能性的、在視覺上還足夠吸引人的風(fēng)格出現(xiàn),但是這種設(shè)計風(fēng)格一直都沒有出現(xiàn)。

其實,如果單從視覺吸引力上來說,很多新的設(shè)計風(fēng)格是能夠做到這一點的,但是其中有的足夠吸睛但是可讀性不足,有的足夠友好但是不夠高級。好在廣大設(shè)計師在逐漸的迭代的過程中,逐漸找到了在美學(xué)、功能和視覺吸引力上的平衡點,而這正是我要在今天的文章中分享的。

我愿將這種設(shè)計風(fēng)格定義為「摩登極簡」。和其他的設(shè)計風(fēng)格相比,它相對更加簡約,但是和 Material Design 和傳統(tǒng)的扁平化設(shè)計相比又不會顯得單調(diào)枯燥,接下來,我們來看看如何實現(xiàn)這種風(fēng)格的視覺效果吧!

主要的8個風(fēng)格特征

我將這種設(shè)計風(fēng)格的特征梳理成為以下8個特征:

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

  1. 明亮的背景和充足的留白
  2. UI元素要微妙和圓潤
  3. 大而可讀性良好的標(biāo)題
  4. 現(xiàn)實題材的攝影
  5. 成熟的配色方案
  6. 對于對比度的精妙控制
  7. 控制特效的使用程度
  8. 有趣的小細(xì)節(jié)和插畫

下面我結(jié)合案例逐個解說:

1、明亮的背景和充足的留白

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

在摩登極簡設(shè)計風(fēng)當(dāng)中,留白為王。界面的整個視覺特征最容易被注意到的是白色或者帶有其他色彩傾向的非常明亮的背景上。大量的留白和足夠明亮的背景能夠讓整體看起來干凈、且美觀。

2、UI元素要微妙和圓潤

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

摩登極簡風(fēng)的 UI 當(dāng)中,UI 元素通常都呈現(xiàn)出微妙而柔和的圓潤效果,這樣會讓界面看起來更加有機(jī)和友好。

之前一度非常火熱的 Clubhouse 就使用了類似摩登極簡風(fēng)的設(shè)計,這樣的設(shè)計整個 APP 保持格調(diào)又足夠友好。

對我個人而言,圓角是更加令人愉悅的一種設(shè)計元素,不過在這種風(fēng)格中,使用圓角的訣竅在于不能讓圓角半徑過大,否則會顯得非常奇怪。

3、大而可讀性良好的標(biāo)題

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

大標(biāo)題能能夠帶來更強的幾何和塊面感,無論是襯線字體還是非襯線字體,不過為了保持摩登極簡在風(fēng)格氣質(zhì)上的統(tǒng)一,我通常傾向于使用幾何感較強的非襯線字體。比如Gilroy、Sofia Pro、Lufga 或Circular,此外還可以嘗試Pulp、Gordita、Visby、Konnect、Geliat、Galano或+Jakarta Sans。

4、現(xiàn)實題材的攝影圖片

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

這一點其實非常重要。攝影作品相對而言能夠提供的細(xì)節(jié)信息量和整體的真實感會強烈很多,而且從設(shè)計的總體趨勢上而言,大家似乎開始開始厭倦了 3D 渲染、扁平人物插畫和手繪涂鴉。真實照片的好處和優(yōu)勢就在于它的真實感。

在題材上,攝影圖片通常會看起來更加嚴(yán)肅和正式,在情感層面上也更容易喚起用戶與現(xiàn)實生活相關(guān)的情緒。

5、成熟的配色方案

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

摩登極簡風(fēng)格在配色上同樣講究的是簡約感。所以除了大量的白色之外,基本上就是挑選合適的主色以及少量的強調(diào)色了。

摩登極簡設(shè)計風(fēng)整體上并不需要大片的色彩來引起用戶的注意,在絕大多數(shù)時候都只是用主色做點綴。

6、對于對比度的精妙控制

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

摩登極簡風(fēng)格的優(yōu)點之一,就是它良好的可訪問性,而絕大多數(shù)講究視覺吸引力的設(shè)計風(fēng)格在這一點上確實比不上它。不過為了確保這一點,在設(shè)計的時候,需要通過配色、投影和微妙的描邊之類的小技巧,來確??丶捅尘爸g有清晰的對比度,有足夠的視覺層次感。

7、控制特效的使用程度

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

摩登極簡風(fēng)其實有從很多不同的設(shè)計風(fēng)格當(dāng)中汲取靈感,微妙的色彩陰影,模糊的漸變極光背景,浮雕甚至亞克力式的透明效果,這些視覺風(fēng)格效果在一定程度上是能夠提升UI界面的質(zhì)感和效果的,但是一定要保證這些風(fēng)格化的元素不是同時出現(xiàn)的,否則會讓整體的效果看起來雜亂無章。

8、有趣的小細(xì)節(jié)和插畫

2021年最實用的摩登極簡風(fēng) UI 設(shè)計指南

當(dāng)然,摩登極簡風(fēng)的設(shè)計對于細(xì)節(jié)設(shè)計同樣是有追求的。盡管它整體上保持簡約,但是在小元素上,比如圖標(biāo)、emoji、小裝飾上,同樣可以是兼容的,用好圖案、拼貼、小插畫(當(dāng)然要保持克制),將這些元素和強調(diào)色以及攝影照片穿插起來使用,是能夠讓摩登極簡風(fēng)格更加友好,令人愉悅的。

結(jié)語

我真的非常欣賞和喜歡摩登極簡風(fēng)所創(chuàng)造的這種氛圍,它給 UI 界面所帶來的這種友好的質(zhì)感,在某種程度上,正是如今絕大多數(shù)的 UI 設(shè)計項目所面臨的挑戰(zhàn)。

雖然這種設(shè)計風(fēng)格是脫胎于很多 Dribbble 上的飛機(jī)稿,但是這種風(fēng)格在如今切切實實地應(yīng)用到真實產(chǎn)品當(dāng)中,并且更加能夠解決實際需求和問題。

在現(xiàn)如今這個時間節(jié)點,簡約的設(shè)計風(fēng)格對于用戶而言有著巨大的價值,能夠保持簡約還能確保整體的愉悅感,摩登極簡風(fēng)應(yīng)該是下一個階段,越來越多設(shè)計師和產(chǎn)品會擁抱的設(shè)計趨勢。

收藏 249
點贊 135

復(fù)制本文鏈接 文章為作者獨立觀點不代表優(yōu)設(shè)網(wǎng)立場,未經(jīng)允許不得轉(zhuǎn)載。