-
讓品牌有溫度、有情感
專注品牌策劃15年
-
當前位置：首頁 > 創(chuàng)意學院 > 景觀設計 > 專題列表 > 正文
banner圖怎么設計
發(fā)布時間：2023-04-04 17:44:21
稿源：
創(chuàng)意嶺 閱讀：
79
大家好！今天讓創(chuàng)意嶺的小編來大家介紹下關于banner圖怎么設計的問題，以下是小編對此問題的歸納整理，讓我們一起來看看吧。
開始之前先推薦一個非常厲害的Ai人工智能工具，一鍵生成原創(chuàng)文章、方案、文案、工作計劃、工作報告、論文、代碼、作文、做題和對話答疑等等
只需要輸入關鍵詞，就能返回你想要的內容，越精準，寫出的就越詳細，有微信小程序端、在線網頁版、PC客戶端
創(chuàng)意嶺作為行業(yè)內優(yōu)秀的企業(yè)，服務客戶遍布全球各地，如需了解相關業(yè)務請撥打電話175-8598-2043，或添加微信：1454722008
本文目錄:
一、怎么制作banner
步驟/方法
1 首先打開軟件，我們看到界面如下，左邊部分是選項部分，可以切換到各種設置。
2 我們選擇“尺寸&聲音”選項，進行相關的設置。長寬根據自己的需求進行設置，如果想插入背景音樂的話自己設置就可以了。
3 選擇“背景&設置”，我們設置一下背景為漸變色，如果需要插入圖片或者其他flash元素的自己設置就行了。
4 選擇“選擇&設置”，進行flash背景效果的選擇，這里我選擇了一個飄動的蒲公英。
5 選擇“文字&圖像”選項，我們編輯banner上顯示的文字等元素。首先我選擇第一個網址，然后更改成百度經驗的網址。
字體和文字的顏色可以點擊下面的“編輯字體風格”進行編輯。
然后，我們改寫第二行文字，把它改成“百度經驗”我使用的是百度綜藝體，字體和顏色設置好以后就切換到“選擇&效果”選項卡，我們選擇喜歡的文字效果。
切換到“位置”選項卡，我們可以調整文字在banner中的位置
分別切換到“網絡鏈接”和“定時”選項卡，進行相關的設置
6 文本中選擇第三行文字，改寫成“為經驗獻計獻策”然后設置好效果。這里我選擇了一個行星閃動的效果。其他項目設置可以參照上面的講解。
7 選擇“網站&鏈接”選項，進行相關設置
8 選擇“發(fā)布&構建”選項，點擊“發(fā)布”按鍵輸出自己設計好的flash banner。
9 彈出輸出格式選擇對話框，我們選擇swf格式，點擊“確定”
10 彈出“保存”對話框，我把這個banner命名為1，保存。
11 保存完畢以后，主界面顯示紅色提示語，告訴我們怎么正確使用這個banner。好了整個flash banner的制作就算是完成了。
12 為了給大家展示一下這個banner，我又另存了一份gif格式的，因為這個軟件也是支持發(fā)布為gif格式的，我們來看一下效果，還是很不錯的。
END
二、盤點banner設計組成要素/類型/風格/設計步驟大全
banner對于一個設計師來說，肯定不是一個陌生的詞語啦，在目前的各個行業(yè)領域中基本都涉及到banner的需求，不管是web端還是移動端我們處處都能看到banner的影子，所以掌握banner的設計是我們每一個設計師必備的技能啦！
banner（及橫幅廣告）是網絡廣告最早采用的形式，也是目前最常見的形式。橫幅廣告又稱旗幟廣告，它是橫跨于網頁上的矩形公告牌，當用戶點擊這些橫幅的時候，通?？梢枣溄拥綇V告主的網頁。是表現商家廣告內容的圖片，放置在廣告商的頁面上，是互聯(lián)網廣告中最基本的廣告形式！
下面我們會從這幾個方面講解banner：
一： banner的組成要素
二： banner的類型
三：banner的風格選擇
四： banner的設計步驟
一:banner的組成要素
banner的主要組成要素我這里簡單的總結了幾點：
以及banner主要的元素是：文案+元素+背景
元素又可以細分為：元素=商品+模特+logo+點綴（這里的元素是需要根據banner的實際情況選擇要素，可有可無）
如圖:
（來源于花瓣）
二:banner的類型
banner的類型我這里總結的主要分為：
01：產品宣傳類banner（新產品、熱銷產品）
02：活動類banner（節(jié)日活動促銷、產品促銷）
這里簡單的將banner分為了兩種類型，因為對于不一樣的banner需要實現的效果和目的是不一樣的，所以我們需要設計出不一樣的風格的banner
對于產品宣傳的banner我們最主要的就是要突出產品的特征，所以我們對于banner的設計，需要的最主要的元素就一定是產品，以及簡短的文案介紹，至于點綴的元素我們也可以根據實際產品的特征選擇合適的元素，也可以不用元素的點綴，背景肯定也是必不可少的！
01：產品宣傳類banner：
產品+文案+背景
例如：
（來源于花瓣）
上面的案例都是對于產品宣傳類的banner的設計樣式，他們有一個共同的特征就是產品放大放大再放大，盡顯產品的特點，簡潔的文案介紹和大量的留白更加凸顯產品的特征，使用戶的目光不由自主的被產品本身所吸引
產品宣傳banner：
產品+文案+元素+背景
例如：
（來源于花瓣）
這類banner的特點就是除了產品本身外，都添加了一些其它的元素作為banner的一個點綴效果，使畫面顯得更加飽和，或使畫面帶有動感的效果！
那么問題來了
什么情況下產品banner設計添加元素好？什么情況下不添加元素好呢？
第一：對于需要極度顯示產品的特征的時候我們最好選擇不添加元素干擾產品，
第二：對于簡約產品，我們最好也不要添加元素做裝飾，大量的留白更加適合簡約產品的風格，
02： 活動類banner
產品+文案+元素+背景
例如：
（來源于花瓣）
對于活動類的banner設計我們大多數都會選擇顏色鮮艷多彩的，并且畫面飽和具有沖擊力的，營造出一種熱鬧的氛圍，對于元素的添加也是必不可少的一點，因為對于活動類的banner設計，畫面越熱鬧活動力度就會顯得越大，才會更加吸引用戶，對于活動的標題也要盡量的凸顯！
二:banner的風格選擇
對于banner的風格也是多種多樣的，但是對于不同性質的banner選擇的風格肯定也是不一樣的，不同的banner搭配不同的風格給人的視覺效果是完全不一樣的，合適的搭配才能使banner更好的表現其特征和目的
例如：
01：簡約產品家居banner的宣傳banner，就比較適合簡約大氣干凈的風格
（來源于花瓣）
02： 高端科技產品banner，就選擇具有科技感氣質的風格
（通過科技感的圖形和顏色等來體現）
（來源于花瓣）
03： 時尚服飾類的banner，就適合選擇時尚畫面的風格
（通過獨特的造型和風格圖形以及色彩等來體現）
（來源于花瓣）
04： 高端奢侈品牌類banner，就適合高端大氣的風格搭配
（通過高檔色彩黑紅配，黑金配等來體現）
（來源于花瓣）
05:少女\兒童可愛風banner，就適合可愛風元素搭配的選擇
（通過可愛元素：插畫、線條、氣球、愛心、 圓潤的字體、活力的色彩等來體現）
（來源于花瓣）
06： 國風/文化/節(jié)日類banner，就比較適合選擇帶有文化氣質的元素搭配
（通過中國風毛筆字、中國古有的元素： 印章，中國山水畫，墨跡，扇面，剪紙，園林窗格，古紋樣，祥云，京劇，卷軸等等）
（來源于花瓣）
二:banner的設計步驟
01：了解和確定banner的設計需求
02：明確banner設計的目的
03：根據得到的banner設計需求確定banner的設計風格
04：選擇合適的banner設計版式結構
05：選擇匹配的元素裝飾banner的整體效果（根據實際需求添加）
06：色彩搭配選擇
01： 了解和確定banner的設計需求
對于這了解設計需求一點來說，不管是做什么設計的前提都是必不可少的一步，也是最關鍵的一步，如果你連設計的需求都不明確那么做出來的設計結果肯定就不會符合實際的需求
那么對于banner的設計需求我們具體需要明確那一些呢？
第一點：確定banner設計文案
文案對于設計師來說也是一個很重要的點，設計師可以根據文案信息從中找到設計靈感，并且也可以知道大致的設計風格的走向
第一點：確定banner設計尺寸和投放平臺
文案確定后我們還需要知道banner的投放平臺和位置，尺寸大小，以及是否需要適配各個平臺的展示，
02： 明確banner設計的目的
對于設計一張banner，肯定是想要達到某一種目的才會設計這一張banner，所以在設計banner之前一定要了解清楚這一張banner設計的目的是什么，例如：是想要宣傳產品還是想要促銷產品，兩者的性質是完全不一樣的，
03： 根據得到的banner設計需求確定banner的設計風格
banner的設計風格我們可以從banner文案需求中找到關鍵詞進行定位，比如： 全語音智能操作的車載支架A5
從這一句主題文案中我們能夠提出的關鍵詞就有： 全語言、智能
對于這樣的關鍵詞的理解我們肯定第一就會想到科技感智能化時代的畫面，所以這里的風格我們也就有所選擇啦！
04： 選擇合適的banner設計版式結構
banner的設計版式結構我們可以大致分為：
居中結構、左對齊結構、右對齊結構
不同需求banner的結構就需要根據實際情況選擇啦！
05： 選擇匹配的元素裝飾banner的整體效果（根據實際需求添加）
對于banner的裝飾元素我們也是需要根據實際情況和產品banner的特征采取合適的選擇，比如簡約產品的banner就不需要裝飾元素更好，而活動類banner或少女兒童等可愛類的banner設計就需要選擇裝飾元素更加適合，并且不同形狀banner的裝飾元素選擇也是不同的（前面做了簡單的介紹，這里就不再重復啦）
06： 色彩搭配選擇
色彩的選擇也是很關鍵的，不同性質的banner選擇的顏色搭配也是不一樣的，適當的顏色搭配會使產品更加凸顯或者使畫面更加顯眼突出，并且給人的感覺也是不同的，
例如：
* 黑金配和黑紅配就會給人一種高級感
* 藍，黑色，紫等冷色搭配，畫面給人硬朗，空間感，速度和力量的感覺更加適合科技感
* 紅、橙、黃、紫搭配，就會營造出一種熱烈的氛圍，更加適合時尚和活動類
* 黑、白、灰的搭配就會給人一種高冷不宜接近的感覺，更加適合大牌的風格選擇
* 白、灰的搭配會給人一種寧靜、文藝、氣質、素雅的感覺，更加適合簡約產品的選擇
實操案例：
文案需求：
全語音智能操作的車載支架A5
揮手聽話的語音支架
使用訊飛AIUI人機交互解決方案，智能駕乘張口即來
設計尺寸：1920x650px
設計的目的：根據需求我們得到的banner設計的目的是宣傳新產品車載支架A5
第一步：我們將文案信息以及提供的產品放入畫布中
第二步：明確我們的主標題 “全語音智能操作的車載支架A5”
所以我們將主標題放大處理，凸顯主標題
第三步：選擇banner的風格，因為這里我們需要體現的是產品的智能化，所以我們的風格就可以定義為科技感的
第四步：選擇版式結構，我們這里就選擇簡單的左右結構吧！
第五步：選擇裝飾元素，裝飾元素也要根據科技感的效果選擇，以及可以從文案中提取，例如這里我們可以提?。嚎萍几芯€條和圖形、語音圖形等
第六步：整體位置調整和色彩搭配，對于文字大標題我們也處理成不一樣的具有層次結構的，使其更加凸顯，小標題文案也根據整體風格畫面做微小的處理，使文案和畫面更加和諧統(tǒng)一，包括產品周圍由于受到光的影響，也需要做處理
最終我們就得到上面的banner效果啦！😂一個簡單的科技感banner就設計完成啦！
好啦！今天的知識有點多，也有點全面！希望你們喜歡吧！🙃
往期好文推薦
—
版式設計——簡單7種圖片排版方式
10張創(chuàng)意線條圖形海報設計
2招教你配色技巧，擺脫配色困難癥！
【創(chuàng)新】海報設計思路
三、banner設計：高手教你如何設計banner?
當然，這里的banner總文字的變形沒有很多，更多展示的是不同文字的不同排版。一段文字應該怎么排版，怎么突出文案，不需要怎么變形也能做得很好！
根據文章的重點：
一 ：思考專題定位。
定位很重要，慣竊整個頁面的內容。從之前看的對文字的性別、種類各種文章，對定位以及有初步的了解。接下來就是在實踐中嘗試和進步！
二：明白文字在Banner中占主導地位。
文字一直是重點，比較保守的做法，就是文字+背景?？晌淖诌€得區(qū)分主標題和副標題，所以文字上的排版怎么去突出，是重中之重！
三：構建輔助視覺。
這里實用性很大，有三種排版方式：
1 文字+背景陪襯。這個看似很好做，卻也一直做不好。
2 文字+主體物。第1是最好做的，第二很容易做糊了整個界面。多做多嘗試！
3 主體物+背景+文字。這是經常采用的方法，但經常還是做不好。
四：創(chuàng)造力對主題的藝術化表現。
喜歡這里第三張圖，真的很好。雖然右邊的人群頭部摳得不是很好，但這張的意念和創(chuàng)意都非常棒。
banner是小小的圖片，卻是很講功力的。多嘗試才能多進步啊！
四、網店Banner設計與制作方法是怎樣的？
好的Banner設計，雖然都是由圖片加文字組成，但也絕不是“1＋1＝2”那么簡單地疊加。如同一首樂曲，可以是古典交響樂，可以是流行電子樂，亦或民間小調，形式多樣，手法不一。有時候需要像作詩般字斟句酌，有時候也會有妙手偶得的驚喜。受制于互聯(lián)網視覺設計的特點，往往需要通過設計師的經驗思考，在較短的時間內制作出能夠通情達意的作品。下面為一運用Photoshop軟件進行的網店Banner設計與制作方法舉例。
（1）運行Photoshop軟件，執(zhí)行“Ctrl”＋“N”命令創(chuàng)建一個新文件，設置新圖像文件的大小為寬度1920像素，高度為260像素（高度要根據具體情況來定），圖像分辨率為72像素／英寸，顏色模式為RGB模式，背景色為白色。（2）搜索Banner設計的背景圖片，注意背景圖像的寬度必須大于或等于1920像素，選擇好背景圖像后，在Photoshop中打開圖像文件。（3）將選擇好的背景圖像，應用軟件的移動工具拖進第一步創(chuàng)建的Banner圖像文件中，并運用移動工具進行位置的調整，把需要的部分圖像放置在合適的位置。（4）在Photoshop軟件的圖層面板，設置背景圖像所在的圖層不透明度為40%，以降低圖像的不透明度，使背景圖像與白色的背景圖層融合。（5）把事先拍攝好的、事先計劃好要重點推薦與推銷的商品圖像在軟件中打開，運用Photoshop軟件中的魔術棒選擇工具，先在圖像的白色區(qū)域進行選擇，然后執(zhí)行“Ctrl”＋“Shift”＋“I”反選命令把無線路由器產品圖像選中。（6）運用軟件的移動工具分別把上一步選擇完成的無線路由器側面圖與無線路由器背面圖拖移到Banner文件中，執(zhí)行“Ctrl”＋“T”命令對無線路由器圖像進行大小與位置調整。（7）接下來運用文本工具添加文本，選擇字體為“方正蘭亭特黑”，字體大小為72點，設置字體為“斜體”，字體顏色為“藍色”，RGB數值為（6、68、182），字體顯示模式為“犀利”，輸入“數碼惠聚”幾個字。(8)執(zhí)行“Ctrl”＋“T”自由變換命令，對“數碼惠聚”文字進行旋轉調整，轉動一定的角度。(9)繼續(xù)運用文本工具輸入文字，選擇字體為“方正蘭亭特黑”，字體大小為24點，設置字體為“斜體”，字體顏色為“藍色”，RGB數值為（53、98、4），字體顯示模式為“犀利”，輸入促銷文字，然后執(zhí)行“Ctrl”＋“T”命令對文字的角度與位置進行調整。(10)運用上一步的方法與技巧，繼續(xù)輸入文本，除“1212”四個字的大小為30點，顏色為RGB（192、6、6）以外，其他文字屬性與上一步相同，然后一樣進行位置與角度調整。(11)繼續(xù)運用文本工具輸入文字，選擇字體為“方正蘭亭特黑”，字體大小為24點，設置字體為“斜體”，字體顏色為“藍色”，RGB數值為（6、68、182），字體顯示模式為“犀利”，輸入如下圖所示的促銷文字，然后執(zhí)行“Ctrl”＋“T”命令對文字的角度與位置進行調整。(12)運用軟件的多邊形選擇工具，在工具屬性欄中設置羽化值為0。(13)在圖層面板新建一個圖層，并且用RGB數值為（6、68、182）的藍色對三角形選區(qū)進行填充顏色。并對這個圖層進行圖層樣式設置，圖層樣式為“斜面與浮雕”中的“內斜面”，方式為“雕刻清晰”。(14)設置好圖層樣式后，執(zhí)行“Ctrl”＋“D”取消選擇命令。(15)把上面創(chuàng)建的三角形樣式所在的圖層進行4個復制，分別放置在如圖所示的位置，同時運用“Ctrl”＋“T”命令適當調整三角形樣式圖像的角度、大小、位置與不透明度，完成Banner設計。
以上就是關于banner圖怎么設計相關問題的回答。希望能幫到你，如有更多相關問題，您也可以聯(lián)系我們的客服進行咨詢，客服也會為您講解更多精彩的知識和內容。
推薦閱讀：
贛公網安備 50019002502384號
