synfig studioでつくるvectorアニメーション(iphone dev sap勉強会 20120512)
DESCRIPTION
TRANSCRIPT
Synfig StudioでつくるVectorアニメーション
iPhone Dev Sap勉強会 May 2012
須釡達雄 @gamako
Agenda
• 自己紹介
• SynfigStudioの紹介
• iPhoneアプリで使うときの工夫
自己紹介• 須釡達雄
• Twitter: @gamako
• 株式会社ビーユージー
• iPhone, Android, node.js, golang...
• 会社でジリリ、個人でうさこアプリなど
うさこでんたく
• うさこが手書きで計算
• 数字を喋る!
• なごむ!
今日の話題
Synfig Studio
• Vectorアニメーション作成ツール
• Win, Mac, Linux
• オープンソース
• Adobe Flash高いよ(泣)!という人に
Vectorアニメーション
• Vectorグラフィックスのアニメーション
• 点と線と塗りの時間変化を表現(間を計算で補完)
計算で補完
Raster vs Vector
• 一枚一枚描かなくてもいい
• 解像度、フレームレートの変更も自在
• プラットフォーム の変更
デモ
Synfig Studio
• Macでもインストール簡単になったけど・・・
• gtkベース(泣)
• 重い、わりとよく落ちるorz
• IKとか何それ、おいしいの?
正直• あまりおすすめできないかも、、、orz
• べつに・・・
いいところもあるよ
• ファイル形式がSVGに近い(xml)
• コア部分のコマンドライン実行ファイルが提供されている
• 書き出しを自動化できる
iPhoneアプリで使う
• pngのパラパラアニメを書き出して
• TextureAtras化して
• cocos2dでanimation
png書き出し• フレームレートを指定して
• 連番のpng
• コマンドラインでもできる
余白を削除• 余白を削除
• 切り出した座標を出力するツールを自作
TextureAtlas化• TexturePacker 有料ツール
• (GUI&コマンドライン)
• コマンドラインで連番png → Texture & plist
読み込むコード• CCAnimationCache 順番にaddFrame
自動化
• synfigファイルからTextureファイル&コード生成まで行うPythonスクリプト
• できたものをごっそりXcodeに追加
希望• ほんとはiPhoneでVectorデータをそのまま扱いたい
• Retina用、非Retina用pngをバイナリに含めたくない
• 誰か作って!
まとめ
• Synfig StudioでiPhone用のアニメーションをつくる方法。
• 安定性は不安。これからに期待。
• 工夫の余地あり。
おしまい
• UIKitベースで作ろうとすると、またいろいろ・・・
• うさこでんたくよろしくね