132-8888-7891
網頁設計玩轉9種最常見的Banner設計風格技巧
 2018-09-10 09:18 微力互聯小編
網頁設計是網站建設的基礎,任何一個外觀美麗、大方、穩重的網站必然有一個經驗充足、技術能力強的前端設計師,盡管我們看一個網站,無非就是文字、圖片、連接三種基本樣式組成,然而在設計師的眼中網站的任何一個網頁就是一張圖片,從網頁設計的角度去看一個網頁,網頁的組成部分分為header、Logo、Banner、內容和footer等四個重要內容組成,其中banner設計的樣式以及風格決定了整個網站的色彩和情感,也是網站帶給用戶的第一感覺。
banner的設計過程可以分為五步:
一、了解需求
二、根據需求確定設計風格
三、根據素材和文案確定版式
四、構成banner的元素的設計(文案/背景/點綴/素材)
五、調整配色
 
   從整個設計風格中,我們可以直觀的看出設計風格方向和特點,找到我們網頁適合的風格和方向才是最為重要的,整體性的搭配取決不網站建設過程中的最初走向。
 
一. 了解需求
   做任何設計的前提就是了解設計需求,只有弄明白需求方到底想要什么,我們才能少改幾次稿。我剛參加工作的時候就沒少吃這方面的虧,那時候剛進公司臉皮薄,別人讓干啥就立馬擼起袖子打開ps開始工作。不明白的地方也不敢問太多,怕打擾別人工作。事實證明,這種想法是多么大的錯誤。
 
需要了解的需求大體可以總結成以下幾個方面。
1. 確定文案信息、素材、尺寸大小、投放的平臺
   一般接到設計需求的時候,文案和素材都是需求方確定好的。但是有的需求方會說,你可以根據你的設計需要,稍微改動文案信息。本人親身經歷,這句話真的是一個火坑。文案的不確定會嚴重的影響設計進程,你改得好,改得他們滿意還好,如果不滿意,那就面臨著重做。除此之外,有時候我們可以從文案和素材里獲取設計靈感,確定設計的風格。
 
2. 確定banner是為了實現什么目的而設計
   比如需求方給到的文案信息是「金秋助學」,我們需要了解金秋助學的對象是誰,是大學生還是小學生,這會影響風格的確定和設計元素的選擇。還要了解需求方想要這個banner起到什么作用,是想讓更多人參與到這個活動中來,還是想通過這個banner讓更多人了解某某企業熱心于慈善事業,提升企業的知名度和好感,只有確定這些才能確定你的設計風格。
 
3. 詢問需求方的建議
   需求方在把這個需求給到我們之前,可能心里就已經有了自己的想法,如果我們在設計之前可以了解到,會很大的降低改稿次數。而且我們主動詢問他們的意見,會讓他們感覺到自己的想法受到了尊重,以后交流起來也會更愉快。但是有時候他們的想法用語言可能描述不出來,這個時候我們可以用「情緒板」的方法,快速的獲取視覺信息。
 
4. 確定設計時間
  如果時間很緊張,就盡量選擇不易出錯的板式和風格,如果時間比較充裕,可以細細打磨設計作品,多嘗試一些以前沒嘗試過的表現方法。
 
 
二. 根據需求確定設計風格
   banner的設計風格可以拿人作為比對很好理解。有人外向,有人內斂。而這兩種人的穿衣風格和舉止言行在生活中也是不盡相同。和人難過會用哭表現,高興會用笑表現一樣,不同的設計風格,也對應不同的表現方法。下面我們主要分析不同的設計風格對應的表現方法,及給大家安利的一些可參考使用的素材,覺得有用的同學別忘了做下筆記。
 
1. 關鍵詞:文藝、氣質、素雅、安靜
總結:
(1)最明顯的特點就是留白,大量的留白。
(2)字體多采用宋體這樣的襯線體,除一級標題字號略大些,其他的文案都非常小,給人精致的感覺。
(3)色彩以灰白色系為主,其他的色彩飽和度和純度低,明度高。
(4)這類banner多運用在茶、棉麻制品、以簡潔為特色的家居用品上。
(5)點綴物多用細線條。
 
 
2. 關鍵詞:高冷、時尚
總結:
(1)高冷的banner就和高冷的你一樣,最大的特點就是話少,一般就幾個字。
(2)用色大多采用黑白灰。
(3)素材圖一般都很大,突出細節,大牌的東西對自己的品質還是很有信心的,所以他們會放大放大再放大他們的細節,唯恐你們看不到。
(4)很少運用點綴物,直接一張產品細節放大圖,放幾個字,就是這么自信。
 
3. 關鍵詞:傳統、中國風、意境
總結:
(1)字體采用書法字體,文案多用豎形排版、從右向左的順序,因為古人是這樣寫字的。
(2)可以選用的素材有印章,中國山水畫,墨跡,扇面,剪紙,園林窗格,古紋樣,祥云,京劇,卷軸等等。
 
4. 關鍵詞:青春、活力、年輕
總結:
(1)很突出的一點就是模特都很年輕很有活力。
(2)色彩的飽和度和純度比較高。
(3)排版你可以隨便玩。
 
5. 關鍵詞:可愛、甜美
總結:
(1)可愛風格的banner最突出的特點就是他的字體,多采用少年字體、手寫字體、卡通字體。
(2)點綴物多使用卡通小元素,以手繪和矢量圖為主,比如星星,云朵,短線條等。
(3)色彩上多使用暖色調,營造軟萌的感覺。
 
6. 關鍵詞:節日、促銷、熱鬧
總結:
(1)色彩豐富,紅、黃、紫偏多,畫面飽滿,很少留白。
(2)主標題很大,多用剛硬,棱角,夸張有視覺沖擊力的字體。
(3)可以用到的點綴物有光效、鞭炮、舞臺、燈光、五彩的漸變、沖擊性的線條和多邊形等。
 
7. 關鍵詞:未來、科技
總結:
(1)科技類的banner概括來講就兩個要點,科技感的文字+科技感的背景圖,高級一點的還包括科技感的小點綴。
(2)用色以藍,黑色,紫等冷色調為主,畫面給人硬朗,空間感,速度和力量的感覺。
(3)可以用到的點綴物有光效、金屬效果、線條、光點,宇宙等。
 
 
8. 關鍵詞:嚴肅、規矩、黨
總結:
(1)因為我們偉大的毛主席喜歡紅色,所以黨喜歡紅色,所以政府類的網站也好,banner也好,大多都會采用紅色,點綴色多為藍色黃色,字體多選用端莊古典的襯線體或中國風味濃厚的毛筆字體。
(2)可以用的背景和點綴物有紅旗、城市背景、黨徽、英雄雕塑、故宮、石獅子等。
 
 
9. 關鍵詞:手繪風
總結:
(1)把手繪風格單拿出來是因為它真的很好用,而且很常用到。
(2)手繪風格可以用在文案上。產品本身也可以用手繪的形式,如上圖左一,簡單的幾筆就讓整個畫面一眼就能看懂,而且充滿樂趣。手繪風格用的最多的是點綴物,通過不同手繪風格的點綴物營造不一樣的氛圍。
     本文鏈接:http://www.ofskdb.live/wangzhantuiguang/719.html
  
官網網址:http://www.ofskdb.live  
微力互聯專注于東莞網站建設,東莞網站制作,東莞網站優化,東莞網站推廣,是東莞網站建設公司網絡營銷行業中知名品牌,能快速幫助公司解決網絡營銷難題,選擇我們!選擇成功!
更多
 
 
請聯系我們
東莞南城科技園北區
132-8888-7891
132-8888-7891
132-6852-2264
早8:30~晚18:00
 
東莞網站建設,微力互聯騰訊微博 東莞網站制作,微力互聯新浪微博
東莞網站建設,東莞網站制作,網站制作,東莞高端網站建設,東莞網站設計
Copyright © 2008-2017 東莞微力互聯科技有限公司 (Gong Guan WLHL internet Technology Co.,Ltd.) All Rights Reserved 
 
3d试机号绕胆图 暴走英雄坛 赚钱 网上二手书店 能赚钱吗 有没有不用登录赚钱的好方法 中学生怎么可以赚钱买手机 自由幻想 小区赚钱 基金盘能赚钱吗 赚钱不费力 费力不赚钱议论文 到农村种地能赚钱吗 常见的手机赚钱软件是什么意思 影视剧电视台怎么赚钱 什么财务工作最赚钱 梦幻西游赚钱技巧2018 还能赚钱吗 求前辈了解 手机看微视频赚钱软件下载 梦幻赚钱的玩法 走路和赚钱的软件