デザイン

LINEスタンプを作ろう。

ぼくが自作のLINEスタンプを作ってみたいと思ったのは2年前で、それから気が向いたらというタイミングでオリジナルのキャラクターを使ってスタンプを作っている。

検索すればLINEスタンプを作成する手順を解説した記事はたくさん見つかるが、それはスタンプに使用する画像が準備できている前提から始まるものだったっり、公式アプリを使ったものだったり(簡単と謳っているが機能が少なくて逆にやりにくい)といった記事が多い。

そこで今回は、主にスマホかiPadとパソコンを使って「無料で」イラストを用意するためのツールや下処理から実際の様子を踏まえて紹介したいと思う。

ぼくが作ったLINEスタンプの最新作ができるまでを解説しよう。

イラストを描こう

イラストの原案を作る。

作成するLINEスタンプは1パッケージにつき、8個、16個、24個、32個、40個のいずれかを選択して販売することができる。費やせる時間とアイデアと相談しながら作成する数を決めてほしい。

イラストアプリで本格的に描く。

さっそく清書に移るようなものだが、デジタルおえかきは「戻る」ボタンがあるのが何よりありがたい。紙に描いた絵をスキャナーで取り込むのもアリなのだが、実線の太さのムラや紙のシワ・汚れが映り込んだりして良い思い出がないのでおすすめしない。

スマホでも描けなくはないが、もしよければiPadを使ってほしい。Apple Pencilはあるに越したことはないが、なくてもなんとかなる。

僕が長く使っているおすすめのアプリを紹介しようと思う。このアプリの紹介がこの記事の本題だ。

そのアプリはMediBang Paintという。

 iPhone版 iPad版 Android版 無料(App内課金あり)

無料でインストールできる高機能なイラストアプリだ。

多彩なペンや自在にカスタマイズできるパレットからトリミング機能に至るまで基本的なツールが一通りそろっていて、シンプルで直感的なインターフェース。

高機能なアプリではあるが、シンプルなイラストであれば使用するのは、「ペン」「消しゴム」「バケツツール(ぬりつぶし)」だけで十分だ。

用意するべき画像は、以下の通りだ。

  • 正方形メイン画像×1個
  • トークルームタブ画像×1個
  • 作りたい個数(8個、16個、24個、32個、40個のいずれか)のスタンプ画像

「ペン」を使ってはっきりとした実線で輪郭を描く。清書を仕上げたら、各パーツごとに色を塗っていく。そして均等な余白になるようにトリミングの処理をしていく。

イラストの背景を透過しよう

そして、ここからが一つ目の壁だ。

僕も最初は苦労したが、初めてLINEスタンプを作るときにおそらく誰しも直面する問題がある。

それは、ガイドラインの規約にある、

「・イラストなどの背景は透過にしてください」

LINE Creators Market ガイドライン

という条件だ。

LINEスタンプに使用する画像はすべて背景を透過処理しなければならないのだ。

どういうことかというと、

このように、通常のスタンプは背景が切り抜かれて透明になっている。これはアプリ側で自動的にこう表示してくれるのではなく、作成段階で作者側がイラストでない部分を透明にした画像ファイルを用意しなければならないのである。

このことを知らずにイラストを描いて、手動で背景をくり抜こうとすると、それはそれは大変な作業になってしまう。

気の遠くなるような作業だ。

ちなみにこの画像で使用しているアプリは『背景透明化』というアプリだ。このアプリも無料でインストールできる。

そこで僕が紹介するこのMediBang Paintのすごいところは、ボタン1つでこの背景透明化の処理をしてくれるという点だ。

画像のシェアボタンを押すと、書き出すデータのファイル形式を選択するポップアップが表示される。その中から、「PNG(透過)」を選択する。そして次の画面で「画像を保存」を押すと、背景透過処理がされたPNG形式の画像がカメラロールに保存される。

このズラーっと並べた達成感はたまらない。

画像サイズを調整しよう

一安心したところだがここからも大変な処理が待っている。

「LINEスタンプの作り方」などで検索すると、大抵はLINE Creators Studioというアプリを使った方法が紹介されている記事がほとんどだが、僕はLINE Creators Marketのウェブページからログインして登録する方法をおすすめしたい。

まずしなければならないのは、画像サイズの変更だ。スタンプ画像をアップロードする際に、既定のサイズにしておかないとエラーが出てしまう。

僕が普段利用している画像サイズを変更するサイトがあるので紹介したい。

PEKO STEP オンラインイメージエディタ

このサービスはWebブラウザ上で動く、画像編集ツールの中の画像リサイズ機能だ。今回使用する用途だけでなく、画像の拡大・縮小や切り抜き、回転などの簡単な処理を一通りこなすことができる。

インストール型のアプリやソフトを利用するのもいいが、たまにしか使わないサービスのためにストレージを割くのももったいないのでブラウザ上で動くサービスがあるのはとてもありがたい。

このサイトの基本的な使用方法は同ページ内の下の方にしっかり画像付きで説明されているので、そちらを読んでいただきたい。

画像の読み込みがドラッグアンドドロップでできるので、フォルダとブラウザを並べて作業すると大変効率がいい。

そして一つひとつ地道に画像サイズを規定の範囲に圧縮していく。

スタンプ作成ガイドラインではそれぞれ以下のように決められている。

  • メイン画像(ヨコ 240px タテ 240px)
  • スタンプ画像(ヨコ 370px以内 タテ 320px以内
  • トークルームタブ画像(ヨコ 96px タテ 74px)

と決められている。

イメージエディタ設定画面の2つあるチェックマークのうち、「幅と高さの比率を維持する」は調整の際に細かくチェックをつけたり外したりするが、「画像を拡大縮小する」はずっとチェック付けっぱなしで大丈夫だ。

さてさて、前回スタンプを作ったときに苦戦したのが、画像のピクセル数が縦横ともに偶数でなければならないという点だ。

当時はだいぶ苛立っていた。お見苦しい姿をお見せしました。

当然、ガイドラインにもしっかり記載されていた。ちゃんと読もう。

「・画像のサイズは、自動的に縮小されるため偶数にしてください」

LINE Creators Market ガイドライン

編集画面の設定で、まずは縦横のアスペクト比を保ったまま(「幅と高さの比率を維持する」にチェックを入れた状態)、横370pixel以内縦320pixelになるように圧縮する。縦横比を維持しないと画像が伸びてしまって使えない。

次に圧縮後の縦横の数値が共に偶数になっているかどうかを確認する。もし、奇数になっていれば、「幅と高さの比率を維持する」のチェックを外して微調整をする。

例えば、320px × 357px だったら、357を358にすればいい。たった1pxの調整なら画像はほとんど崩れない。

とにかく、念入りにこの作業をしないと、登録ページにアップロードした際にエラーが出る。

画像のファイル形式や容量も細かく規定されている。スタンプ画像に関する全ての条件を確認しておこう。

· サイズの単位はすべてpixelです。

· フォーマットはすべてPNG形式です。

· 画像のサイズは、自動的に縮小されるため偶数にしてください。

· 画像の解像度は72dpi以上、カラーモードはRGBにしてください。

· 画像のサイズは、1個あたり1MB以下にしてください。

· すべての画像をZIPファイルにまとめてアップロードするには、ZIPファイルを20MB以下にしてください。

· イラストなどの背景は透過にしてください。

LINE Creators Market ガイドライン

スタンプ情報を登録しよう

すべての画像のリサイズが完了したら、あとは LINE Creataors Market に登録するだけだ。あともう一息!

大まかな流れはこちらの記事でわかりやすく紹介されている。

LINEスタンプ登録から販売までの5ステップを公開

リンク先の記事では下記の手順でわかりやすく説明されている。(赤字部分を後から補足説明)

  1. クリエイター登録をおこなう
  2. 登録後、マイページから振込先設定
  3. スタンプ詳細情報を設定する
  4. 販売者情報・販売エリアを設定する
  5. スタンプ画像を登録する

いくつか補足事項を付け足すと、

・「振込先設定」には、スタンプの売り上げを振り込む銀行口座を登録する。ただし、売り上げが自動的に振り込まれるのではなく、スタンプの売上総額が1000円を超えて初めて振込申請が可能になる

Google やLINE に手数料を差し引かれるので、120円のスタンプが一つ売れても利益は30円ほど。総額が1000円を超えるのはなかなか難しい。

・「スタンプ詳細情報」は、日本語と英語の両方で、タイトルと説明文を書かなければならない。先に日本語でシンプルな文法の文章を作って、一文ずつ丁寧にGoogle翻訳などを使って変換していこう。

「販売エリア」は日本以外の国のチェックを外しておこう。購入者の9割以上は日本に住んでいる人たちだ。この設定をするだけで審査にかかる時間を大幅に短縮できる。

・「スタンプ画像を登録」のタブから画像を一枚一枚アップロードしていく。メイン画像、トークルームタブ画像、スタンプ画像の順だ。スタンプ画像は販売するときはここでアップロードした順番に表示される。

スタンプ画像のアップロードが完了したら、ぜひタグ設定を行おう。未設定でも問題はないが、スタンプを気軽に使いやすくするために有効な設定の一つだ。

タグ」というのは、メーセージを書いたときに予測変換候補のように上に表示してくれる機能だ。そのスタンプの内容に関連するキーワードを登録することができる。

次はスタンプの販売価格設定をしよう。デフォルトでは120円となっている。120円=50コインだ。よっぽどの理由がない限り、最低価格にしておこう。高すぎて買ってもらえなければ元も子もない。

アニメーションスタンプや音声入りスタンプでない限り、ほとんどのスタンプは120円、つまり50コインで販売されている。

スタンプ情報の登録、画像のアップロード、タグの設定、価格設定が終われば、いよいよ申請だ。

スタンプを申請しよう

登録内容を念入りにチェックして間違いがなければ、マイページの右上にある、「リクエスト」ボタンを押す。表示される同意事項を確認して、「同意します」にチェックをつけて、「OK」を押せば我々クリエイターがする作業はすべて完了だ。

ステータスに「審査待ち」と表示される。

実際に審査が完了するまでに、数日〜2週間程度かかる。その間この「ステータス」は、スムーズにいけば「審査待ち」→「審査中」→「審査処理中」→「承認」というようなステップを踏む。

ただし、これはスムーズにいった場合。

LINEスタンプの規約に違反していると「リジェクト(却下)されて、やり直しになってしまう。修正箇所を直して再申請してもまた一から審査の順番待ちだ。時間をかけないためにも一発でパスできるように、審査基準を丁寧に確認しておこう。

こちらの記事でわかりやすくまとめてある。

【LINE Creators Market】LINEスタンプ審査基準まとめ&よくあるリジェクト理由

最初の数日は気になってそわそわするのだが、ちょうど忘れた頃に審査完了の通知が届く。

販売開始の処理をして、数時間経ってようやく、LINEのスタンプショップが更新される。そして、作ったLINEスタンプが日本中で購入できるようになる。

おつかれさま!

完成品の紹介

最後に宣伝になるが、今回筆者の作ったLINEスタンプがこちら。シリーズの第3弾になる。気になった方はぜひ使ってみてほしい。(画像をクリック)

青ぼうしくん3

  • この記事を書いた人

やぬぬ

種子島育ちの21歳。ブログとYouTubeをちょこちょこやりながら、デザインとプログラミングを勉強中。

-デザイン

Copyright© 継ぎ接ぎ博物誌 , 2020 All Rights Reserved Powered by AFFINGER5.