製作Ads廣告的超好用HTML5圖片編輯工具 Google Web Designer 互動廣告編輯器

這支Google Web Designer 互動廣告編輯器 知道有點時間了,一直想好好介紹他一下、但每次一忙別的專案工作加上客戶這幾年總先選FB的廣告投放,好像Google的廣告真只有”關鍵字搜尋功能“似的,就這樣 “拖了” 好久都沒力給他認真整理了~

但是、最近因為協助幾個品牌處理 “客戶接觸點 認知階段” 這需要,特別再次檢視GDN (Google Display Network) 執行細節和”調教” 成效這部分,特別由於FB廣告多年”毒害“,別以為方便快速的廣告素材製作工具就是好的! 一堆行銷操作者總是隨意的大圖縮小圖、文案又臭又長就靠FB廣告系統去自動處理,然後就那邊自以為有在看”數據”的優化,許多次我優化中的案例根本經不起紮實的研究與分析。

Google Display Network 是非常好的 客戶觸及 或 再行銷提醒 廣告媒體

而這幾年連Google Ads的廣告系統也開始學起了 “快速製作 回應式廣告” 的壞習慣,廣告系統操作後台讓你上兩張圖片、搭配幾個文案就開始東拼西湊的完成了各種網路不同需要的廣告規格,真的認真一點去看! 那醜的模樣啊~ 你說你要靠這種鬼畫符讓消費者對你有多好的 “第一印象” 啊!! 拜託、行銷沒有 “快速” 到連這些”基本元素” 都不重視的地步好嗎? 你當在這個數位行銷掛帥的年代,還能網路上隨便廣告丟一丟就能賺到錢嗎? 唉…

電腦版 常用的幾個廣告尺寸規格

每一次廣告素材有機會透過廣告複雜的比價系統推到淺在消費者面前的機會都是需要好好把握的,這些不同尺寸規格大小的版位都是非常需要重視注意到的! 如何在有限的區域中去做好 “該說什麼” 這件事真的需要每個品牌經營者認真看待!

Google Rich Media Gallery 廣告素材參考網頁

先來推薦幾個看看GDN 可以有哪些好表現方式的資源給你參考看看!

首先這 Google Rich Media Gallery 這網頁! 這裡頭就收錄了一些 算 “基本參考” 的廣告素材,還有不同裝置上廣告版型大致的模樣,可以根據你行銷不同的目的去想想怎麼做較佳的規畫參考。

Google Rich Media Gallery 有許多不錯的案例可以參考

不過、Google在這部分還真有點 “懶” 資料更新的速度並不快,並且常常上去看到幾個好的廣告案例,裡頭的示範資源還有時因為行銷結束而”空”在那邊,想學習參考有時也得”靠運氣”了喔~

Google Web Designer 互動廣告編輯器 推薦一定要裝的工具

前面說過、不要單靠Google Ads後台提供的那 “死板的回應型廣告” ! 我非常非常非常地不推薦他! 醜! 你怎麼做都很醜!

如果你真的想認真製作廣告素材,又想”簡單、快速” 的話! 那我一定要推薦使用 Google Web Designer 互動廣告編輯器 這工具了! 首先! 他是 Google “免費” 提供給你的! 功能強大完全不輸給什麼Adobe那些昂貴的付費軟體,還有他是”免費” 的啊~ 我剛說過他”免費”了嗎~~ XD

還有喔~ 這工具狂到 不只有 Windows 10 和 Mac蘋果版本,居然還有 Linux這種冷門系統版本、哈! 真不知道用開源系統的會下廣告嗎? 反正就是全平台支援啦!

Google Web Designer 互動廣告編輯器 基本示範

我就快速簡單的做個基本示範廣告素材給大家看看好了~ 先選擇使用”內建廣告範本“,喔~ 對了! 這工具支援多國語系,當然 “繁體中文” 也是一定有的啦! 像我最討厭看到”英文”操作介面的人來說最重要了! (雖然很多功能都是中文字、但看半天還是不懂該怎麼用、就…. 唉…..)

Google Web Designer 互動廣告編輯器 預覽效果

真要我去”抱怨”什麼,我是覺得目前 Google Web Designer 互動廣告編輯器 這裡頭”範本“類型太少了啦~ 並且其中上頭幾個就是動畫方式差異一點,設計感還是”太工程師感” 不夠美啊!!!

Google Web Designer 互動廣告編輯器 快速編輯功能

以這個我選的範本,基本上你只需要準備好 “畫質不差” 的去背 企業LOGO 和 產品圖片 (如果你不知道什麼叫 “畫質不差” 還有 什麼叫 “去背”圖片,你確定你要 下廣告 嗎? 拜託你先去找個好一點的美學設計人員、然後給個好薪水先! 別繼續看下去了!! 我是認真說這句話的! 滾!!!)

然後上傳到系統上頭,對了、雖然這工具最後會自動幫你”縮圖處理不同尺寸最佳的呈現圖檔”,但如果第一次給的圖檔就”太大” 你會發現你電腦這時候跑的會”吃力”點喔~ 建議一開始還是先處理好 “適合的檔案大小”,我是建議 1280×1280的PNG去背格式,就是一個滿適合的尺寸了!

Google Web Designer 互動廣告編輯器 連開源字型都有提供! 超棒!

對了~ 做廣告怎麼可以用 “新細明體” 呢~ 況且近來也聽說 微軟附的 正黑體 也不能作為”商業使用”,好吧~ 偉大的谷哥說到、既然你都要下我的廣告了~ 那就用我的字型吧! 他可以直接取用Google的思源黑體喔! 不過、你使用這部分要以英文名稱 Noto Sans 去做搜尋輸入,用思源黑體是找不到的! (靠! 你別告訴我你是做搜尋起家的! 這種超笨的功能都沒有! 難怪我有時會想罵! Google真的商業價值很有限! ) 並且呢~ 聽說!! 未來還會支援目前”內測版本” 的其他四套字型! 真是很期待啊!!!

思源黑體 Noto Sans TC Google的開源中文字型 網頁

Google Web Designer 互動廣告編輯器 我搞定的廣告示範

這樣透過幾個欄位和素材功能完成的多尺寸版本廣告,雖然不夠 “美學感” ,但基本上比起原本系統自己搞出來的回應式廣告還是好非常多的喔!

開啟瀏覽器 看看不同版本廣告的動畫呈現效果

別忘了、這廣告可不是 “圖片” ,他背後已經幫你處理了不同尺寸需要的 HTML5程式代碼,這本身居有”動畫效果”的廣告,是我簡單想表現的說明,你還可以直接轉”進階編輯” 去修改各種你需要”優化”和”美化”的地方!

Google Web Designer 互動廣告編輯器 還需要你自己多多努力學習

這工具 Google Web Designer 互動廣告編輯器 真的”有複雜”,根本不輸給那些圖片編修軟體,圖層結構、動畫時間軸、還有HTML5程式碼… 越讓我摸縮我是越看頭越大! 我這篇大概只用了他 “百分之1” 的部分吧!

Google Web Designer 互動廣告編輯器 讓我想起那個…當年啊~

使用這工具的時候,讓我想起多年前學過的 Flash編輯器,當年大家瘋過到處可見的那玩意,我還報名上過他的付費學習課程呢~ 不只要修改圖、還要學寫代碼,啊~ 那當年啊~~~ 這Flash已變成時代的回憶了啊~

不過、 Google Web Designer 互動廣告編輯器 真有點像當年那編輯器的影子啊~

Google Web Designer 互動廣告編輯器 官方學習資源

好啦! 這工具太強大! 我這沒PS能力的傢伙只能帶你到這”門口”,後續怎麼進修學習~ 官方學習資源 在這!

Google Web Designer 互動廣告編輯器 線上文件

還有! 介面看不懂的話,這邊 線上文件 也有一堆的資料可以看!

Google Web Designer 互動廣告編輯器 建議 前端設計一定要熟悉

我是真的苦口婆心跟大家說了~ 有美感和能力PS圖片的朋友,如果你本身還懂一點CSS 和 HTML語法,那你學習這套 Google Web Designer 互動廣告編輯器 一定無痛且快速,而至於一般行銷人員大概能像我一樣用它處理 “套版型” 廣告素材,再努力一點學習,大概可以處理一點”有點動態效果還不錯的廣告全尺寸素材”,但基本上也就這樣了啊~

我們常說到的”未來給電腦做素材”,基本上從這套工具開始就是一個學習,因為你別想電腦短期內能做的”多漂亮”,基本需要的規格尺寸真的太多且複雜,但有一個方便好用的處理工具幫你,這一點是絕對重要且關鍵的! Google已經給了一個”大寶藏” 在這等你挖了! 就看你願不願意花功夫下去了!

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *