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试机号绕胆图 26选5开奖规则 6月22世界杯比分推荐 排列3开奖走势图 双彩 9ov9ovs足球即时比分 四川快乐十二一定牛走势图表 极速飞艇稳赢图片 大乐那天开奖 成 人 在 线 网 海口站街女实录 1分彩中奖 彩票辽宁35选7 快乐8 日本av片为什么分有码无码 四川快乐12开奖结 青海11选5开奖