デザイナーのイラストノート

Fireworks

LINEスタンプづくりにFireworksをおすすめする理由

2月26日にLINEのオリジナルスタンプをだれでも制作できると言う話が発表されました。「LINE Creators Market」イラストであることが必須、png形式、スタンプだけで40個…これは…なんというFireworks向き案件!ということで今回はその理由を。

まずは概要

LINEスタンプのガイドラインによると、必要なものは

  • メイン画像(1個) 240×240px
  • スタンプ画像(40個) 370×320px(最大)
  • トークルームタブ画像(1個) 96×74px

上記の画像計42個で、形式は全てPNGです。スタンプ、トークルームタブ画像は性質上背景透過になると思います。

イラストをどのアプリケーションで制作するかというのは個人の好みの問題なのですが、Fireworksで作る場合にはぜひ「ステート」機能を使うことをおすすめします。

ステートとは

image01

Fireworks CS4以前は「フレーム」とも言われていました。主にはアニメーションを作るときに使われる機能です。この機能を使わなければ、普通に横に40個作っていくことになると思うのですが、ではなぜステートをおすすめするのかと言うと

  • レイヤーを各ステートで持てる
  • オニオンスキンで全てのステートを確認
  • 全てのステートに一括で修正・削除できる
  • 書き出しのファイル名管理も楽

以上です。ではひとつずつ。

レイヤーを各ステートで持てる

スタンプ画像だけでも40個、横に並べて作っていくとその分だけレイヤーも増えます。その点、ステートなら1スタンプ1ステートにしておけば、その分のレイヤーしかありません。他のスタンプのオブジェクトを誤って消してしまうこともありません。

オニオンスキンで全てのステートを確認

image02

Flashを使ったことがある方にもおなじみの「オニオンスキン」。「玉ねぎの皮」のようにうっすらと選択したステートの内容を確認できます。もちろん選択して位置を合わせたり、不要なものを削除したりも出来ます。

全てのステートに一括で修正・削除できる

image03

例えば40個作ったあとに、「40個全て同じ位置にサインを入れよう」と思いついたとします。そんなときは新規フォルダを作成して共有したいサインを入れ、レイヤーパレットから「レイヤーを複数ステートで共有」を選択します。共有されているので、位置やサイズを変更すると全てのステートに反映されます。共有を切ると、レイヤーの中身を全てのステートにコピーするか、現在のステートのみか選ぶことが出来ます。

書き出しのファイル名管理も楽

image04

横に並べる方法とは違い、40個全て書き出しサイズで作成できているので特にスライスを切る必要はありません。クイックに連番で書き出すもよし、それぞれのステートに名前をつけると、ステート名.pngで書き出されます。

便利機能:ステートに配分

image05

最初からステートを使用して作る方法を紹介しましたが、すでに制作したものをステート化することも出来ます。1ステートにまとめたいものをグループ化して、全てを選択してステートパネル右「ステートに配分」を選択します。書き出しや一括調整だけでもメリットがあるので、横並びで作っておいて、最後にこの方法でステート化するのもありかと思います。

まとめ

もともとこのステートの機能でwebサイトの商品画像やサムネイルを作るのが便利でよく使用しているので、今回も同じような発想でLINEスタンプづくりに当てはめてみました。このサイズのイラストを作成するのにもFireworksは向いていると思うので、わたしも実際制作するときにはこの方法で作成すると思います。スタンプの登録開始まではあと1ヵ月ほどありますので、いまからアイデアを練っておもしろいスタンプ作っていきましょう!

Fireworksでイラストならこちらもどうぞ。

少しでも制作のお役に立てたらうれしいです!

イラストノート トップページへ戻る

ページのトップへ戻る