&電商Banner設計中促銷氛圍的“度”H5廣告的設計竅門&電商Banner設計中促銷氛圍的“度”H5廣告的設計竅門1H5廣告設計竅門ppt課件21、交互：慎用向右滑動的操作方式。如：刮刮樂涂抹效果，左右滑動翻頁等。原因：蘋果手機上，向右滑動容易觸發返回“上一級頁面”效果。1、交互：慎用向右滑動的操作方式。32、交互：慎用橫屏展示效果。原因：體驗上，需要用戶設備開啟屏幕旋轉功能，才能正常觀看，用戶操作成本高。對不同屏幕的手機，長寬比例不一，難以展示最佳的視覺效果。2、交互：慎用橫屏展示效果。43、視覺：功能按鈕等，遠離頁面底部（大概128px，這個尺寸不是固定值），具體看重構采用什么適配方式（僅供參考：640*1008px，從上往下計算，主要內容在1008px內）。原因：更好的設備各種屏幕的手機，避免按鈕被擋住。3、視覺：功能按鈕等，遠離頁面底部（大概128px，這個尺寸54、視覺：慎用“光線疊加效果”或PS里面的“圖層樣式”效果。如：給圖層加個“柔光”、“濾色”、“色相”等等效果，除非這個視覺元素可以合并為一體。原因：給重構挖坑，導致不好切圖，無法還原視覺效果。4、視覺：慎用“光線疊加效果”或PS里面的“圖層樣式”效果。65、視覺：矢量圖？想做簡單的動畫？導出SVG格式試試！原因：能減少體積的事，為什么拒絕呢……5、視覺：矢量圖？想做簡單的動畫？導出SVG格式試試！76、動畫：盡量避免全屏動畫，優先考慮局部動畫的方式。如：各種粒子效果全屏飄過等。原因：如果呈現的視覺效果無法用代碼實現，就意味著要用全屏尺寸的序列幀來處理，體積上會飆升，影響加載體驗。6、動畫：盡量避免全屏動畫，優先考慮局部動畫的方式。87、動畫：序列幀壓縮小技巧，靜態的畫面，保存較高質量。中間運動的模糊狀態，大膽的壓低畫面質量吧。原因：壓縮體積，運動狀態就算有鋸齒也不明顯。7、動畫：序列幀壓縮小技巧，靜態的畫面，保存較高質量。中間運98、重構：圖片請上“”，壓縮下，有效減少體積。原因：額，這個也要說原因？好吧，偷偷告訴你，現在這網站不止可以壓縮png，還可以壓縮jpg，更重要的是……支持批量下載了！8、重構：圖片請上“”，壓縮下，有效減109、重構：音樂請壓縮下，能大大減少整體的體積。技巧：如果沒有特殊要求，可以考慮弄成單聲道音頻文件，比特率48或更低就行了。9、重構：音樂請壓縮下，能大大減少整體的體積。1110、重構：安卓機不支持多個音頻同時播放……意味著無法背景音樂跟音效同時播放！（蘋果機則沒問題）10、重構：安卓機不支持多個音頻同時播放……意味著無法背景音1211、重構：視頻無法自動播放，首次播放需要用戶點擊觸發。（視頻用什么格式？建議用mp4格式，并用H.264編碼器）11、重構：視頻無法自動播放，首次播放需要用戶點擊觸發。1312、重構：測試請多留意“魅族”手機和華為P6/P7等，屏幕底部采用虛擬按鈕的手機。設備容易出問題。12、重構：測試請多留意“魅族”手機和華為P6/P7等，屏幕14說那么多，再來幾條小知識。◆微信到底是什么用瀏覽器內核？額，這個問題還真難說清楚。微信5.4-6.1版本，如果有安裝QQ瀏覽器，則用QQ瀏覽器的內核。否則用手機系統自帶的。微信6.1版本后，內嵌了QQ瀏覽器的內核。QQ瀏覽器：6.2版本及以后使用blink內核。之前用webkit內核。（別暈，如有需要，請上：/index了解關于QQ瀏覽器的更多信息）安卓一直都是系統自帶的……◆向上滑動翻頁的操作，視覺指引的箭頭應該是向上，而不是向下哦；除非你是點擊翻頁效果，才用向下的箭頭。◆指紋掃描？親屏幕觸發互動？吹口氣檢測氣體成份？這些都是偽技術，開開心心被玩弄下就好了~不過像多屏互動，音頻分析等，通過各種接口做技術支持，實現一些互動操作，這些可是未來的趨勢哦！蘋果說那么多，再來幾條小知識。微信5.4-6.1版本，如果有安裝15電商Banner設計中促銷氛圍的“度”電商Banner設計中促銷氛圍的“度”16

可以作為網站頁面的橫幅廣告，也可以作為游行活動時用的旗幟，還可以是報紙雜志上的大標題。Banner主要體現中心意旨，形象鮮明表達最主要的情感思想或宣傳。

做電商的人接觸促銷類的設計需求應該是最多了的吧，但是促銷是不是就意味著一定要紅紅火火，一定要五顏六色熱熱鬧鬧的呢？我想不一定吧。雖然紅紅火火五顏六色是比較刺激感官，但是太過火的話就會讓人感覺不舒服產生視覺疲勞，太弱的話又會感覺沒有促銷氛圍，所以有沒有什么方法是能夠平衡舒適和促銷之間的關系的呢？天貓促銷banner京東促銷banner天貓促銷banner京東促銷banner17

今天，我們就來一起來探討這個話題：如何掌握Banner設計中促銷氛圍的“度”。我們知道，高冷大牌／簡潔留白和低價熱鬧促銷就好比我們整個設計調性的2個極端。我們先看幾個示例：高冷大牌，自信到連文案都不需要今天，我們就來一起來探討這個話題：如何掌握Ba18文藝范Banner，活在自己的世界里文藝范Banner，活在自己的世界里19新品首發banner，可以稍微熱情一點點時尚類banner，可以稍微酷一點新品首發banner，時尚類banner，可以稍微酷一點20小清新banner，可以卡哇伊一點低價促銷banner，可以逗比瘋狂活潑一點小清新banner，可以卡哇伊一點低價促銷banner，可以21另類型banner，可以搞怪一點另類型banner，可以搞怪一點22看不見的部分，比如：活動定位／活動目的／活動背景／創意思路等，這些是不需要讓用戶和消費者知道的。看得見的部分，比如：字體／排版／顏色／背景／氛圍／產品／模特／等等，所有這些看得見的部分都是由上面那些看不見的部分所驅動的，是用戶和消費者可以感知到的。舉一個例子：就好比一個女生如果要去約會，那么她會先去了解這次的約會地點是什么場合／他想要給男生展現什么樣一種印象／那個男生會喜歡什么樣的形象／她對這次約會到底有多看重等等。根據這幾個方面她會去確定自己該畫什么樣的妝：是化小可愛清新一點的妝容呢？還是濃烈一點的妝容呢？是穿可愛短裙還是穿女神長裙呢？如果妹子特別喜歡那個男生可能會更加賣力地去把自己最美的一面展現出來，如果妹子不是特別喜歡那個男生可能她會稍微隨意一點對待這次約會。關于Banner，其實包含了看不見的和看得見的2個部分：看不見的部分，比如：活動定位／活動目的／活動背景／創意思路等23平臺女裝賣場促銷活動活動背景潮流女裝低至45元活動大標題暖冬尖貨搶先購活動小標題實例講解平臺女裝活動背景潮流女裝低至45元活動大標題暖冬尖貨搶先購活24我們先從看不見的部分說起：活動定位：針對的是愛便宜又愛漂亮的用戶，這類用戶多為年輕學生／收入不高或比較節儉的上班一族，再或者是年輕家庭主婦，主打低價策略，所以畫面最好親和力一點，最好是能傳遞出便宜買得起的感覺，但是也不能感覺太廉價，畢竟沒有誰希望別人在背后說自己穿的是地攤貨吧？活動目的：當然是能吸引大家點擊banner，然后買買買啦！～創意思路：通過模特的肢體語言和表情傳遞出一種自信樂觀的感覺，就像形象代言人一樣，好像在說：穿了我們這些衣服，你也會像我一樣開心，像我一樣美麗成為萬人迷的，而且價格超級劃算呢！～關于Banner，其實包含了看不見的和看得見的2個部分：我們先從看不見的部分說起：關于Banner，其實包含了看不見25于是得到了這一系列的Banner圖，大家可以先感受一下：于是得到了這一系列的Banner圖，26

作為簡單的舉例展示用，其實我們可以選擇放模特或不放模特，可以選擇放商品圖或不放商平圖，按自己的需要來就好了，當然我們還有很多種創意方向和排版布局，如圖所示：作為簡單的舉例展示用，其實我們可以選擇放模特27H5廣告設計竅門ppt課件28但如果我們換成下面這樣：背景大量留白，細小的字體，單調的顏色，欠她一百萬的臭臉模特。。感覺就大不一樣了，我們并不會感覺這是在賣低至49元錢的衣服，而且還會感覺文案與畫面不搭對不對？但如果我們換成下面這樣：29所以，要想把握Banner設計中促銷感的那個度的話，我們可以從字體／排版／顏色／背景／點綴／產品／模特／等等幾個方面分別比較來講解，于是我們會發現什么問題呢？字體：字體越細越小越規矩，相較于字體越粗越大越不規矩（變形或傾斜處理），會更加顯得不那么促銷。所以，要想把握Banner設計中促銷感的那個度的話，我們可以30所以，要想把握Banner設計中促銷感的那個度的話，我們可以從字體／排版／顏色／背景／點綴／產品／模特／等等幾個方面分別比較來講解，于是我們會發現什么問題呢？排版：排版越簡單越規矩，相較于排版越復雜越不規矩，會顯得不那么促銷。所以，要想把握Banner設計中促銷感的那個度的話，我們可以31所以，要想把握Banner設計中促銷感的那個度的話，我們可以從字體／排版／顏色／背景／點綴／產品／模特／等等幾個方面分別比較來講解，于是我們會發現什么問題呢？顏色：顏色越冷／飽和度越低／顏色種類越少，相較于顏色越暖／飽和度越高／顏色種類越多，會顯得不那么促銷。所以，要想把握Banner設計中促銷感的那個度的話，我們可以32所以，要想把握Banner設計中促銷感的那個度的話，我們可以從字體／排版／顏色／背景／點綴／產品／模特／等等幾個方面分別比較來講解，于是我們會發現什么問題呢？背景：背景越簡單／顏色越少／留白越多，相較于背景越復雜／顏色越多／留白越少，會顯得不那么促銷。所以，要想把握Banner設計中促銷感的那個度的話，我們可以33所以，要想把握Banner設計中促銷感的那個度的話，我們可以從字體／排版／顏色／背景／點綴／產品／模特／等等幾個方面分別比較來講解，于是我們會發現什么問題呢？點綴：點綴越簡單越少，相較于點綴越復雜越多，會顯得不那么促銷。所以，要想把握Banner設計中促銷感的那個度的話，我們可以34所以，要想把握Banner設計中促銷感的那個度的話，我們可以從字體／排版／顏色／背景／點綴／產品／模特／等等幾個方面分別比較來講解，于是我們會發現什么問題呢？產品與模特：放模特展示相較于放產品展示，更有激發購買的欲望，顯得更加