これタイトルで伝えられる気がしないw FlashCC for createjsで書き出した .js ファイルと 使用している画像を格納した images ディレクトリを使って、 マニフェスト内の画像のsrcがbase64化された .js ファイルを改めて出力する、 node-webkitでできたアプリ です。 これでフラッシャーさんやらデザイナーさんも使えるようになって、 そもそもbase64化されたファイルをgit管理したりできますね。 参考:leader22/nw-createjs-manifest-converter 使い方 もはやREADMEに書いてあるので割愛したいくらいですが一応。 node-webkitをインストール 実行ファイルをダウンロードして保存 すると、ダウンロードしたファイルが実行できるようになってるので、実行。 表示された内容に従って使ってください。 Window
CoffeeScript には簡単にクラスの継承を実現できる機能が備わっていますが、こと CreateJS のクラスを継承する際には従来とは少し異なる手法で実装するがあるので、注意が必要です。 知ってしまえば大したこと無いのですが、ちょっとクセのあるテクニックなのでサンプルを交えてその方法を紹介します。 例) createjs の Bitmap クラスを継承してみる 従来の継承 通常、CoffeeSctript でクラスの継承をするには以下のように記述します。 Animal クラス class Animal constructor: (@name) -> alive: -> false Dog クラス class Parrot extends Animal constructor: -> super("Parrot") dead: -> not @alive() Animal クラスを継承
先月のことですが、ついに iPhone4(sじゃないです) を機種変して iPhone5s に機種変しました。 ちょっと大きくなった本体と、ガラス背面と側面のフレームのくぼみが無くなって手にフィットしなくなったのにちょっと戸惑いつつも、 文字を打つだけでアプリが落ちたり、ホームボタンがなかなか効かない現象から開放されたことが何より嬉しいです。 Canvas の動作を比較してみることにしました という訳で4 → 5s でどのくらい Canvas の処理能力が上がったのかをチェックしました。 今回はそのままお持ち帰りしてきた iPhone4 との比較を行っています。 検証環境 iPhone4, iPhone5s 共に iOS 7.0.4 でブラウザは Safariを使用しました。 プログラム中で使用したライブラリ Canvas のAPIを扱うのに CreateJS(EaselJS)を, FPS
Our past experiments demonstrated that there is no benefit to building a general purpose WebGL renderer for EaselJS. Modern canvas implementations already do a great job at rendering arbitrary 2D content on the GPU, and they use native code to do the heavy lifting. We’re not going to beat them in JS. However, it is possible to realize huge performance benefits with WebGL if you place appropriate r
連載 URL CreateJS を利用した線表アプリの部品づくり ( 部品編 1/2 ) CreateJS を利用した線表アプリの部品づくり ( 部品編 2/2 ) CreateJS を利用した線表アプリの部品づくり ( 実装編 ) HTML5 の Canvas を用いた線表アプリを作るときに必要になるであろう、下記画像のような部品 ( タスクボタン ) の作りかたについて解説します。 環境 CreateJS 2013.09.25 ver. EaselJS 0.7.0 TweenJS 0.5.0 MovieClip 0.7.0 Haxe 3 CreateJS を用いたボタンづくり CreateJS の ButtonHelper を使用することによって簡単にボタンを作成することができます。ButtonHelper は MovieClip 拡張 JS をボタンとして利用するために必要な処理をサ
こんにちは。結婚式ラッシュに備えて始めたダイエットは成功しましたが、まだあとひとつ残っているのにちょっと気がゆるんでいるてるみです。 SONICMOOV LABにて度々ご紹介しているHerlockで現在アニメーションについてドキュメント公開しているのは、SpriteSheet・TweenJSなどの実装方法です。でも、複雑なアニメーションを再現するにはちょっと面倒。。。ちょっと待って!自由度の高いアニメーションが簡単に再現できるCreateJSを使用したライブラリが公開予定です! そこで今回は、12/1に弊社からリリースしたゲームアプリ「それゆけ!ヤンキッキー」のキャラクターアニメーション制作を例に、ちょっとフライングしてCreateJSを使用した実装過程をご紹介します。 ①Flashでアニメーションをつくる 基本的にCreateJSの仕様を元につくりますが、Herlockを利用する際にもち
About me ゲーム好きのWebプログラマです。 使用言語はActionScriptとPHPがメイン。遊んでみたプログラムやゲームの話題について書きます。ブログのタイトルはTwitterアイコンが由来。 Twitter 先日FlashCCがアップデートされてバージョン13.1になり、Toolkit for CreateJSが統合されました。今までToolkit for CreateJSはあまり使ったことがなかったのですが、正直なところFlashに無理やり付けた感が強くて、おまけ程度の認識でした。しかし、FlashProfessionalに統合されたのであれば、もしかしたらFlashProfessionalのみを使用して、タイムラインベースで作業を完結できるのかな?という期待感があり、早速試してみました。 試してみた感想 かなり実用的に使える気がします。サンプルとして、 タイムラインベ
Flash Professional CC 13.1から、新たなドキュメント形式として[HTML5 Canvas]が加わりました。これまでの[Toolkit for CreateJS]パネルによる[パブリッシュ]に替えて、ドキュメントからHTML5とCanvasに対応させようというものです。本稿では、FlashドキュメントをHTML5 Canvas形式に変換し、CreateJSで手を加えるまでの流れを簡単にご紹介します。 01 HTML5 Canvasドキュメント Flash Professional CCを13.1にアップデートして起ち上げると、[スタートアップスクリーン]の[新規作成]の初めに[HTML5 Canvas]が表れます(図001)。FlashなのにFlash Playerを使わない形式が先頭に来なくてもよさそうな気はしなくもありません。 図001■[スタートアップスクリーン
そうだ! Haxeを触ってみよう! :bouzu: Sublime Text 2 を使って、CreateJS を使えるようにしてみるよ。 :boy: ぱんちょ先生 :hakase: がステキ記事を書いてくださってるので、これを参考に進めていくよ。 参考資料「Haxe + CreateJs を Sublime Text 2 で開発する準備をしてみたのでメモ | LLC DigiFie」 [1] Haxe :check: 「index - Haxe」 Haxe Toolkit (Automatic Installer) をダウンロードして、インストール。 最新版 Haxe 3.0.1 をダウンロードしたよ。(2013/11/15 現在) Terminal を起動して、
CreateJS でベクターシェイプを描写するためには Graphics クラスのメソッドを使って書いていきます。 単純な図形なら問題ないのですが、 複雑なパスを書くとなるとちょっと面倒ですね。 Toolkit for CreateJS を使ってFlashで書いて出力する方法もあるのですが、 今回は Illustrator を使って出力する方法を紹介します。 Drawscript Drawscript は Illustrator のプラグインです。 Illustrator で書いたベクターシェイプを、選択した形式で扱えるコードに変換してくれます。 BETA4 の段階では、 Objective-C C++ Canvas(JavaScript) CreateJS(EaselJS) Processing ActionScript 3 JSON RAW BEZIER POINTS に対応しているよ
これはCreateJSを使用した際にAndroid4を搭載した一部のスマートフォンで発生する不具合に関する報告である。 概要 CreateJSを使用した際にAndroid4を搭載した一部のスマートフォンで、不具合が発生することがいくつかのブログで報告されている。問題報告と同時に解決策を提示してるブログもある為、それを検証した結果を報告する。 本件に関するブログ 本件に関して触れているブログとして以下のものがある。 (1)まるちゃんブログ CreateJSでハマったこと (2)1 pixel|サイバーエージェント公式クリエイターズブログ Flashで作るスマフォブラウザゲーム向けアニメーション (3)しょぶろぐ Android4.0とCanvasアニメーションの話 不具合の起こる端末 実際に不具合の起こる端末として以下の名前が挙げられている。[]内の数字は上記のブログの番号を示すものである。
Since my previous post discussing why we don’t support width & height in EaselJS, I decided to polish off and include a bounds solution we had previously roughed out. It comprises three new methods available on all display objects: getBounds(), getTransformedBounds(), and setBounds(). The getBounds() method will return the bounds of the object in the object’s local coordinate system (relative to i
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く