fc2ブログ
TOP ≫ ARCHIVE ≫ 2016年06月
ARCHIVE ≫ 2016年06月
      

≪ 前月 |  2016年06月  | 翌月 ≫

動く!クリエイターズスタンプのバナーに…

数日前、ゆるゆるハムスターが登場してて嬉しかった話…笑
1日で変わるみたいなんだけどたまたま載ってました!LINEさん、有難う御座います!!
line.jpg

テンションあがりすぎて「も」の字の最後のブラシ感だけが変わってるw

ゆるゆるハムスターとアニマル、よろしくです!
詳細はこちらから♪→http://line.me/S/sticker/1291661
スポンサーサイト



念願のLINEアニメーションスタンプ発売!!!

ずっと作りたかったLINEアニメーションスタンプが
遂にクリエイターズ解禁!!
何もない真っ白い紙から一つの命が生まれるわけですよ。
夢があると思いませんか!(バンバンッ!)

というわけで第一弾として作りたかったものを詰め込みました!
ゆるゆるハムスターとアニマルです!
詳細はこちらから♪→http://line.me/S/sticker/1291661


製作ガイドラインの意味をわかってなくて
アップできないよ!ちゃんと作ってるのに!!って若干心折れましたが
(しかも結局悪かったの自分)
何とかストレートで審査も通って無事販売出来ました(^o^)

ツイッターで嬉しいお言葉沢山貰って
しみじみと幸せものだなと思いました( TДT)

ダウンロードしなくても再生は可能なので
Notiこんなの作ってたのか!って見てやって下さると嬉しいです♪

そして前後してしまったのですが笑
新キャラおおかみさんのスタンプも発売中なのです…!!
(言い訳すると夏発売予定のゲーム作成が忙しくて…)
リアクションいっぱいに描いたので、こちらも宜しくお願いします♪

ゆるゆるオオカミさん
詳細はこちらから♪→http://line.me/S/sticker/1281010

ゆるゆるオオカミさん


只今販売中のLINEスタンプ一覧はこちら♪→http://line.me/S/shop/sticker/author/1781


今オススメでダウンロードしたスタンプ出てきてくれるんですもんね…!
スクショ頂いて感動して沢山保存してしまいました笑

LINEアニメーションスタンプの作り方

ずっと作りたかった動くスタンプ!
この度クリエイターズで作成可能になったので
早速作らなきゃ!!って思ったけど
色々躓いたので自分メモ程度にちょっと書いてみようかと。

APNGってファイルの種類は初耳であたふた。
Gifアニメにすりゃあいいってもんじゃないんだよ( TДT)

あくまでも私の作り方なので多分他にもっと効率良いやり方もあると思うのですが
これでLINEクリエイターズの審査は通るのでよかったら参考にしてみて下さい(^o^)

★使用環境★
・制作はWindows、APNG化はMac


①Photoshopでアニメを作る(今回は1秒のアニメーション)
(AnimateCC(旧FLASH)にも挑戦したけど
フォトショでコマアニメ作るのに慣れてたから作業効率悪くてやめた)

計算が出来ない子なので1枚を0.1秒で基本作成。
見せたい部分は0.2秒だったり臨機応変に。
sc


★アニメの1枚目がLINEストア上のプレビュー画像になるので
最終フレームと繋がるor最終フレームと同じ絵 に設定しておくと綺麗。

②余白をトリミング
※ここで躓いたポイント!
画像サイズが270px以上であればオッケーなのかとおもいきや
高さが270px以上あるとエラーでアップロード出来ません!!

320px×270pxまでってそういうことだったのね( TДT)
高さを270px以下になるように画像サイズも調整。


③フレームを書き出す
0.2秒で作ったものは同じフレームを二枚書き出し。
全部で10枚の画像完成てってれー♪
※20枚以上になるとエラーではじかれるので
画像は20枚までにおさめる。


〜ここからMac登場〜
④このままだと重いのでPNG圧縮
「Automator」のスクリプトで一括圧縮します。
それでもアニメが300KB以上になる場合は「ImageAlpha」で一枚ずつ圧縮しておさえます。

★APNGに書き出し
⑤「ターミナル」を起動

⑥cd(半角スペース)を打って「apngasm」が入ってるフォルダを
ターミナルにドラッグ、Enter。
(apngasmはフリー配布されてるAPNG AssemblerをDLしました)
こちら→https://sourceforge.net/projects/apngasm/


⑦「apngasm」をターミナルにドラッグ、Enter。
(詳細みたいなのが出てこない時はもう一回ドラッグ&Enterしてみる)

⑧./apngasm animate.png frame*.png 1 10 -l2 をターミナルにコピペ。

ファイル名に「frame」と名前のついてる画像を
「1/10秒(0.1秒ごとに1枚ずつ画像表示)」で「ループ2回」させて「animate.png」
というファイルを作りますよという意味。
これで10枚のPNG画像が2回繰り返されるので2秒のアニメーションが完成。

ちなみにループさせたくない場合は「l1」で出来ました!

⑨APNGファイル完成!(てってれー♪)


そんなこんなで無事作成された
「ゆるゆるハムスターとアニマル」のLINEスタンプは下記から見れますよ〜!(宣伝)
ポチポチ再生してやって下さると嬉しいです!
さーてまったりと次回作も作っちゃおうかな!
ゆるゆるハムスターとアニマル