読者です 読者をやめる 読者になる 読者になる

akiyoko blog

akiyoko の IT技術系ブログです

「初心者向け CreateJS 勉強会 〜 クラスメソッド開発ブログ課外授業9日目 〜」に参加してきました

勉強会 JavaScript

昨日は、CreateJSの勉強会に行ってきました。
「初心者向け CreateJS 勉強会 〜 クラスメソッド開発ブログ課外授業9日目 〜」(2013.6.11)

噂のクラスメソッドに初見参です。去年から秋葉原に移転してるんですねー。

1時限目:Haxe で始める CreateJS

石上 慎太郎氏

Slide: http://www.slideshare.net/classmethod/haxe-createjs

  • ActionScriptの感覚で使うと、ちょっと違うと感じた。
  • JavaScript開発の問題点
    • クラスが作りにくい??とにかく面倒
  • そこで Haxe(ヘックス)
    • TypeScriptと一部競合?
    • JavaScriptやFlashにも出力可能
    • 静的型付言語なので、ビルド時にエラーで教えてくれる
    • 一部、型推論も
  • FlashDevelopを使ってる。コード補完ができる
    • ただし、Windows版のみ
  • Chromeデバッグできる(ソースマッピング)。ブレークポイント
  • stateをいじったら、state.update() を忘れずに
  • 「--dead-code-eliminationオプション」?を入れると、使ってないコードをスリム化してくれる(ファイルサイズが半分くらいになる)

HaxeでCreateJSを使う仕組み

  • externクラスを使う。インタフェースみたいなもん
    • CreateJS用のexternクラス群が用意されているので、それを使う(プロジェクト作成時におまじないを設定してあげる)
  • Haxeにはテスト用のライブラリがはじめから搭載されている

注意点としては、JavaScriptをある程度マスターした上で、Haxeにチャレンジしよう!(どうしてもハマることがあるよ)


CreateJSのCDNのURLはこうして取得するようです。
http://www.createjs.com/#!/CreateJS から「Download」->「Visit The CDN」
例えば最新版なら、「VERSIONS」から「2013.05.14」の右側に記載された「 http://code.createjs.com/createjs-2013.05.14.min.js」がそれ。

2時限目:CreateJS version 2013.05.14

たいが氏 @taiga http://taiga.jp/

Slide: http://www.slideshare.net/classmethod/createjs-22797608

最新版の主要機能の紹介(パッケージ群ごとに)。
たいが氏もHaxeを使っていて、IDEは IntelliJ IDEA(Macでも使える)。流行ってるから、Eclipseのキーマップが使えるからという理由で使っているとのこと。ただし、有料で年間199ドル。懇親会では、「無料のコミュニティ版は使えない」「IntelliJベースのAndroid Studioもまだ安定していなくて、今後に期待」という話もありました。

  • EaselJSがメイン機能
  • MovieClipは、CDNの全部のせやEASELJSのパッケージには入ってないので、別途入れてあげる必要があるので注意!
  • filters.Filters.jsも何故か?入ってないので、GitHubから取ってくる!(rawデータでコピペ)
  • モバイルでバイス用に、ui.Touch とかも用意されてる
  • ui.ButtonHelperは、Flash Proを使ってる人向けのヘルパー(マウスオーバーとかマウスダウンとかが効く)
    • Flash Proの「Toolkit for CreateJS」を使った機能のサポート(素材が無い状態では使えない)
  • TickerやユニークなIDを採番するUIDは、utilにある

TweenJS

  • XxxPluginはあまり使わないかも
  • http://msto.jp/p/3/ に超よさげなサンプルがあったよ
  • Ease.xxxで動きの種類を指定できる
  • 大抵の戻り値がTweenなので、数珠つなぎに書ける

SoundJS, PreloadJS

  • SoundJSで使うのは、Sound, SoundInstance, Logくらい
  • SoundJSはほぼ、PreloadJS とセットで使うことになる
  • XHRLoaderは、IEの互換をしてくれたりセキュア?にリソースを読み込むときに使う
  • 再生した音に何か処理(ボリュームを大きくしたり)をしたいときは、Sound.play()の戻り値の SoundInstance を処理してあげる

Zoe

  • ゾーイ、ゾーエ、何でもよい(笑)
  • SWFの資産がる人向け
  • JSONも出力されるので、SpriteSheetに突っ込んであげる

Toolkit for CreateJS


その他、Flash会の重鎮、野中文雄先生のページも参考になるよ
http://fumiononaka.com/Business/

ここらへんのデモも面白いよ
http://demo.project-nya.jp/_createjs/
http://void.heteml.jp/titan/