タグ

ブックマーク / clockmaker.jp (17)

  • たった数行のコードでクールなパーティクル表現を実現! Flash Player 11対応の2Dフレームワーク「Starling Framework」 | ClockMaker Blog

    たった数行のコードでクールなパーティクル表現を実現! Flash Player 11対応の2Dフレームワーク「Starling Framework」 Flash Player 11の新機能Stage3Dですが、上条さんのブログでも紹介されているとおりStage3Dは3Dだけでなく2DでもGPUを使って描画できます。2DにおいてはStarling(スターリン)というフレームワークが存在し、これを使うことで2次元表現でもGPUの圧倒的なパフォーマンスを得ることができます。Adobe MAX 2011で受講したセッションのまとめでも紹介しましたが、Starling FrameworkはAdobe側もフィーチャーしており、今後が期待できるフレームワークの一つと考えて間違いなさそうです。ちなみStarlingについては次の記事が参考になります。 Starling (新しい ActionScript

    たった数行のコードでクールなパーティクル表現を実現! Flash Player 11対応の2Dフレームワーク「Starling Framework」 | ClockMaker Blog
    mac10
    mac10 2011/11/04
  • 正式リリースされたFlash Player 11の新機能を試せる20本のデモ | ClockMaker Blog

    今月上旬に、待望のFlash Player 11 の正式版がリリース しました。前のFlash Player 10から約3年ぶりのメジャーアップグレードとなります。 新しい機能は公式サイトで紹介されてますが、ブログではインキュベーター版の頃から作られた実際に新機能を体験できる実験的デモを集めてみました。ご覧になる前にFlash Playerを最新にしておくことをお進めします。(開発者向けデバッグプレイヤーはこちらです) Stage3DによるGPUを活用した2D表現 LLC DigiFie » Starlingのパーティクルをちょっとだけさわってみた Starlingという2D表現のフレームワークでつくられたパーティクルデモ。GPUを使っているため高速。 Introducing Starling – ByteArray.org こちらもStarlingのデモ。4点のデモが掲載されています。

    正式リリースされたFlash Player 11の新機能を試せる20本のデモ | ClockMaker Blog
    mac10
    mac10 2011/10/26
  • GPUを利用したCoverFlowのサンプル (ソースコード付き) | ClockMaker Blog

    iTunesのようなCoverFlowのサンプルを最新版Flash Player 11のGPU機能を使って作ってみました。ソースコードも無料で公開していますので、よければ試してみてくださいませ。 デモ (要Flash Player 11) ソースコード一式 技術解説 Cover Flowはこことかここをはじめ今までいろんなところで無料サンプルが紹介されてますが、ポリゴンの重なり問題や、床の反射表現、奥行きのライティング具合(画面端のスライドほど暗く見える)など、こだわるポイントが結構あって地味に処理負荷が重い表現手法の一つでした。Flash Player 9時代のPapervision3Dでポリゴンの重なり問題が結構シビアだったりして、CoverFlowに限らず苦労された方も多かったのではないでしょうか。今回はAlternativa3Dというフレームワークを使用していますが、ポリゴンの重な

    mac10
    mac10 2011/10/20
  • Facebookで行われたFlash系アンケートの集計結果をまとめてみました | ClockMaker Blog

    Facebookにはアンケート機能があるのですが、Flash / ActionScript関係で集計した有益なアンケート結果がありましたのでシェアします。 ActionScriptでサーバーサイド(PHPCGI等のAPI)とやり取りする際に、レスポンスにどのフォーマットを使いますか? XML : 71票 JSON : 45票 プレーンなテキスト : 13票 AMF : 9票 CSV : 12票 swf のバイナリに直接変数書き込み : 2票 (※FlashLiteでのパラメーター保存の常套手段) 主なコメント JSONは直接AS3やJSのObjectとして扱えるので便利​。 システムから吐き出す場合はJSONが多いです。手動で更新する​様な場合はXMLを使ってます。 XML。クライアント自身が修正できるように極力わかりやすい表​記を心がけてますね。 XML以外やったことありません。(((

    mac10
    mac10 2011/08/12
  • Flash Player 10でPV3D上の落書きを保存してみる | ClockMaker Blog

    最近は業でなかなか忙しかったので久しぶりの投稿です。そろそろFlash Player 10(Astro)の勉強も再開しなければと思い、新しくなったFileReferenceを題材にサンプルを作ってみました。PV3D上で落書きしたテクスチャをローカルファイルに保存したり、再度読み込んで再編集もできるというものです。 demo (require Flash Player 10) src Main.mxml World.as 仕様として横1000x縦500pxの画像でぴったり球面に張り付きます。Planet Earth Texture Mapsの低解像度の画像(フリー)がお勧めで、これを使うと地球儀に落書きができます。 FileReference.loadで画像を読み込む 新しくなったFileReferenceではローカルで選択したファイルを直接Flash Playerに読み込むことができます

    Flash Player 10でPV3D上の落書きを保存してみる | ClockMaker Blog
  • [Flashの高速化を試す]BitmapDataを配列に格納することで2〜3倍の高速化 | ClockMaker Blog

    「3Dのパーティクルに被写界深度をつけてみた」で紹介した Flash で被写界深度表現を高速化する常套手段ですが、もっと身近で実用しやすい例で試してみました。500〜1000個ぐらいの矢印がランダムに動き回ります。 シェイプだけだともっさりするよ BitmapDataで配列に格納すると高速化するよ 前者は矢印のシェイプをもったインスタンスが動き回るデモで私の環境では500個でfps30程度、後者は矢印のシェイプをプレレンダリングしたデモで1000個でfps50程度でてます。具体的な数字にしずらいのですが、単純に言ってしまえば2〜3倍くらいは高速化しています。(※当方の環境は Mac OS X 10.5, iMac, Core Duo 2GHz, Memory 2GB, Windowsだともっと早いです) 元ネタ 元ネタは Adobe MAX 2008 の城戸さんのプレゼンです。ビデオの8割

    mac10
    mac10 2010/08/13
  • PV3D演出サンプルNo.08:カスタムフラットシェーディング | ClockMaker Blog

    Flashの3Dライブラリ Papervision3D(ペーパービジョン3D)  2.1 のデモ。高速に実行できるフラットシェーディング(テクスチャに陰影を付ける方法)を試してみました。陰影をつけることで質感に味がでてくるので、ブラッシュアップの一手法として紹介してみます。 demo (要Flash Player 9) source 技術的な解説は以下から。今回は当ブログ初登場の3D行列計算を試してみました。 ライブラリにはFlatShaderクラスという汎用的なシェーディング機能が備わってますが(関連記事:Papervision3Dでビットマップのテクチャにライトを適用する方法)、込み入ったモデリングデータに適用しようとすると、速度がでない上に破綻することがあります。ビルドインのFlatShaderで試したのは次のデモ。 立方体の面が三角ポリゴンに分割され、破綻しているのが確認できます。

    PV3D演出サンプルNo.08:カスタムフラットシェーディング | ClockMaker Blog
  • グローバルエラーハンドラーでFlashのエラーダイアログを回避する方法 | ClockMaker Blog

    Adobe Flash Player 10.1 の新機能の一つとしてグローバルエラーハンドラーというものがあります。これは ActionScript でエラーが発生したときに、コーティング(捕捉)していないエラーを受け取ることのできる機能です。 主な利用用途として想定しないエラーのバグ収集を行う場合に役立ちます(参考:FACEs: FlashPlayer10.1でバグレポート)。今回の記事は、グローバルエラーハンドラーのもう一つの使い方として、Flash開発者に恥ずかしいエラーダイアログを表示させない方法の紹介です。 ランタイムエラーのダイアログ さて、Flash 開発者であれば Flash Player のデバッガー版を利用していると思いますが、Flash サイトを見ているときに次のようなエラーダイアログが表示された経験のある方は多いのではないでしょうか。 一般的なエンドユーザー向けの

    グローバルエラーハンドラーでFlashのエラーダイアログを回避する方法 | ClockMaker Blog
    mac10
    mac10 2010/06/30
    グローバルエラーハンドラーについて
  • カスタムイージングを作成できるAIRアプリ「Easing Generator」 | ClockMaker Blog

    FlashのActionScriptトゥイーンエンジンに利用できるカスタムイージング(加減速)編集アプリを作りました。ActionScriptでトゥイーンを作成するとテンプレートと言える「イージング関数」は数種類しかないので似たような動きになりがちです。それを解決すべく作った、動かし方を自由に編集できるツールということです。ActionScript 3.0で主要なトゥイーンエンジン各種に対応しています。 インストール方法と主な使い方は以下から。 このアプリが役立つ場面 [上:Flash Professionalのような感覚で加減速を調整できる] このアプリは主に次のような場面で役に立つと思います。 標準搭載のイージングに自分の求めている動きがなかった 始点と終点で別々のイージングを適用したい 他の人と同じイージングを使うのが嫌だ 簡単な動きであれば標準のイージングでことが足りるのですが、F

  • ASDoc入りのSWCファイル「Fat SWC」の作り方 | ClockMaker Blog

    FlashではSWC(スウィク)ファイルを利用することで、ActionScriptのパブリッシュ/ビルドが早くなることを先日のSpark 勉強会で発表しました(「Spark project 勉強会 SP3」の発表ビデオ)。主にAS3ライブラリ開発者向けの情報になるのですが、そのSWCファイルにASDocコメントを含める方法を紹介します。 ASDoc入りのSWCファイル「Fat SWC」とは 通常のSWCファイルにはASDocコメントが含まれません。つまりコードヒントのコメントを利用できないというデメリットがありました。AS3登場後、様々なAS3ライブラリがSWCファイルで提供されていますが、そのほとんどがコメントなしのSWCです。 Fat SWCとは、SWCファイルにASDocコメントを含めた形式です。そのため対応したソフト(FlashDevelop 3.2.1やFlash Builder

    mac10
    mac10 2010/06/24
  • パーティクル表現のためのAS3ライブラリ「Stardust」 | ClockMaker Blog

    ざっくばらんにいろんなライブラリを紹介するシリーズ第三段目。Stardust (スターダスト)という海外のパーティクルライブラリの紹介。2Dにも3Dにもどちらにも利用できる表現の自由度が高いライブラリです。とりあえず、Papervision3Dと組み合わせてデモを作ってみました。蝶が飛んだ軌跡に発生している粒子部分がStardustの効果になります。 demo (Flash Player 9) ライブラリStardust とは 2Dと3Dをサポートするパーティクルエンジンで、ソースコードはMITライセンスとしてGoogle Codeにて公開されています。さまざまな効果やプロパティーを組み合わせて使うことができ、自由度の高いカスタマイズが可能です。 stardust-particle-engine ライブラリの特徴は次のような感じ。 簡単にカスタマイズができる 重力や反発といった物理演算の適

    パーティクル表現のためのAS3ライブラリ「Stardust」 | ClockMaker Blog
  • ActionScriptでJSONを扱う方法 | ClockMaker Blog

    先日、昔の後輩からJSON(ジェイソン)について教えて欲しいとリクエストをもらったので、JSON のメリットと使い方(AS3)をまとめてみます。 JSONとは何か? XMLのようにデータを文字列で格納するファイル形式。Flashの外部データには一般的にはXMLが使用されることが多いですが、JSONはECMA標準のObject/Array形式で保存するため、解析の手間が少なく扱いやすいという利点があります。 JSONのメリット EMCA標準のObject/Array形式で保存するため、解析後のデータが扱いやすい ファイル容量が少なくてすむ JSONのデメリット 人が読んで分かりにくい(手更新するならXMLのほうがいいかも) 書式が正しいかのチェックが面倒(XMLならブラウザに放り込めば、バリッドかどうか簡単にチェックできます) ActionScriptでの使い方 ライブラリ「as3corel

    mac10
    mac10 2009/11/08
  • PV3Dで飛行船:SpringCamera3Dを試してみる | ClockMaker Blog

    Papervision3D の新機能「SpringCamera3D」で飛行船らしきものを作ってみました。これは公式ブログによると物理演算を適用したカメラ機能で、3Dゲームのように滑らかに追随するカメラアングルが使えます。使い方も難しくないので、Papervision3DでFlashゲームを作ろうという方にはオススメな機能です。 (デモはステージを一回クリックすると、キーボードの上下左右で動かせます) demo (要Flash Player 10 / 720×480サイズ) lite demo (上のデモが重い場合は 320×240サイズのこちらを試してみてください) src (zip, Flex SDK) ゲーム風なマップは「void element blog」さんの「ドキッ!変態だらけのActionScript的超絶技巧発表会」のフィールドマップジェネレータから作成させて頂きました。 S

    PV3Dで飛行船:SpringCamera3Dを試してみる | ClockMaker Blog
  • Flashでやってしまいがちな16個の間違った使い方 | ClockMaker Blog

    Photoshopでやってしまいがちな12個の間違った使い方 – GIGAZINEが面白かったので、Flash版として「Flashでやってしまいがちな16個の間違った使い方」としてまとめてみました。 1.シンボル化しないままトゥイーンを作成している まずは誰でも一度はやったことがあるであろう、シンボル化しないままのトゥイーン作成。ライブラリに「トゥイーン○」という名もなきシンボルが作成され、後で見返したときや他の共同作業者が非常に困ることになります。 2.テキストフィールドに直接リンクURLを設定している getURLやnavigateToURLなんてスクリプトを知らない初心者のころはテキストフィールドにURLをいれてテキストリンクを作っていました。これは演出が作れないので、慣れてくると使うことはないでしょう。 3.文字をボタンに含めたときに後ろにシェイプを敷いていない ボタンを作ったとき

    Flashでやってしまいがちな16個の間違った使い方 | ClockMaker Blog
    mac10
    mac10 2009/01/16
     FlashCS系でのバッドノウハウ、Flex版ないかな
  • Alternativa3Dを試してみる Part.01 : まずはHello Worldから | ClockMaker Blog

    Papervision3D 2.0(Greate White)の記事はほどほどに充実してきたので、このあたりで趣向をかえて別の3Dライブラリ「Alternativa3D」に手を伸ばしてみようと思います。Alternativa3DはFlash Player 10(Astro)のネイティブ3D処理にいち早く対応しており、「現時点ではAlternativa3Dが最強のAS用3Dエンジン」という評価もある気になるライブラリでした。 まずはライブラリを導入して作ったデモを紹介します。 demo (requre Flash Player 10) src (require Alternativa3D) 導入方法 公式ページでアカウントを取得しログインするとzip化されたライブラリをダウンロードすることができます。Flash Player 9と10用のswcが用意されていますが、10を使う場合はバージョン

    Alternativa3Dを試してみる Part.01 : まずはHello Worldから | ClockMaker Blog
    mac10
    mac10 2008/10/26
  • PaperVision3D 2.0で被写界深度が実現できたよ | ClockMaker Blog

    Papervision3D 2.0(GreateWhite)を試していたら、いつの間にか求めていたプロパティが実装されているではありませんか。filtersとsceneZという、なんとも被写界深度が実装できそうなプロパティ。というわけで被写界深度を早速試してみました。今まで苦労したのが嘘のように簡単にできました♪ Demo(require Flash Player 9) 仕様については以下にまとめております。 ポイントはuseOwnContainer DisplayObject3Dに実装されている「useOwnContainer」というプロパティがありますが、これをtrueにすることでfilterやalphaの使用が可能となります。 var o:Plane = new Plane(new ColorMaterial(), 100, 100, 1, 1); o.useOwnContainer

    PaperVision3D 2.0で被写界深度が実現できたよ | ClockMaker Blog
  • Papervision3D 2.0(GreateWhite)で反射を比較する | ClockMaker Blog

    前回の記事に続いてPV3D 2.0の勉強2回目。今日は様々な反射(シェーディング)を比較して試してみます(比較キャプチャを載せてます)。 サンプルは10×10の二次元配列を3Dグラフ状に表示したものです。 デモ(要FlashPlayer 9) ライト機能は「GouraudMaterial」を使いました。この「GouraudMaterial」はグーローシェーディングの照明機能です。他にも 「FlatShadeMaterial」「CellMaterial」「PhongMaterial」などラシェーディングの種類が選べます。ものによってレンダリング結果と処理負荷が変わってくるので、どれを選ぶかは要検討といったところでしょうか。 shadematerialsの比較 以下はorg.papervision3d.materials.shadematerialsパッケージにある複数のマテリアルに切り替えて

    Papervision3D 2.0(GreateWhite)で反射を比較する | ClockMaker Blog
  • 1