添加時(shí)間:2016/3/1 11:31:42 編輯:奇億網(wǎng)站建設公司
設計出不同凡響的網(wǎng)站是許多設計師一直追求的事情,所以大家著(zhù)迷各種時(shí)尚的元素,漂亮的配色,流行的趨勢,復古的樣式,等等。經(jīng)過(guò)時(shí)間驗證的經(jīng)典設計、固定的搭配是不錯的選擇,而逐步展露頭角的新趨勢,則能更好的滿(mǎn)足這一需求。
一種全新的設計手法,融合了最新的設計技巧,展現和前人不同的氣場(chǎng),用更現代的氣質(zhì)來(lái)承載內容,這樣的網(wǎng)站無(wú)疑會(huì )更加吸引用戶(hù),讓訪(fǎng)客難以忘懷。今天要聊的三種設計趨勢其實(shí)已經(jīng)出現一陣子了,但是作為一種相對綜合的設計手法,他們并沒(méi)有引起廣泛的關(guān)注。只需要使用現有的元素、色彩和排版手法,就可以實(shí)現這三種設計效果,但是它們不論是從美學(xué)特征上,還是從功能性上,都不輸于其他的趨勢。有興趣么?不妨來(lái)看看吧。
1、雙色調配色方案
雙色調配色已經(jīng)存在很長(cháng)的一段時(shí)間了,單我們幾天所說(shuō)的雙色調方案是在全屏設計背景下,加入漸變效果和高沖擊力視覺(jué)設計下的雙色調配色方案。在扁平化的大勢之下,Spotify 大范圍使用雙色調配色,將這一設計手法推到了潮頭。
那么雙色調配色具體是怎么一回事呢?
簡(jiǎn)單說(shuō)來(lái),是兩種色彩來(lái)構成一套配色。最常見(jiàn)的雙色調配色會(huì )選擇互補色來(lái)進(jìn)行組合。在更復雜的場(chǎng)合中,會(huì )使用其他的組合來(lái)營(yíng)造特定的感覺(jué),打破約定俗成的配色風(fēng)格,可能會(huì )有驚喜。
大多數雙色調效果是使用一個(gè)色彩鮮艷的色調疊加在照片上實(shí)現的,強化深淺色彩對比,從而營(yíng)造出色彩沖擊力。Shopify 對于這種手法的運用非常的純熟,在恰當的排版設計搭配下,將數十位設計師照片以這種獨特的方式展現出來(lái)。
從技術(shù)的角度上來(lái)看,雙色調配色可以同許多其他的設計手法、技術(shù)一同搭配使用,比如全屏設計,比如響應式設計,比如插畫(huà),正如同上面的那些案例中的諸多技術(shù)一樣。除了獨特的視覺(jué)效果,它可以用來(lái)強調,對比。這是一種非常強的表現手法,用的時(shí)候記得適量使用。
2、分屏式設計
分屏式的網(wǎng)頁(yè)設計案例正在成倍增長(cháng)。從技術(shù)上來(lái)講,這類(lèi)網(wǎng)頁(yè)的設計師喜歡將屏幕均分為并排的兩個(gè)區塊,兩者尺寸大小都一樣,有的時(shí)候還會(huì )加上輪廓來(lái)強調區域的概念。
這樣設計的效果是很酷炫的,在代碼編寫(xiě)到位的情況下,網(wǎng)頁(yè)在桌面端打開(kāi)的時(shí)候,兩個(gè)區塊并排顯示,而在移動(dòng)端上,并排的區塊智能地以上下堆疊的形式呈現出來(lái)。
分屏是設計的使用其實(shí)是可以嵌套細分的,它可以是簡(jiǎn)單的對半分,也可以套個(gè)柵格,無(wú)限分割下去,這樣的案例非常的多。被劃分的區塊可以承載相似的、對比的內容,也可以承載截然不同的媒體類(lèi)型,而柵格式細分的區塊還能幫助網(wǎng)站的設計者探索用戶(hù)真正感興趣的內容。
分屏式設計對用戶(hù)是友好的,和響應式設計可以很好地結合起來(lái),同時(shí)還可以加入更多的新技術(shù)和設計手法。
下面是一些高效分屏的技巧:
當你沒(méi)有太強的視覺(jué)設計之時(shí),注意字體和色彩的搭配
吸引用戶(hù)的注意力讓他們從左向右看,從而引導用戶(hù)的視覺(jué)運動(dòng)。
使用色塊來(lái)分割屏幕,為主要信息留下足夠的空間,確保整體的可讀性。
將分屏視作為超大的卡片。將不同的內容制作成更小的區塊,在大的卡片中組成馬賽克。
盡量確保每個(gè)區塊中內容的簡(jiǎn)單易讀。
3、空間共享式排版
你可能在其他地方看到過(guò)這個(gè)趨勢:文字排版被延伸到了共享的設計空間。在絕大多數的網(wǎng)站中,圖像、背景和文字是最主要的元素,它們要么相互嵌套有機組合,要么相互分離。
但是越來(lái)越多的設計師開(kāi)始試圖打破元素之間的界限,不同類(lèi)型的視覺(jué)元素打破固有的位置,進(jìn)入其他元素的空間,堆疊,交叉,錯落?雌饋(lái)還是非常有趣的。
但是考慮到整體的可讀性,這種設計還是相當具有挑戰性的。
要使用這種設計技巧,最好搭配以簡(jiǎn)單的排版。文字應當同其他的元素有足夠的對比性,從而確保它在橫跨多個(gè)不同元素的時(shí)候,保持基本的可讀性和辨識度。這也使得絕大多數這類(lèi)網(wǎng)站都傾向于使用黑色和白色的文字。
字體尺寸也是一個(gè)值得注意的屬性,它和色彩控制同樣重要。你還需要注意文本部分在不同尺寸的屏幕上的顯示和運動(dòng),也就是響應式變化中的斷點(diǎn)。
在諸多設計案例中,最值得注意的是Deux Huit Huit 。橫跨首頁(yè)主圖的文字的運動(dòng)方式,當它穿越圖片、背景的時(shí)候,是如何確保它的可讀性的。
結語(yǔ)
各種各樣的設計趨勢很多,許多趨勢在你剛剛了解它們的時(shí)候就已經(jīng)過(guò)時(shí)了,那些真正站得住腳的趨勢大多能同其他的技術(shù)、趨勢、設計手法能很好的兼容、搭配。而今天我們所說(shuō)的三個(gè) 趨勢正好符合這一特征,它們能夠兼容現代的風(fēng)格,流行的布局與開(kāi)發(fā)框架,更重要的是它們能看,夠看,好看,也不會(huì )破壞你的審美。
實(shí)現它們并不難,更新、替換、刪除也不是麻煩的事情,如果你看厭了現在的網(wǎng)站首頁(yè),不妨試試這些新東西,也許能讓你心情更好,讓用戶(hù)獲得驚喜。