LINEスタンプ Office PowerPoint

パワポしか使えない私はこうした!PowerPointをフル活用した「LINEスタンプの作り方」公開!【効率は悪い!?】

投稿日: 更新日: 2017年10月19日

f:id:d3dayo:20170920173746p:plain

ほぼ、寝ずの作業で「鉄は熱いうちに打て!」さっそくLINEスタンプを審査に出してみたでででーさん(@d3_dayo)です!

このブログで何となくやってきた企画?である、主にブログを書いている方からリクエストを頂き、その方への妄想イメージをイラストに仕上げる『きったないイラスト』

この企画で作成したイラストたちをノリと勢いと後押しをうけてLINEスタンプ化するべく、早速スタンプ用の画像をこしらえて審査へと出しました。

あとは待つだけ。

何か画像に問題があればLINE社からのリジェクトが入りますが、何も問題なければ、晴れて私もLINEクリエイターズの仲間入りです(笑)

さて、晴れて審査が通り、あの愛着溢れるイラストたちがLINEスタンプとしてリリースされてから、まとめて情報を書こうと思っていましたが、「鉄は熱いうちに打て!」早く書かないと私自身が忘れてしまいそうなため、今回はLINEスタンプ作成にあたって…私がやった「決して効率は良くないけど(多分本当に良くない)パワポを中心的に使ってスタンプが作れるよ」という方法を紹介したいと思います!

さいしょに

ご存知な方はご存知、私でででーさん。何かとPowerPointを使うことが好きです。好きというよりも画像や動画のちょっとした編集をするにあたり、一番使いこなせるのが私にとってはパワポなので、あれもこれもパワポに依存した環境で作成しています。

そう、このブログで使っている画像も全て何らかの編集工程において、パワポを媒介している画像ばかりです。

そんな私、今回もこれまでの例に漏れず、パワポをフル活用してLINEスタンプの素となる画像加工に着手しました。ただ、私がいつも描いている『きったないイラスト』シリーズ、これはパワポでは描けないのでスマホアプリのZen Brushという水墨画アプリを使って書いています。

Zen Brush

Zen Brush
開発元:PSOFT
¥360
posted with アプリーチ

www.d-3.site

それから画像をスタンプ化に適したサイズへと縮小する作業、これは私のお気に入りペイントソフト(フリー)GIMPでやります。

www.gimp.org

つまり、今回のスタンプ化へ向けての作業で使用したアプリケーションは全部で以下の3つということになります。

・Zen Brush
・PowerPoint
・GIMP

この記事ではパワポで作業したことを主に紹介していきます。

パワポでやったこと

ここから、スタンプ作成にあたってパワポで作業した内容や小技、むしろスタンプ作成に適したパワポテンプレートの公開もしていきたいと思います。

LINEスタンプとして使用できる画像のサイズ(通常スタンプの場合)

まず最初に、LINEスタンプを作るにあたって覚えておきたいこととして、スタンプ化できる画像のサイズは決まっているということです。そして、通常スタンプというのはアニメーションスタンプではないということです。

メイン画像
メイン画像というのはLINE ストアのページでそのスタンプのキャッチとして表示される、赤枠で囲ったこの画像のことですね。

f:id:d3dayo:20170920155749p:plain

このメイン画像のサイズは幅240×高240ピクセルと指定されています。対応している画像の種類(拡張子)はPNGです。

タブ画像
タブ画像というのはLINEのトーク画面でスタンプを切り替える際にでてくる、タブの部分に表示する画像で下図の赤枠で囲った部分のことです。

f:id:d3dayo:20170920160455p:plain:w350

このタブ画像のサイズは幅96×高74ピクセルと指定されています。対応している画像の種類(拡張子)はPNGです。

スタンプ画像
そして、スタンプとなる画像ですが、こちらは「幅80~370ピクセル」「高80~370ピクセル」とサイズに幅があるようで、対応している画像の種類(拡張子)はPNGです。

私が今回作成したスタンプ画像のサイズは全て幅300×高270ピクセルで統一しました。下に貼ってあるサンプルのスタンプ画像がその比率になっています。

f:id:d3dayo:20170919223809p:plain:w450

各画像のサイズに適したパワポの型を作成する

これから紹介する作業がしやすいように、型を作るところから始めなくてもすぐに使うことができるパワポのテンプレートを用意しておきました。

ででで式LINEスタンプ作成用パワポテンプレート

↑上のリンクをクリックすればダウンロードできるのでご自由にお使いください!

まずは各サイズに適した画像作成の作業ができるように、パワポのスライド内に枠として図形を配置しました。

ちなみに、スタンプを作る時に注意しなければいけないこととして、画像の透過漏れがあります。透過し忘れの部分があると、LINE社から審査でリジェクトされてしまうので、透過状況が見やすくなるようにスライドの背景色は白ではなく色をつけています。

メイン画像
メイン画像は正方形なので、こんな風に正方形の図形をスライドに挿入して範囲がわかるように図形の枠線を黒にしました。

f:id:d3dayo:20170920163522p:plain

タブ画像
タブ画像は96×74ピクセルですが、これだと小さすぎて作業がしづらいので同じ比率でもっと大きい図形をスライド内にこんな感じで挿入しています。

f:id:d3dayo:20170920163718p:plain

スタンプ画像
スタンプ画像もタブ画像と同様に、指定サイズだと小さすぎるので300×270ピクセルと同じ比率の図形をこのようにスライド内へ挿入しています。

f:id:d3dayo:20170920163917p:plain

図形の枠内でスタンプのデザインをレイアウトしていく

上記の型を作成したら、さっそくパワポのスライドでスタンプ画像をレイアウトしていく作業に入ります。先ほど、型として挿入した図形はこんな感じで指定サイズに沿った画像を作るために使用しています。

f:id:d3dayo:20170919223556p:plain

↑図形枠の中にレイアウトを収めて、指定の画像比率以外の画像にならないよう作業をします。

レイアウトが完了したら、型として挿入した図形の枠線は邪魔になるので、図形を選択した状態でリボン(パワポ画面上部のメニュー)から書式→図形の枠線→枠線なしを選択して、図形に設定した枠線を消します。ただし、図形自体は画像の比率を作る型としてそのまま利用するので削除はしません。

f:id:d3dayo:20170920164602p:plain

あとはこの状態でスライドの何もオブジェクトを挿入していない部分をクリックしてから、キーボードの「Ctrl」と「A」キーを同時押しして、スライド内のオブジェクトを全選択します。

f:id:d3dayo:20170920165213p:plain

そして、この状態で選択されているオブジェクトの上でマウスの右クリックをし、表示されたメニューから「図として保存」を選択します。

f:id:d3dayo:20170920165407p:plain

あとは画像をPNG形式で保存をすれば(ここでJPGを選んでしまうとスタンプに対応できないので注意!)このように指定の画像サイズ比率に沿った透過PNG画像の完成です。

f:id:d3dayo:20170920165546p:plain

この画像を今度はGIMPで開き、指定の画像サイズへと縮小すれば形状の崩れなく指定の画像を完成させることができます。

先ほど、この見出し冒頭で紹介したLINEスタンプ作成用のスライドテンプレートですが、既に各スライドへ画像の比率を守るために必要な透明の図形を敷いている状態です。また、レイアウトがはみ出さないようにするための枠線はスライド自体のテンプレート(スライドマスタと呼ばれるもの)へ既に仕込んでいるので、上記手順で紹介した図形の枠線を消す作業は不要で使うことができます。

ででで式LINEスタンプ作成用パワポテンプレート

おわりに

というわけで、今回は私がLINEスタンプ作成にあたって実際に行った、パワポフル活用の流れを記事として紹介させて頂きました!

これ…完全に「読むもの」ではなくて、実際に興味がある人が作業しながら「追っていく」ものですね(^_^;)

こんな感じで私は今回、まず元のイラストや題字(セリフ)はZen Brushで手描き、そしてパワポでスタンプ用のデザインをレイアウト、仕上げでGIMPを使い画像サイズの縮小という工程を踏んでスタンプを完成させました!非常に手間がかかったような気がします(笑)

それにしても、審査終わるまで大体一週間くらいですかね!?なんとなく…ワクワクドキドキしますね(^^)/

また、何か進展があれば、このブログでもお知らせしたいと思います!

なぜ?LINEスタンプを作ってみようと思ったのか?それはこちらの記事で!

www.d-3.site

でででーさん
2017年2月21日はてなブログでカキタクナッタラ開設。2017年10月22日にWordPressへ移行しました。IT関係のネタをメインにラーメンのことや雑談記事など幅広く書きます。たまに変なイラストを描いたりウェブ制作をすることもあります。