當(dāng)前位置：首頁(yè) >UI設(shè)計(jì) >解讀最新UI設(shè)計(jì)趨勢(shì)，探討新擬態(tài)風(fēng)格的特征和優(yōu)缺點(diǎn)

解讀最新UI設(shè)計(jì)趨勢(shì)，探討新擬態(tài)風(fēng)格的特征和優(yōu)缺點(diǎn)

發(fā)布時(shí)間：2024-08-12 09:29:25 瀏覽量：268次

相信最近很多小伙伴在逛Dribbble時(shí)候，發(fā)現(xiàn)最近流行一波新的設(shè)計(jì)風(fēng)格，和以往不同的是，這次趨勢(shì)又回到之前擬物化了，但它與純擬物化還是有區(qū)別的，現(xiàn)在它有一個(gè)流行詞語(yǔ)叫“新擬態(tài)”，今天就和大家分享下國(guó)外一位設(shè)計(jì)師對(duì)這個(gè)趨勢(shì)的看法！

一、擬態(tài)化是什么？

雖然UI以各種擬態(tài)化的形式存在（例如，您的桌面OS垃圾桶），現(xiàn)在這種風(fēng)格的趨勢(shì)更加明顯。正如卡米爾·法拉納（Kamil Falana）指出的那樣，從無(wú)生命的“表達(dá)”到現(xiàn)實(shí)主義的過(guò)渡開(kāi)始出現(xiàn)。

不久前，我們還觀察到，這種變化開(kāi)始在我們身邊發(fā)生，蘋(píng)果（iOS13系統(tǒng)）就是一個(gè)很好的例子。向最小化設(shè)計(jì)和輕擬物化發(fā)展，最終帶來(lái)了無(wú)紋理3D視覺(jué)感官。受到了大家的喜歡，來(lái)看一張高清圖。

Apple Pencil

...

二、擬物化風(fēng)格的回歸，會(huì)更好嗎？

如下圖設(shè)計(jì)風(fēng)格，在dribbble上獲得認(rèn)可度比較高！

Dribbble用戶alexplyuto的作品獲得了四千多次贊，并帶動(dòng)了這一趨勢(shì)。

...

三、新風(fēng)格的特征點(diǎn)

由于按鈕的視覺(jué)表現(xiàn)看著變化不大（因?yàn)樾×艘恍?，不直觀），因此我們將重點(diǎn)放在實(shí)際的卡片概念上，以使這種視覺(jué)表現(xiàn)更能直觀感受出來(lái)。

擬態(tài)化卡片（左圖）、現(xiàn)代材料卡片（右圖）

...

四、優(yōu)缺點(diǎn)

這種風(fēng)格的主要好處是“新鮮”（至少持續(xù)很長(zhǎng)時(shí)間）。它為界面帶來(lái)了“新感覺(jué)”，并使其脫穎而出。它也可以與其他樣式混合使用，這樣就避免很呆板整個(gè)畫(huà)面變成這種柔軟凸起的效果。

...

1. 可見(jiàn)性

...

2. 易用性

...

五、僅僅是卡片嗎？

...

六、開(kāi)發(fā)

開(kāi)發(fā)實(shí)現(xiàn)其實(shí)它比我們認(rèn)為的在CSS中實(shí)現(xiàn)“軟陰影”外觀要容易。我們尚未研究Swift和Kotlin，但我認(rèn)為這不應(yīng)該成為問(wèn)題。

...

七、其他影響

剛才說(shuō)的形狀只是一方面。這種設(shè)計(jì)新樣式還帶有更多的按鈕和圖標(biāo)。通常情況下，我們只需要回到“過(guò)去的美好時(shí)光”并使用位圖。這似乎是一種回歸，不必?fù)?dān)心-這是沒(méi)有必要的。

...

八、我們真的需要這些嗎？

盡管這一新趨勢(shì)影響了許多設(shè)計(jì)師，但對(duì)比以前使用的卡片組件可訪問(wèn)性問(wèn)題相比，它的問(wèn)題并不那么嚴(yán)重。

...

九、個(gè)人感悟

本篇文章，作者通過(guò)對(duì)新擬態(tài)設(shè)計(jì)趨勢(shì)分析，在文中提及“新擬態(tài)”和以前材料卡片的區(qū)別，同時(shí)證實(shí)了新擬態(tài)風(fēng)格優(yōu)勢(shì)！但也存在一定的弊端！如何去權(quán)衡與設(shè)計(jì)的把控，需要設(shè)計(jì)師們多去研究探索！

就我個(gè)人而言，我認(rèn)為目前新擬態(tài)設(shè)計(jì)風(fēng)格，其實(shí)更適合像車(chē)機(jī)那種偏實(shí)體硬件的HMI設(shè)計(jì)又或者智能硬件平臺(tái)，智能櫥窗，智能鏡等，但是如果在移動(dòng)端去使用，那么需要去適當(dāng)做簡(jiǎn)化。如何去簡(jiǎn)化以適應(yīng)新趨勢(shì)，這需要不斷去嘗試。

最后作者也說(shuō)了新擬態(tài)設(shè)計(jì)風(fēng)格，需要注意的是對(duì)比度問(wèn)題，需要將該效果應(yīng)用到合適的位置，如果是操作組件上，那么它的反饋態(tài)和常態(tài)都需要有明顯的對(duì)比。