手殘黨的救星,Keynote可以做gif啦!

Sunny @ms.eatingtpe
From Conception to Completion
7 min readMay 15, 2019

以STR品牌LOGO作為範例,讓小編不用再去跪美編的簡單動畫設計概念!文後附上超簡單!申請giphy帳號實戰懶人包及讓你不用繞遠路的小技巧。

本文前半段獻給公司設計loading永遠爆炸的朋友,如果公司品牌本來就有很多素材可以上傳(或是設計大大有求必應),請直接拉到下半段。

前言

去年夜夜秀第一季開播的時候我寫過這篇文章⬇️

關於如何使用keynote做出視覺一致的ig stories,請注意,當時文內使用的gif是用keynote輸出為影片之後,再透過線上工具轉檔的,並不是keynote直出的圖檔。

這期間也有嘗試過許多排版工具如canva等,一開始覺得很棒,但是有時候閃退很麻煩,自由度又沒有keynote高。現在canva對我來說的定位比較偏靈感素材庫,真的很需要的時候才會打開來用一下,用在真的非常隨手的貼文。

上個月第二季開播了,歲月催人老,找了一位助理幫忙,所以有多了一點時間研究本來就想做但沒空做的GIF。

我平常用的工具Procreate(ipad上的繪圖軟體),目前也已經支援Gif直出的功能,本篇以Keynote為主~

以下正文,非常簡單的5分鐘做小動畫

首先先來看Keynote 9.0更新,支援gif輸出

接下來介紹兩個動畫的小技巧,可以混用

A. 輸出多張投影片:以投影片頁面作為影格
B. 輸出單張投影片:使用keynote內建的動態輸出的gif

開始前的準備:

  1. 最重要的一步,確保每一張投影片是用投影片主版當中同一個版型,建議全部使用 [空白],這樣一來如果需要更改背景,就可以一次在主板當中全改。
  2. 什麼時候會用到更改背景的功能呢?你需要他消失的時候,或是你有可愛背景的時候(例如上面那張banner)
    改背景顏色為不透明度0%,輸出的時候就會自帶alpha圖層,白話文就是透明背景。

— —

A. 輸出多張投影片:以投影片頁面作為影格

  1. 新增你的圖形,每一張當作一個影格,我只有在透明度上微調。
  2. 以下是我輸出的參數各位可以自行嘗試出最適合自己的解法。記得幻燈片編號選取全部。

就會得到一個gif啦~雖然上圖是勾選透明背景。但是方面文章內使用,所以這個動圖有黑色底~~

B. 輸出單張投影片:使用keynote內建的動態輸出的gif

輸出的範圍記得選有動態的那張投影片就好,不然他一樣會整份簡報輸出。
(這種單一動態的效果giphy的app也可以做到。)

以下是我使用的參數:

根本不用五分鐘就可以做完了喔^^

這是你得到的結果:

這兩個小技巧giphy本身內建的動態都可以辦到!
那為什麼還要知道keynote怎麼做呢?
因為可以使出連續技啊!

去年做的,現在看起來覺得自己好天真喔

品牌申請GIPHY 超懶人包!

我們在giphy上面的banner

我是4/30的時候申請的,一個工作天內就收到回信。

本來想打一篇長文說明,後來在解釋給朋友的時候發現根本四句話就可以講完了,這邊也分享給大家。( 特別感謝 Audrey Kung / 孔翊緹 幾乎天天被我煩之外還幫我分享ig stories😇😇)

1. 需要用公司網域的email帳號申請giphy帳號,不可以是免費信箱。這個時候你的地位跟所有凡人一樣。

2. 先上傳五個gif,就會解鎖一個申請表單,網頁會自動跳出來問你是不是品牌或是創作者,如果是的話請填表。照表填寫完就可以了,這時候可以改公司聯絡人的信箱。

3. 申請之後大概一個工作天內就會通過,記得收信。

4. 現在你上傳的圖檔就會進到api裡了,若有alpha圖層,會被認列為stickers, 也就是IG限動打得出來的那種。如果背景不透明的,就可以在臉書/messenger/ IG私訊/ imessage的giphy鍵盤中搜尋出來。

⚠️請注意⚠️

到這邊為止,你還只是一個普通的品牌或是創作者帳號,不是一個verified的帳號(有藍勾勾)
目前verified(已驗證)的帳號認列方式為,提供你的其他social media account,如果也有藍勾勾機會就會比較大。

薩泰爾的平台都還沒有拿到藍勾勾(跪)會再努力嘗試。

有沒有認證,差別在於觀眾能不能搜尋你的品牌名之後直接在搜尋結果中看到品牌帳號,如果hashtag下得好,應該是不影響使用。

我們的 giphy ⬇️

有興趣的話我可以介紹一些giphy經營的案例。
以前只是把giphy當作 imgur之類的素材上傳區,現在有一點覺得要開始把giphy當作社群網站經營(目前只有一點,還在觀察中)

— —

附上一些試錯中學到的小技巧,讓各位少走一些彎路

  1. 上傳giphy下hashtag的時候可以用逗點隔開,一次按+就會全部加完。

2. 若hashtag中包含中文,第一次上傳時有時會不見,請不要驚慌,再點進去修改即可。

我有一些下了 #cute #asian #boy ,跳出來的關聯推薦圖都很母湯

3. 上傳到giphy他如果死都不進去API,怎麼搜都搜不到怎麼辦?除了觀眾要使用上比較麻煩之外,有一個小技巧就是跳到giphy,點按貼圖自動複製後,再回到IG stories的編輯頁面,就會自己出現”add sticker”

4. 如果要加上文字,keynote裡可以設定格式和行距/字距等等,尤其字距在其他載具如手機/平板上不能設定,可以在電腦版上面調整出公版之後,在手機上用keynote打開,只要字體不變調,字距的設定就不會跑掉。

5. Keynote還不支援從影片直接輸出成gif~

結語

行文至此,也是來跟大家說聊天的時候可以在FB留言或是messenger/IG對話框的GIF鍵盤打 #博恩 或 #strnetwork (還有一些神奇的關鍵字XD),就可以打出博恩的動圖啦,歡迎來到大迷因時代!

如果你覺得這篇文章有用,拍手之外歡迎分享跟儲存,別忘了到 STR的IG幫我們按讚RRR。

--

--

Sunny @ms.eatingtpe
From Conception to Completion

相信在社群的世代,每個人都可以是他人的星火。歡迎追蹤🦄️ ig:ms.eatingtpe