激情六月丁香婷婷|亚洲色图AV二区|丝袜AV日韩AV|久草视频在线分类|伊人九九精品视频|国产精品一级电影|久草视频在线99|在线看的av网址|伊人99精品无码|午夜无码视频在线

高校合作1：010-59833514 ?咨詢電話：400-810-1418 服務(wù)與監(jiān)督電話：400-810-1418轉(zhuǎn)接2

最實(shí)用的UI設(shè)計(jì)極簡(jiǎn)風(fēng)格設(shè)計(jì)指南

發(fā)布時(shí)間：2024-03-11 14:53:23 瀏覽量：256次

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



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


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


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


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


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



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


下面我結(jié)合案例逐個(gè)解說(shuō)：


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



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


2、UI元素要微妙和圓潤(rùn)



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


之前一度非?；馃岬?Clubhouse 就使用了類似摩登極簡(jiǎn)風(fēng)的設(shè)計(jì)，這樣的設(shè)計(jì)整個(gè) APP 保持格調(diào)又足夠友好。


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


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



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


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



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


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


5、成熟的配色方案



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


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


6、對(duì)于對(duì)比度的精妙控制



摩登極簡(jiǎn)風(fēng)格的優(yōu)點(diǎn)之一，就是它良好的可訪問(wèn)性，而絕大多數(shù)講究視覺(jué)吸引力的設(shè)計(jì)風(fēng)格在這一點(diǎn)上確實(shí)比不上它。不過(guò)為了確保這一點(diǎn)，在設(shè)計(jì)的時(shí)候，需要通過(guò)配色、投影和微妙的描邊之類的小技巧，來(lái)確保控件和背景之間有清晰的對(duì)比度，有足夠的視覺(jué)層次感。


7、控制特效的使用程度



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


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



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


結(jié)語(yǔ)


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


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


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

來(lái)源網(wǎng)絡(luò)

熱門(mén)課程推薦

熱門(mén)資訊

請(qǐng)綁定手機(jī)號(hào)

獲取驗(yàn)證碼
x

同學(xué)您好！

您已成功報(bào)名0元試學(xué)活動(dòng)，老師會(huì)在第一時(shí)間與您取得聯(lián)系，請(qǐng)保持電話暢通！
確定