電商Banner設計策略!

2021-01-07 設計智造

文/陸麗芳 Banner設計的主要目的是將活動信息準確的傳達給用戶,讓用戶第一時間知道賣的是什麼,起到引流的作用。在Banner設計時,能保證讓用戶明確主題的同時,進而讓用戶產生購買的欲望,就是成功的Banner設計。

Banner主要由產品圖或模特、文案、背景和 點綴物組成,Banner的主體一般是產品、模特或文案,背景和點綴物一般是用來烘託主題、渲染氣氛和突出主體的,通過Banner快速地給消費者傳達出信息,引導和激發他們的購買慾望。 在設 計Banner時,要根據用戶群體和用戶需求進行風格策劃。

版式分割是指在有限的版面空間裡用圖形或圖 片把整個版面分割為兩個或多個部分,用戶可以通過版面的面積大小判斷主次關係,起到了一定的引導性,增加畫面的層次感和節奏感、同時使畫面更具活力和視覺衝擊力。

目前比較常用的版面分割有直線型分割、傾斜型分割、三角形風格、圓形分割和不規則分割等,直線型分割給人一種理性的感覺; 傾斜型分割會讓版面更具速度和動感。在運動、促銷和遊戲設計中可以考慮使用此類分割方式。

三角形是本身一個穩定的圖形,有很強的視覺引導性,通常會給人時尚、尖銳或暴力刺激等感受,如果想減輕尖銳感覺,可以改用矩形或多邊形作為分割圖形。 圓形本身是一種光滑飽滿的圖形,所以會給人可愛、靈動的感覺會更具親和力,使人更容易接受,母嬰或歡樂氣氛的主題可以選擇此類分割方式; 不規則形狀分割更加有利於氛圍的營造。

在確定了版面分割形式以後,接下來確定版式 布局,主要有以下幾種常見的版式布局:

①左右布局,產品和文案採用左右布局方式, 清晰、直觀、容易分辨。

②左中右布局,一般是文案在中間,兩邊是遠近搭配的 模特或者產品,增加畫面層次感。

③上下布局,此類布局適合產品和文案的結合,適合大促風格中產品較多的情況。

④居中輻射式布局,它以中心開始布局向外擴張,此類布局,一般將文字作為中心,突出主標題,把其他主題元素環繞在文字周圍,構圖自然穩定、空間感強。 此外,為了增加活動氛圍突出運動感,可以將構圖進行傾斜處理,但要注意角度不能超過45度,否則會影響閱讀。

Banner文案表達也直接關係到利益點的表達,文案的是否簡單明了、清晰易懂,直接影響著用戶的決策時間。 在設計文案時,需要去挖掘用戶的某種情懷,只要得到了認同就能順利的獲取用戶的注意力,就能增強用戶對產品的接受程度,博取用戶的信任。

閱讀習慣一般是從上到下、從左右到右的掃描 順序,文案排版一般分為左對齊、居中對齊和自由方式對齊。 左對齊是最常見最直觀最傳統的文字排版方式;右對齊比較少見;居中對齊比較常見,也容易出效果;自由型會給人一種錯落的感覺,有很強的速度感。總之文案排版要適合版面布局,要充分融入到畫面中去。

在文案的字體設計方面,字體要與主題相符合 要儘可能體現產品的性格與氣質,比如: 女性化妝 和服飾類就不適合使用粗壯的字體,應該選擇細緻優雅的字體。 對字體進行適當變形,可以使文案更具設計感和視覺衝擊力。

字體設計上也可以選擇立體 字的形式,立體字有很強的促銷效果,可以讓字體設計更加豐富、更有力度感,但要注意的是,立 體字的厚度儘量不要超過字體筆畫的厚度,不然會顯得比較笨重。 還 可以考慮選擇使用描邊形式,描邊形式可以很好的解決文字與背景顏色太相近的的問題,可以加強層次感.但是要記住外框的顏色要比背景深一些。

配色主要解決背景、標題、元素和產品素材的 配色關係,一個優秀的配色方案不僅能給用戶帶來感官上的享受,還可以激發用戶的情感。 配色要符合品牌風格,例如:賣化妝品最好不要深色系的背景, 除非是屬於高端品牌,深色系能帶來大氣奢華的感覺; 電器類一般使用科技藍;化妝品類可以使用粉色;食品類可以使用橙色增加食慾。

一般深色背景配淺色產品,淺色背景配深色產品。 對比色是用的最多的,在使用對比色時一般選用3種顏色中,只能選出一種顏色作為主色,其他兩種作為輔助色來使用,使產品和背景有明暗對比。

細節決定成敗,在設計行業中更是不變的真理。 質感、光影、留白、字符間距、投影、和點綴物元素等都屬於細節的一部分。 在畫面中增加光影,可以營造空間層次感,使畫面更飽滿。點綴物可以看 成構成理論中點線面當中的點,這些點是豐富畫面氣氛的主要元素,點綴物的合理運用可以豐富畫面,增強趣味性和營造氛圍。

Banner設計需要站在用戶的角度,設計出適合用戶心理特徵的 Banner,讓其成為一個有個性、有脾氣的設計,增強用戶體驗滿足用戶瀏覽需求。

相關焦點

  • 從人性的角度,揭露電商Banner設計背後的14個秘密
    作為電商設計師的我們,每天會面對各種需求,每天看到各種商品,做了這麼久的電商banner設計,我突然問了自己一個問題:當我們在做Banner的時候,我們在做什麼?你們想過這個問題嗎?作為協助完成線上交易的其中一個環節,電商設計要做的是準確地把信息傳達給用戶,直白一點講就是通過對文字圖形的處理去傳遞某種情緒給到消費者,讓消費者產生點擊購買的欲望,banner圖的受歡迎程度直接關係到圖片的點擊率和轉化率,所以當我們在做banner圖的時候我們在做什麼呢?我們其實是在揣摩人性,我們做的banner歸根結底就是對人性的把握和理解。人性的惡而人性包括什麼呢?
  • 手繪在banner圖設計中怎麼應用?
    關鍵字:電商設計 banner導語:過去幾年,電商頁面設計都是相對較傳統的表現形式,風格也比較單一。很多專業學習了手繪的設計師們,他們把手繪元素帶入了電商頁面設計上面,這些手繪元素令電商設計行業變得更加豐富多彩。
  • 網站廣告banner圖如何設計?
    我們通常打開網站會看到很多長方形形狀的廣告圖片,稱之為網站banner,網站的Banner可以放在網站不同的位置,在訪客瀏覽網站的時候,吸引訪客的關注,從而獲得宣傳和銷售的效果,我們常常看到的網站百葉窗也是網站banner的一種。
  • 網站banner設計的技巧!
    網站設計有美麗的banner,你的網頁能吸引很多遊客的注意力。網站banner在網頁上的重量比較大,品質和美觀的banner會大幅提高你網站的品質。速推SEM網站banner的設計只是網站的設計要素之一,在整體網站的設計中,設計師沒有多少時間進行設計,所以積累了設計師平時設計網站banner的經驗有些設計師的網站banner既沒有靈感也沒有經驗,也沒有良好的品質。在多年的網站設計經驗中,總結了網站banner的製作。如果你做不出好的banner的話,按照我們說的那樣,可以感受到耳目一新。
  • 【乾貨】Banner設計排版參考大賞
    Banner設計是我們設計生涯不可避免的一種廣告設計技法!
  • 平面設計——banner篇
    banner主要投放於網際網路,在網際網路廣告中發揮著重要的作用。今天要介紹的就是如何通過banner去做更好的宣傳和如何更好的提升設計水平。首先什麼是banner?翻譯成中文是「橫幅、廣告」的意思。最常用於網站的大標題,也就是網站的橫幅廣告了。在設計banner前需要先了解項目定位和需求,再確定設計風格。
  • 網頁banner設計基礎篇
    網頁設計設計過程中,banner圖是整個網頁中,圖片面積最大,位置最顯眼的區域,甚至一個好看的網站就取決於banner的設計。banner的設計和海報設計其實可以統稱成一樣,設計的原理還是相同的,只是banner要考慮整體網站的結構,是否協調,設計上相對平面設計要簡單很多。
  • Banner設計五重奏~奏
    本期給大家banner的組成解析,也不絕對的。主要是日常中出現一些設計手法,以下講到的各個組成元素  不止是在banner中有所表現在其它方面的設計中也有,所以呢大家不要很絕對說什麼類別的設計裡面要出現什么元素。    今天我們來一起聊聊banner五重奏。os:名字起的不錯吧~~~案例來源於網絡 多有得罪請恕罪O(∩_∩)O哈!
  • 網站設計時如何做好banner的設計?
    在網站設計的時候,關於網站banner設計,是非常考驗設計師的水平的,因為很多客戶既要求節約成本,又要效率高,短時間可以設計出出彩的作品,所以,下面給大家說下網站banner設計的幾大技巧和注意事項。3、按照客戶的閱讀習慣來設計一般人們的閱讀習慣都是從左到右、從上到下的,所以網站設計網站banner時候也要遵循這個規律,不要相反,會讓人很不舒服。4、產品展示要能激發客戶的欲望信息爆炸的時代,客戶瀏覽網頁的注意力是幾秒鐘,所以要第1時間進行產品的展示,命中主題。
  • 網站banner設計有什麼好的方法
    網站banner設計對整個網站起著非常重要的作用,以下介紹本人在目前工作中針對banner設計收集整理的一些方法。網站banner設計方法/步驟1、網頁設計設計主題要明確在banner設計之前,設計師必須與客戶溝通具體要表達的主題和要突出的重點,然後設計師根據客戶要求來設計製作banner,在與客戶溝通過程中一定要明確需求,如果客戶希望是醒目點的可以用紅色或者黃色來設計,如果客戶希望整潔舒服些的可以用白色或者淡綠色來做底色。
  • 如何做好 Banner設計?我總結了這4類基礎知識
    前段時間一直在做運營類設計,banner 在其中佔了較大比重,為此就想寫一篇階段性總結。其中部分觀點參考了相關視頻教程和文章,設計新手一枚,如有不足還請大家海涵。banner 由以下五部分組成:版式,字體,顏色,背景,點綴。我就針對這幾點做些具體分析。
  • Banner設計技巧:6招搞定點綴元素的運用
    所以,今天我要給大家講的是點綴元素的在Banner設計裡的運用和玩法,它也是大家經常需要用卻又經常忽略了或用不好的一個知識點。「油鹽醬醋茶」以及「綠葉」都是可以的,主要看你的banner設計是什麼樣一個定位方向。
  • 看了1400張網易雲音樂banner,總結出讓PPT變好看的設計套路
    我都會打開App聽聽歌,順便學習下別人的設計。沒錯,說的就是網易雲音樂的banner,和電商banner的「鄉村非主流」不太一樣,網易雲音樂簡直是設計界的一股清流~   學好網易雲音樂banner,立馬提升頁面設計的美感,且聽小銳慢慢道來。
  • 網站首頁Banner圖設計應該注意這幾點
    首頁的Banner圖設計構思可以說是我們平時工作中最重要的一塊工作,首頁的banner圖不比大型項目,從設計方案成本費用上來說不太可能給過多的時間給產品設計師,所以這也引發了我們應該對怎樣更高效率地完成1個banner圖的思考。
  • 講解網站banner設計時有哪些要求和問題
    為了使banner合理的被客戶訪問,應該順應用戶這樣的瀏覽習慣,糟糕的設計會讓客戶無所適從,焦點隨處都是。banner圖的設計需要設計人員來操作,很多公司用戶企業裡沒有設計師,只能從外面找設計人員,通常要麼找之前做設計網站的,或設計人員來設計,要麼就會在平臺來找設計人員或者企業操作而這無一不是要勞動力費用的,都是要收費的。在網站配圖的設計中,使用倒三角已經成為一種相當常見的操作。
  • 優化Banner廣告收入的7種策略
    有關房地產的網站可能會發現banner廣告的表現要好得多,而醫療網站可能需要在其內容中放置banner廣告以最大程度地增加收入。優化banner廣告收入的最佳策略是什麼?它取決於網站及其訪問者。一些網站的訪問者是盲目的訪問者,因此文字廣告可能效果最好,或者在網站主要內容結尾處的廣告由於其展示位置而被證明會有更大的收益。
  • Banner圖設計之商品圖該怎麼玩?(上集)
    設計需求後,我們該怎麼做接到一個banner圖的設計需求,第一件事情應該是去了解以下幾個方面點: 1、banner圖是針對什麼活動、什麼目的而設計的我們需要知道做這個的原因,為誰而做,比如是為了某個節日專題活動還是針對某一個單品的預售,是走高端大氣上檔次路線,還是走促銷親民熱鬧路線等等,因為這些關係到banner圖設計風格的選擇(不妨問一下需求人看他有什麼參考圖可以提供給你
  • 如何設計網頁小廣告(banner)
    【譯者的話】 網頁上的小廣告(banner)已經成為一種宣傳推廣的重要形式,但這些小廣告除了版面細小外,圖象的表現還受到象素較低等其它因素影響,給傳統的平面設計師帶來了新挑戰。如何讓你的小廣告在混亂無章的網頁中脫穎而出?
  • banner設計其實很簡單,只要你學會這些技巧
    今天分享的這篇文章來自UI中國優秀會員-張增順,根據實例詳細講解banner設計使用了這些技巧其實是如此的簡單
  • 深度乾貨 | 雙十一電商大促流量承接與變現的產品設計分析
    線上直接(直接)流量:進一步細分為站外流量:外部各種流量出入口的曝光banner、卡片和floating等。站內流量:電商平臺的各個欄目頻道、導航tab、搜索等(對於大型企業來說,包括旗下其它兄弟產品的曝光banner、卡片和floating等)流量進來之後,需要相應的動線設計來承接:是導航與頁面布局。