2016-10-07 分類: 網(wǎng)站設(shè)計(jì)
經(jīng)過(guò)多年的平淡,材料和完全簡(jiǎn)約的風(fēng)格,漸變已經(jīng)卷土重來(lái)。無(wú)論你在哪里,設(shè)計(jì)師們都在使用褪色的顏色來(lái)增加視覺(jué)興趣,創(chuàng)造用戶參與,設(shè)計(jì)一些值得一看的東西。如果你不喜歡漸變,也許是時(shí)候重新考慮你在這個(gè)問(wèn)題上的立場(chǎng)了。為了說(shuō)服你,我們有10個(gè)理由在你的網(wǎng)站設(shè)計(jì)項(xiàng)目中愛(ài)上使用漸變。
1.背景創(chuàng)建興趣
漸變可以創(chuàng)建視覺(jué)興趣,并通過(guò)設(shè)計(jì)幫助用戶移動(dòng)。眼睛會(huì)在一個(gè)顏色區(qū)域著陸,色調(diào)和光線和暗區(qū)之間的變化可以幫助將焦點(diǎn)轉(zhuǎn)移到屏幕上。
漸變可以是一個(gè)非常有用和迷人的設(shè)計(jì)工具,并為眾多的項(xiàng)目添加火花和陰謀。雖然有很多使用漸變的方法,但最受歡迎的選項(xiàng)之一是作為背景元素的圖片、文本和其他元素。
下面的示例使用了這種精確的技術(shù)。漸變?yōu)檠劬μ峁┝艘粋€(gè)休息的地方,它可以幫助你從屏幕的頂部到下一個(gè)角落,在那里你可以找到更多的方向。
漸變可以通過(guò)頁(yè)面的其他部分,在滾動(dòng)頁(yè)面下方,這樣用戶就可以隨時(shí)記住它們的位置。它還提供了一個(gè)光暈類型區(qū)域,突出了主要的導(dǎo)航。
2.刻字可以提供重點(diǎn)
正如一個(gè)漸變可以在背景中使用一樣,它也可以是一個(gè)前景元素。顏色漸變是一種非常通用的技術(shù),可能會(huì)對(duì)它們的整體流行程度有所幫助。
翻轉(zhuǎn)使用和前景漸變可以作為填充在一個(gè)更簡(jiǎn)單的背景上,突出并引起注意。
顏色的選擇必須是有意的,這樣才能保持足夠的對(duì)比度和可讀性。
3.疊加可以調(diào)出平淡的圖像
一個(gè)顏色疊加可以給一個(gè)有點(diǎn)乏味的圖像增加額外的興趣。一個(gè)漸變疊加不是一個(gè)低分辨率或低合成圖像的修復(fù),但是它可以給一個(gè)簡(jiǎn)單的場(chǎng)景更多的流行。
梯度覆蓋可以幫助建立品牌,以及網(wǎng)站的聲音、語(yǔ)氣和個(gè)性。鮮艷的顏色與柔和的選擇截然不同。
盡管這一技術(shù)看起來(lái)很整潔,例如下面的組合示例,但它開(kāi)始有點(diǎn)過(guò)度使用了。一定要做一些與完整的圖像不同的東西,梯度覆蓋來(lái)將你的設(shè)計(jì)分開(kāi)。下面的例子是通過(guò)完全消除圖像,使?jié)u變的底部在屏幕的底部創(chuàng)建一個(gè)純色條。
4.幫助移動(dòng)眼睛
一個(gè)巨大的漸變可以幫助你的眼睛通過(guò)設(shè)計(jì),從而幫助用戶創(chuàng)建意圖。大多數(shù)用戶從左上角開(kāi)始,在屏幕上向下移動(dòng),在某種程度上閱讀了f型模式。
使用漸變顏色方案中較輕和較暗的區(qū)域,將眼睛從起始點(diǎn)(如徽標(biāo)或主要消息)移動(dòng)到主要調(diào)用動(dòng)作。眼睛會(huì)先進(jìn)入顏色最淺的區(qū)域,然后移動(dòng)到較暗的空間。設(shè)計(jì)并放置漸變顏色以加強(qiáng)眼球運(yùn)動(dòng)。
5.創(chuàng)造令人難忘的東西
當(dāng)漸變變得越來(lái)越流行的時(shí)候,每個(gè)顏色組合都有些不同,這讓用戶難以忘懷。一個(gè)殺手級(jí)的顏色組合可以堅(jiān)持使用,一個(gè)用戶幫助他們記住你的品牌或消息。
設(shè)計(jì)漸變的目的是幫助創(chuàng)建連接。一個(gè)好的漸變的酷之處在于它幾乎變成了一種顏色。如果你有一個(gè)很大的漸變,就像你在你的品牌調(diào)色板中使用其他顏色來(lái)建立一個(gè)視覺(jué)連接一樣。(或者使用多個(gè)漸變作為調(diào)色板。)
6.強(qiáng)調(diào)品牌色彩
如果你的品牌顏色適合搭配,使用漸變。對(duì)于試圖建立自己的新品牌或網(wǎng)站,這可能是建立品牌和與用戶建立聯(lián)系的堅(jiān)實(shí)途徑。
想想如何將同樣的漸變風(fēng)格融入到網(wǎng)站的多種用途中――在網(wǎng)站上,在平面媒體或廣告宣傳中??吹较嗤伾南嗤伾谙嗤臐u變中會(huì)開(kāi)始粘在用戶身上,他們會(huì)把這些顏色和你聯(lián)系起來(lái)。
下面的例子,社區(qū)銀行,就是這樣做的。顏色的選擇是有趣的和梯度-在照片和底部導(dǎo)航欄-加強(qiáng)調(diào)色板和它與品牌的關(guān)系。
7.他們很容易創(chuàng)建(或生成)
在圖像中添加一個(gè)漸變或從頭創(chuàng)建一個(gè)漸變可以簡(jiǎn)單到選擇兩到三種顏色,然后選擇漸變的形狀,顏色應(yīng)該從哪里開(kāi)始,停止和重疊。
梯度,在形狀上是定向的,從左到右或向上或向下;或徑向,顏色的變化從一個(gè)點(diǎn)以圓形的方式發(fā)散。一個(gè)設(shè)計(jì)可以包含一個(gè)或多個(gè)漸變樣式。
選擇漸變的顏色可能是最困難的一步。在色輪附近使用顏色將會(huì)產(chǎn)生最互補(bǔ)和自然的梯度。但這并不總是你必須要做的。在這種情況下,你會(huì)想要使用顏色,這樣你就不會(huì)在你的主要顏色選擇的空間里出現(xiàn)討厭的色調(diào)。
需要做一個(gè)漸變,不相信你的技能?試試這些工具中的一個(gè):
WebGradients:在CSS、PNG、Sketch和Photoshop中免費(fèi)收集180+預(yù)制梯度色板。
漸變按鈕:帶有動(dòng)畫(huà)懸停狀態(tài)的漸變按鈕的CSS。
梯度波發(fā)生器:用你自己的顏色做一個(gè)很酷的梯度波,開(kāi)始和停止。
8.顏色淡化感覺(jué)自然
雖然這可能不是你的第一個(gè)想法,但漸變的顏色和組合往往是自然的。想想吧,不是自然界的所有東西都是純綠色的。
漸變是這個(gè)原因的自然選擇,特別是當(dāng)你將會(huì)在自然界中逐漸消失的顏色結(jié)合起來(lái)的時(shí)候。
下面的插圖是一個(gè)非常明顯的例子,天空從白天(橙色)到夜晚(藍(lán)色)逐漸消失。
9.當(dāng)你沒(méi)有主導(dǎo)視覺(jué)時(shí)創(chuàng)造藝術(shù)
一個(gè)好的漸變可以創(chuàng)造視覺(jué)興趣和視覺(jué)顯示,當(dāng)你沒(méi)有太多的工作。使用明亮的顏色,例如下面的例子,或品牌顏色可以幫助建立你的網(wǎng)站的存在。
顏色的變化是非常有趣的,它們可以作為一個(gè)設(shè)計(jì)元素單獨(dú)存在。思考你如何使用,選擇顏色,這樣他們就能為用戶創(chuàng)造正確的情感吸引力,并幫助他們找到與內(nèi)容相關(guān)聯(lián)的正確感覺(jué)。即使是一個(gè)細(xì)微的漸變,也可以為設(shè)計(jì)定下基調(diào)。
10.漸變趨勢(shì)
漸變是一種簡(jiǎn)單易用的元素,可以讓你在不感到壓力的情況下添加一些時(shí)尚元素。用這么多的方法來(lái)使用梯度,這可能是你的選解決方案。雖然漸變已經(jīng)不再受歡迎,但它們往往會(huì)很快回來(lái),因?yàn)樗鼛缀蹙哂衅毡榈奈Α?/p>
本文題目:讓你在你的網(wǎng)站設(shè)計(jì)項(xiàng)目中愛(ài)上使用漸變10個(gè)理由
分享網(wǎng)址:http://jinyejixie.com/news/48787.html
網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷seo公司;服務(wù)項(xiàng)目有網(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)
猜你還喜歡下面的內(nèi)容