網(wǎng)頁(yè)設(shè)計(jì)中多邊形的玩法

2022-06-04    分類(lèi): 網(wǎng)站建設(shè)

如果你仔細(xì)觀察如今時(shí)下流行的設(shè)計(jì)作品,會(huì)發(fā)現(xiàn)圍繞著多邊形元素,有一系列多種多樣的玩法,比起2年前的Low Poly 插畫(huà)和背景的玩法,來(lái)的更加豐富。這些被親切地稱(chēng)為為 Poly Shapes 的網(wǎng)站、海報(bào)和平面設(shè)計(jì)項(xiàng)目,層出不窮地在各種設(shè)計(jì)的作品集中出現(xiàn),讓人愛(ài)不釋手。
我們常說(shuō)的多邊形,是在二維平面內(nèi)多條直線線段首尾銜接構(gòu)成的中空閉合圖形。在實(shí)際設(shè)計(jì)中,它的形狀多樣,有的中空,有的則填充了色彩,有時(shí)候單個(gè)存在,有時(shí)候會(huì)是成片的多邊形構(gòu)成更為復(fù)雜的視覺(jué)效果,比如3D的視效。
多邊形設(shè)計(jì)元素的運(yùn)用方法非常多樣,它的有趣之處在于它可以兼容各種各樣的使用場(chǎng)景,為設(shè)計(jì)注入不同風(fēng)格的靈魂。

下面讓創(chuàng)新互聯(lián)成都網(wǎng)站建設(shè)公司帶你來(lái)看看多邊形的應(yīng)用吧;


眼前一亮的背景
如果你覺(jué)得目前的設(shè)計(jì)整個(gè)視覺(jué)效果都不咋地的話,不妨試試多邊形風(fēng)格的背景。多邊形元素背景本身就是頗為有趣的元素,無(wú)論是單獨(dú)使用還是和圖片/文本搭配,都能夠創(chuàng)造出讓用戶難忘的效果
上面兩個(gè)網(wǎng)頁(yè)案例雖然使用了不同樣式的多邊形,但是他們所產(chǎn)生的視覺(jué)效果是類(lèi)似的:有趣,讓用戶覺(jué)得驚艷。多邊形圖形讓整個(gè)設(shè)計(jì)更富有深度,提供了動(dòng)感的概念,甚至作為視覺(jué)線索讓用戶明白往哪兒看。
對(duì)于設(shè)計(jì)師而言,多邊形并不難創(chuàng)建,它幾乎可以無(wú)縫地融入任何風(fēng)格、搭配任何色彩、調(diào)和任何排版(目前最為流行的做法是在多邊形中填充微妙的漸變色彩,同時(shí)讓圖形的邊緣顯得非常銳利)。無(wú)論是極簡(jiǎn)的頁(yè)面還是華麗的設(shè)計(jì),你都能將多邊形元素合理的融入進(jìn)去。
創(chuàng)建有趣的圖標(biāo)和裝飾元素
使用多邊形來(lái)創(chuàng)建UI元素(圖標(biāo)和導(dǎo)航元素等)也是最近流行開(kāi)來(lái)的玩法。不規(guī)則的多邊形裝飾,甚至超小的多邊形元素都能讓整個(gè)視覺(jué)更加突出。將圖形和線條連接起來(lái),借助對(duì)比度明顯的配色,可以抓住用戶的眼球。
Chop Chop Agency 使用不同深淺的黃色多邊形拼接出一個(gè)醒目的箭頭,引導(dǎo)用戶點(diǎn)擊。搭配有趣的加載動(dòng)畫(huà),極簡(jiǎn)的設(shè)計(jì)方案,Chop Chop Agency 的頁(yè)面中的這個(gè)黃色箭頭并不會(huì)讓整體顯得混亂,相反讓視覺(jué)有了焦點(diǎn)。而這種設(shè)計(jì)還有一個(gè)隱性的優(yōu)勢(shì),那就是這個(gè)多邊形組成的箭頭可以隨著頁(yè)面的變化轉(zhuǎn)化為其他的形狀,并不復(fù)雜的設(shè)計(jì),帶來(lái)截然不同的體驗(yàn)。
多邊形對(duì)于許多用戶而言,熟悉而又好玩。無(wú)論形狀大小,多邊形對(duì)于大家都是一目了然的。當(dāng)它作為小型的視覺(jué)裝飾而存在的時(shí)候,本質(zhì)上和圓形、方形的元素帶來(lái)的效果沒(méi)啥區(qū)別。
展示元素
由于多邊形所自帶的幾何特征,它比起其他的平面幾何圖形來(lái)的更加自由,也具備更大的自由性,使得設(shè)計(jì)師常常會(huì)用它來(lái)作為展示的“骨架”,呈現(xiàn)輪廓,突出附加信息,幫助用戶更好的展示特定的元素與內(nèi)容。
Ditto 和 Choudhary Lab 兩個(gè)網(wǎng)站在多邊形的使用方法上略有差異,產(chǎn)生總體上是將它作為呈現(xiàn)視覺(jué)元素的框架來(lái)使用。Ditto 這個(gè)頁(yè)面中,多邊形被用來(lái)展示面部視覺(jué)的原理。而Choudhary Lab 這個(gè)網(wǎng)站中,多邊形元素被用來(lái)強(qiáng)化整網(wǎng)站的“科學(xué)氛圍”,以圖標(biāo)和框架的形式,幫助用戶理解這家企業(yè)的職能。
這兩個(gè)案例的共通點(diǎn)在于,它們都運(yùn)用多邊形展示了特定的內(nèi)容,同時(shí)還借助動(dòng)效來(lái)幫助用戶理解。動(dòng)效將頁(yè)面中不同的信息劃分出層次,又連接起來(lái),為整個(gè)體驗(yàn)作出了不小的貢獻(xiàn)。
選對(duì)配色
多邊形本身是中性的元素,它自然也是色彩的天然載體。當(dāng)你想要?jiǎng)?chuàng)造出一個(gè)強(qiáng)色彩主導(dǎo)的設(shè)計(jì)之時(shí),多邊形元素是選。
當(dāng)然,色彩的搭配是無(wú)窮無(wú)盡的,不過(guò)你可以參考下面的思路來(lái)做這件事情:
·彩虹配色+多邊形
·彩色背景下,搭配黑白色的多邊形,參考上面 Creamfields 網(wǎng)站
·漸變色+多邊形
·用多邊形來(lái)承載提亮色,參考上面的Bailey and French 網(wǎng)站
·多邊形內(nèi)填充色彩,或者僅采用輪廓
畫(huà)龍點(diǎn)睛
多邊形并不是用的越多越好,如果你仔細(xì)觀察那些優(yōu)秀的設(shè)計(jì)案例,會(huì)發(fā)現(xiàn)多邊形元素都是起到畫(huà)龍點(diǎn)睛的作用。它可以小到只是一個(gè)LOGO,當(dāng)然,你也可以將它往大了用,作為裝飾性元素,與品牌設(shè)計(jì)呼應(yīng),讓用戶無(wú)法忽視它的存在。
上面的兩個(gè)案例就非常的典型,無(wú)論大小,都很好的抓住了用戶的注意力,并不需要進(jìn)行復(fù)雜多樣的設(shè)計(jì),僅僅是貼合主題、品牌LOGO的多邊形元素,或大或小,提升了整體設(shè)計(jì)的現(xiàn)代感,呼應(yīng)主題,畫(huà)龍點(diǎn)睛。
結(jié)語(yǔ)

形狀作為設(shè)計(jì)中最常用到的元素,大家都很熟悉。之前的Low poly 元素的流行讓大家對(duì)于多邊形設(shè)計(jì)元素的玩法了有基本的概念,而這幾年扁平化設(shè)計(jì)的醞釀和沉淀,多邊形元素的玩法也越來(lái)越多,從純粹的視覺(jué)裝飾到功能性的引導(dǎo)元素,多邊形開(kāi)始變得越來(lái)越有趣。


本文來(lái)自創(chuàng)新互聯(lián)品牌網(wǎng)站建設(shè)網(wǎng)站設(shè)計(jì)制作公司-創(chuàng)新互聯(lián)
標(biāo)簽:創(chuàng)新互聯(lián), 成都網(wǎng)頁(yè)設(shè)計(jì)公司, 成都網(wǎng)站設(shè)計(jì)公司, 重慶網(wǎng)站建設(shè)公司

文章題目:網(wǎng)頁(yè)設(shè)計(jì)中多邊形的玩法
標(biāo)題路徑:http://muchs.cn/news/163215.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供外貿(mào)建站、網(wǎng)頁(yè)設(shè)計(jì)公司、網(wǎng)站維護(hù)微信小程序、虛擬主機(jī)、品牌網(wǎng)站設(shè)計(jì)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

外貿(mào)網(wǎng)站建設(shè)