網(wǎng)站建設中圓形元素在網(wǎng)頁(yè)設計中的巧妙運用發(fā)布者：本站     時(shí)間：2022-03-26 16:03:15

圓，是一個(gè)優(yōu)雅的形狀，但在優(yōu)雅的同時(shí)似乎還帶著(zhù)一種神秘的格調。也正因為圓形元素擁有這種與生俱來(lái)的特性，所以在與其他元素合作時(shí)，一旦設計師在處理上有所偏差，視覺(jué)上就會(huì )感到格格不入。

圓形元素在網(wǎng)頁(yè)設計中的使用頻率越來(lái)越高，效果卻并不都令人滿(mǎn)意。我們找到一些可圈可點(diǎn)的使用案例，供大家從中汲取靈感。

 

1.眾所周知，圓形元素如果使用不當會(huì )變得和突兀，甚至影響到整個(gè)頁(yè)面的視覺(jué)舒適度，尤其是在簡(jiǎn)單的環(huán)境下，一個(gè)面積較大的圓形元素會(huì )讓頁(yè)面氛圍變得很尷尬。案例所示的正是這樣的情景，但不同的是，圓形的水印效果讓原本尷尬的氣氛完全轉變了。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

2.圓形元素利用在網(wǎng)站導航上是相對比較少見(jiàn)的，而B(niǎo)ronco的網(wǎng)站實(shí)踐了這一想法。圓形元素是一種很搶視線(xiàn)的形狀，這既是優(yōu)點(diǎn)也是缺點(diǎn)。頁(yè)面中的彩色小方塊無(wú)疑會(huì )在第一時(shí)間搶占瀏覽者的眼球，而導航作為網(wǎng)頁(yè)首屏中很重要的一個(gè)組成部分，主要作用在于引導用戶(hù)，也很需要讓用戶(hù)盡早發(fā)現，圓形元素成了不二之選。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

3.這個(gè)網(wǎng)站使用了比較多的圓形元素，從logo到按鈕再到圖標，圓形設計無(wú)處不在。盡管出現頻率很高，但整個(gè)頁(yè)面看起來(lái)卻毫不拖沓，還增強了網(wǎng)頁(yè)的設計感，其中的原因離不開(kāi)周?chē)沫h(huán)境因素與圓形自身的搭配。濾鏡效果、幾何元素與圓形幽靈設計相配合，讓網(wǎng)頁(yè)呈現了一種文藝感。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

4. 極簡(jiǎn)頁(yè)面對于視覺(jué)重點(diǎn)的需求并不是很強烈，最重要的是利用圓形元素在保持頁(yè)面美觀(guān)和平衡的同時(shí)體現頁(yè)面重點(diǎn)。這里所說(shuō)的“平衡”包含了很多細節方面，比如圓形的大小，線(xiàn)型的粗細，色彩等等。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

5.Jarad Johnson的網(wǎng)站用圓形元素把頁(yè)面的條理性變得很強。很有力的提升了網(wǎng)頁(yè)的可讀性和協(xié)調性。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

6.Olive在紋理背景的設計上處理的很恰當。如果是密密麻麻的圓圈一定會(huì )讓大多數人不愿意再看第二眼；如果是相間和稀疏的排列方式又會(huì )顯得和單調無(wú)趣，而Olive這種錯落的無(wú)規則排列滿(mǎn)足了用戶(hù)的視覺(jué)體驗，減輕了圓形中過(guò)于平滑的那一部分。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

7.這個(gè)案例很好的證明了圓形與其他形狀的與眾不同。頁(yè)面中集結了各種類(lèi)型的幾何形狀圖案，而我們第一眼看到的是右上角的圓形元素，這和形狀本身以及它的顏色都有著(zhù)很大的關(guān)系。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

8.黑白紋理總能給我們一種經(jīng)典的時(shí)尚感，Azukisoft的網(wǎng)站正是如此。線(xiàn)性的紋理背景和黑色的圓形色塊互相搭配，為網(wǎng)站營(yíng)造出一種別樣的神秘感，引起用戶(hù)的瀏覽興趣，吸引用戶(hù)點(diǎn)擊。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

9.簡(jiǎn)單的頁(yè)面總是令人捉摸不透。設想一下，假設頁(yè)面中沒(méi)有頂部的黑色圓形色塊，整個(gè)網(wǎng)頁(yè)是不是會(huì )看起來(lái)過(guò)于單薄，了無(wú)生趣？這個(gè)頁(yè)面的色調中性偏冷，因此，如果缺少了吸引人的圓形色塊，頁(yè)面會(huì )變得太輕。

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

10.直接把圓形元素堆在頁(yè)面上可能會(huì )讓人覺(jué)得有點(diǎn)偷懶，那么，像Fannabee的網(wǎng)站一樣，將圓形元素演變成我們都熟悉的物品，是不是讓畫(huà)面更有親切感呢？

圓形元素在網(wǎng)頁(yè)設計中的巧妙運用

 

只要設計師掌握一些基本的使用特點(diǎn)，圓形元素就能被成功駕馭。比如網(wǎng)頁(yè)在布局上可以選擇比較整齊的網(wǎng)格布局方式；又或是讓頁(yè)面變得極簡(jiǎn)，保持一定面積的留白等。