知らないと損をするよ！ 携帯Flash軽量化メモ 〜デザイン編〜 | _level0 - KAYAC Front Engineer Blog
ごきげんよう、kijima(@otoyasumi)です。 またまた今回もFlashLite1.1での携帯Flash開発tipsです。 巷ではiPhoneアプリだのAndroidだのってときに こんなレガシーなテクニック紹介で心底申し訳ない。腹を切る振りをしてお詫び申し上げます。 AS2&3との違いや、FlashLite独自のひっかかるポイントなどの紹介に比べて、 画像の最適化tipsなどは案外取り上げられないようなので、 今回は「知らないと損をするよ！ 携帯Flash軽量化メモ 〜デザイン編〜」と銘打ってお送りします。 PNG8 & JPEG 画像の書き出し時に注意すること 携帯htmlの世界ではどうやらdocomoの一部機種にて PNG形式の画像が表示できないようですが、 Flash内に取り込んでしまえばそれも関係ありません。 ・透過させたい&ドット絵などをパキっと見せたい画像のときはP
wonderflがなんとかしてくれるよ！Q&A機能を使ってみよう | _level0 - KAYAC Front Engineer Blog
Flash,Actionscriptを使ってこういうことを実現したいんだけれど、実現方法がわからない場合がありますよね。 そんな時には、まるっと全部教えてもらうのではなく、自分のできるところまでコードを書いてみて、できないところを誰かに補足してもらうと、身につきやすいです。 wonderflを使うことで、それが可能です。（wonderflより引用） wonderflではActionScriptに関する質問をコードで投げかけることができます。やり方も簡単なのでぜひ一度お試しください。時にはギークなASerの変態コード回答をもらえるかも・・・！？ さて実際に質問を投げる方法ですが、タグに「question」をつけるだけです。簡単でしょう？ 回答はforkによって返ってきます。疑問が解決したらタグを「question-closed」に変更して、回答を締切りましょう。
知らないと損をするよ！ 携帯Flash軽量化メモ 〜条件分岐編〜 | _level0 - KAYAC Front Engineer Blog
こんにちは、お久しぶりのkijima(@otoyasumi)です。 最近はFlashLite1.1ばっかりやっているので、携帯Flash開発に便利なtipsをまとめてみました。 同時に複数の"&&"AND演算子を使わない 例えば、if( A && B && C & D & E & F & G)という条件を指定するときは、 代わりに以下のように記述しましょう。 if ( A + B + C +D + E + F + G === 7 ) FlashLiteでは"true"は1、"false"は0でもあるので、これを利用します。 A〜Gまですべて"true"なら、すべて加算すれば7になるので、 上のような記述で"&&"を使わずに実装できます。 なぜこんな面倒なことをするかというと、"&&"を使うと、やたらと容量を食うから。 実際に比較すると、上の条件の場合はこんなに差が出ます。 if( A &&
ProgressionによるFlashコンテンツ開発ガイドブックのすすめ | _level0 - KAYAC Front Engineer Blog
ProgressionによるFlashコンテンツ開発ガイドブック を献本いただきました。ありがとうございます。もともと購入しようと思っていましたが、期待していた以上に充実した内容に驚きました。 Progressionは想定してるユーザー像が幅広く、実際さまざまなタイプの用途やスキルの人が興味を持っていたり使っていると思いますので、本書の見どころを各シチュエーションごとにまとめて紹介したいと思います。参考になれば幸いです。 全体の構成 インストールと重要パネルの説明(Progressionのインストール重要パネルの説明 ほか) スタイル別に簡単なプロジェクトを作る(Progressionの開発スタイルと開発の流れコンポーネントスタイルでの開発 ほか) Progressionをもう1歩詳しく知ろう(Progressionの全体像を把握するProgressionの環境設定 ほか) 応用テクニック
iPhoneでswfアニメーションを再生する魔法のJS | _level0 - KAYAC Front Engineer Blog
PC用に作ったFlashアニメーションをiPhoneでも使いたいという話があり、 Flashアニメを連番画像で書き出してアニメGIFにする以外に 何かいい手はないかと調べていたところ、Gordon.jsというものを教えてもらいました。 http://github.com/tobeytailor/gordon JavaScriptでswfを解析し、ベクターグラフィックをSVG形式で描画するため iPhoneのSafariを含めたSVGが利用できるブラウザであれば FlashPlayerを使わずswfアニメーションを表示できるようです。 こんな感じ 実際にいろいろ実験してみて気付いたところとしては、 ・対応しているのは「FlashPlayer1」向けに書き出されたswfのみ ・画像は表示されない、ベクターのみ（グラデーション可） ・ローカルでは動作しない（環境によるのかも） FlashPlay
携帯ソーシャルアプリ向けFlash開発から見えてくる、面白いゲームの作り方（1） | _level0 - KAYAC Front Engineer Blog
ご無沙汰しております。鎌倉本社勤務になり実家からの自転車通勤が可能になりましたkijimaです。 最近はもっぱら携帯ソーシャルアプリのゲームの企画・Flash開発をしているので、その辺の話をしようかと思います。 書いているうちに、なぜだか後半マンガの話になってしまいました（笑） 携帯ソーシャルアプリ内でのFlashの扱われ方 最近、mixiアプリやモバゲー、facebookなどのSNS上で遊べる"ソーシャルアプリケーション"が盛り上がっています。 代表的な例といえば「サンシャイン牧場」や、テレビCMでも見かける「怪盗ロワイヤル」などでしょうか。いずれもSNSの機能を活かして他のユーザーや友達と一緒に遊ぶことができます。これがソーシャルアプリの特徴ですね。 オープンプラットフォーム化する前のモバゲーのミニゲームや、ダウンロードして遊ぶFlashゲームを僕は勝手に"単体完結型の携帯Flashゲ
PixelBenderでZoomBlur | エントリー | _level0.KAYAC
pixelBenderでズームブラー／スピンブラーフィルター作ってみました。 すでにいろんな人がやってるようですが、 PixelBenderの勉強も兼ねてやってみました。 通常のブラーと同様、複数の画素から色をサンプリングして サンプリング数で割る形で、各画素の色を決定していきます。 サンプリングする幅でブラーの強度、点の数でブラーの品質を決め、 サンプリングする幅はブラーの中心点からの距離に比例して増やしていきました。 ズームブラー スピンブラー ブラーの品質についてですが、サンプリング数を１２８個くらいまで増やすと とても綺麗にブラーがかかってくれていたのですが、 いざFlash上でフィルターとして使ってみると、実用に耐え難い実行速度に。 １０個くらいまで減らすことでなんとか実用に耐えうる速度が出ました。 ZoomBlur.pbj ソースは以下のような感じ。多分もっと最適化出来る気がし
Flex オブジェクト作成プロセスを最適化しよう | エントリー | _level0.KAYAC
海賊王をめざす男 マツです。こんにちは。 鎌倉は桜が見ごろとなっています。私も新入社員のように「常に初陣」の気持ちでがんばります。 基本は大切ということで、オブジェクト作成プロセスを最適化してパフォーマンスを改善する方法です。 最適化のコツ ・生成順序を変更する。 ・オブジェクトのインスタンス化を遅らせる。 順序付き生成 通常、初期ビューが表示されるのは、コンテナとその子オブジェクトがすべて生成されてから表示されます。 そのためすべてのコンテナとその子オブジェクトが生成されるまでは、ユーザーはアプリケーションを操作することができません。 そこで、順序付き生成を方法をやります。これは 1 つのコンテナのコンポーネントを表示してから次のコンテナのコンポーネントの生成に移ることで、起動時のユーザーのストレスを軽減することが予測できます。 最初のコンテナに含まれるすべての子をインスタンス化して表示
MacでFlashやるならコレ! 魅惑の開発環境FDTでつくろう！ | _level0 - KAYAC Front Engineer Blog
メディア芸術祭行かれましたか？ 会場は狭くなっちゃったけど今年も面白い作品目白押しで大満足のMuraiです。 さて、みなさんFDTご存じですか？ 僕も年末にセットアップした初心者ユーザーのひとりですが、色々と手に馴染んできた所で、ざっとまとめを書いてみたいと思います。 ちなみにタイトルはMacガン押しですが、もちろんWindowsでも使えます！ FDTって？ http://www.solutions.powerflasher.com/jp/ FDTはPowerFlasherという会社が作っているActionScript用改造Eclipseです。 AS3/AS2 MXMLを爆速でコーディングすることができます。 QuickFix(自動変数定義、自動import、自動クラス生成、自動プロパティ定義、自動メソッド定義 etc) 至れり尽くせりのコードフォーマットセッティング 賢いコード補完（文章
今年注目した３つのwonderfl hara編 | _level0 - KAYAC Front Engineer Blog
今年１年、wonderflを見ない日はなかったと言ってもいいほどwonderflを見ていたし、 実際毎日見に行って余りあるくらいに色々面白い作品が投稿されていました。 そこで今回は、ここ１年でwonderflを見ていて、個人的に「これはすごい」と感嘆した作品、 ベスト３をご紹介します。 1.Sewing creator:Saqoosha http://wonderfl.net/code/a8ca5c13cc58d57b94c5af543438d376d2ce4e54 投げ出されたひもが、文字の形に定着します。 ぱっと見、どうやっているのかさっぱりわかりません。 ソースを見てみると、1000行を超えるソースコードの大半はSVGを扱うライブラリであることがわかります。 なので注意して見るべきは90行目あたりまで。 PathToArrayというライブラリの名前を変えて使ってるみたいですね。 ここ
Wonderflの書籍が12/18に発売されます。 | エントリー | _level0.KAYAC
「ブラウザで無料ではじめるActionScript 3.0 ―It's a wonderfl world―」というWonderflをつかったASの教科書をつくりました。 2009年12月18日に ワークスコーポレーションさんより発売されます。 本書はカヤックのFlashチームとフォークビッツ名義で多数のFlashデベロッパーの方に共著で執筆していただいてます。表紙は「勝手に広告」で有名な中村至男さん(http://nakamuranorio.com/)です。 カヤックFlashチーム(http://level0.kayac.com/) clockmaker池田さん(http://clockmaker.jp/) ローハイド. 小林さん(http://un-q.net/) 野中文雄さん(http://fumiononaka.com/) 大重美幸さん(http://oshige.com/blog
Flex SDK 3.5 でました | _level0 - KAYAC Front Engineer Blog
海賊王をめざす男 マツです。こんにちは。 今週末は、劇場版ワンピース第10弾！ ONE PIECE FILM Strong World を観てこようとおもいます。 ワンピース 0 巻まだあるかなー。 Flex SDK 3.5.0.12683 がでました。 Download Flex 3 - Flex SDK - Adobe Open Source http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+3 flex_sdk_3.5.0.12683.zip をダウンロードしてインストール。 Flex 3.4 SDK のときにあった SystemManager のバグが Fix されてました。 そのバグとは、preloader のローディング中に表示エリアをクリックすると、SystemManager で以下のエラーがでるもの
as3での印刷についてまとめてみた | _level0 - KAYAC Front Engineer Blog
先日、案件でFlashからの印刷を扱うことがあったので、そのとき調べたいろいろをまとめてみました。 基本 as3での印刷にはPrintJobクラスを使用します。 簡単3stepです。 1.printJob.start() → プリントダイアログの表示 2.printJob.addPage(sprite) → 印刷対象の設定 × ページ分 3.printJob.send() → データをプリンタに送信 実際に使うときは var printJob:PrintJob = new PrintJob(); if(printJob.start()) //←印刷ダイアログでOKが押されるとtrue { try { printJob.addPage(pageSprite1); } catch(e:Error){} //←エラーの場合は何もしない printJob.send(); } という感じです。 印刷
wonderflで立体投影にチャレンジしてみた。 | _level0 - KAYAC Front Engineer Blog
こんにちは、kijimaです。最近は映画にカメラ・テレビと、やたら3D表現がキテますね。 ところでみなさん、"アナグリフ方式"と呼ばれる立体写真をご存じですか？ アナグリフ、と聞いてピンと来ない方も、下のような赤や青色がかった写真をご覧になったことがあると思います。 これはギターのヘッドを撮影した写真二枚を合成したもの。 ちなみに、用意する写真二枚はまったく同じ写真二枚ではうまくいきません。 人間の目で見た景色を擬似的に再現するために、左目と右目のあいだ分20cmくらい横にずらした位置で撮影した写真二枚が必要です。 これは人間がモノを見るとき、左右の目の位置の差によって遠近差を認識しているためで、片目だけでは距離感がつかめないことからもわかるかと思います。 上の写真を、赤と青のセロファンが貼られた通称"3Dメガネ"を通して見てみると、あら不思議、ギターのヘッドが立体的に飛び出して見えちゃい
受託案件で制作チーム全員が心得ておきたい4つのポイント。 | _level0 - KAYAC Front Engineer Blog
こんにちは、kijimaです。先日深夜のスタジオでのドラム練習風景をUstreamで意味もなく生中継してみました。ええ、懲りずにまたやりますよ。 今回は、（特に大手クライアントの）受託案件で気をつけるべきポイントについてまとめてみました。 まんまと釣られた方、「そんなの当たり前じゃん」という方は、周りの新人さん（特に新人ディレクターとか）にも教えてあげてください。今回はFlashに限らず、制作現場みんなで気をつけていきたいポイントです。 制作規定・レギュレーションの有無について確認する今回紹介するポイントの中では、間違いなくこれが一番重要です。 ネット業界に限らず、誰もが知っている大手クライアントともなると、様々な部分にレギュレーションやルールが存在します。会社のロゴマーク表記に関するレギュレーションは特に細かく、たとえば「緑色のロゴマークに対して使っていい背景色は何色のみ」とか、「バナー
11月1日にアップした記事について | _level0 - KAYAC Front Engineer Blog
_level0.KAYAC をご覧いただきましてありがとうございます。 面白法人カヤックの_level0.KAYAC担当です。 読者の皆さまに、ご報告とお詫びがございます。 11月1日にアップした記事に不適切な部分があり、 読者の方からご指摘をいただきました。 「不適切な記事」とは、エミュレータを使って 市販ゲームの画面をキャプチャし、記事上で公開してしまったことです。 執筆者は、過去のすぐれたゲーム作品を、 見たことのない方にもぜひ紹介したい！との思いばかりが先行し、 軽率にもエミュレータをインストールして画面をキャプチャし、 記事に掲載した思いもあったようですが、ご指摘はおっしゃるとおりでしたので、すぐに削除させて頂きました。 心よりお詫び申し上げます。 また、執筆者がすぐに記事を削除したため、_level0運営事務局として 報告が遅くなったこと、重ねてお詫び申し上げます。 今後、この
PNG32 + Flash の罠 | _level0 - KAYAC Front Engineer Blog
先日案件で、色の選択にカラーピッカーのインターフェイスを実装することがあり、 Webセーフカラーの一覧画像からgetPixelで色の情報を取り出すようなものを作ったのですが なぜか、セーフカラーではなく「#980032」とか微妙に違う値が取れる。 カラーマップとして使ってる元画像の色情報がそもそも違うのかなと思って見てみたけど問題なし。 実装でやらかしてるのかなーと思って調べたけどコチラも問題なし。 FLASHでパブリッシュして実行中の画面をキャプチャしてマップの色を調べると色が違う！ もちろん、画像のプロパティは「劣化なし」。「劣化なし」のはずなのに劣化してる！ 原因は結局よくわかりませんでしたが、FLASHはパブリッシュ時にPNG32（PNG２４）を 最適化して容量下げてくれる機能があるので、その圧縮過程で色情報が変わっちゃった気がします。 （もしかしてFlashCS4だけかも。） 2
爆速のためのFireworks"自動シェイプ機能" | _level0 - KAYAC Front Engineer Blog
デザイナーを挟まずに自分で素材を制作する場合、 illustrator,photoshopを使わずFlashだけで作る事が多いと 前に紹介した事がありますが、 Fireworksもイラスト書く時に使ったりします。 ※弊社のサービス、ものづくり応援サイトdododayのアバター illustrator,photoshopと比べると癖があるので、 イラストを書くには慣れが必要かもしれませんが、 絵を描けない人でも自動シェイプ は知っておいて損はないと思います。 ウィンドウ＞自動シェイプ でパネルが立ち上がります。 パネルからステージへドラッグ＆ドロップで それぞれのシェイプが自動で生成されます。 一見しょぼいイラストが生成されるので 何だこの機能と思いがちですが、 生成されたものを元に素材を作ると 1から自分で作るよりも圧倒的に爆速です！ ↑この時計もfireworksの"スタイル"を貼付けて
Matrix講座 | _level0 - KAYAC Front Engineer Blog
こんにちはtaroです. こんなことで、お困りになったこと Spriteに上手く座標や回転を設定しているのにBitmapDataにdrawしたときに、上手く行かない・・・ BitmapDataに渡すMatrixの設定が良く分からない・・・ 行列式は苦手・・・ ありませんか？ 今回はこちらのテーマで進めようと思います。 BitmapDataのdrawメソッドを用いて、BitmapDataにSpriteやBitmapなどのDisplayObjectを描画したとき、元になるDisplayObjectの位置や回転、拡大率というのは反映されません.なので、下の図のように、左上隅を基点として等倍、回転なしの状態で描画されてしまいます. 回転などをつけてみたい これはどうしたものか、とリファレンスを当たってみると、第2引数にMatrixというのを渡せばよいということが分かります.では、こういうのは、どう
Wonderflに画像をアップ・ロードして利用してみる | _level0 - KAYAC Front Engineer Blog
こんにちは、taroです. 皆さん、wonderflというサービスは既にご存知でしょうか？ こちらは、Flash等が無くともフリーでウェブ上でActionScriptを使って、フラッシュをリアルタイムに編集できる便利なサービスです.他の人の優れた投稿を見ることが出来、また、そのソースコードを見たり改造することでActionScriptの技術を身につける手助けとなります. 今回はそのwonderflに画像をアップ・ロードする方法をご紹介します. wonderflに画像をアップ・ロードしてみる 少し隠しコマンド的なのでご紹介. wonderflの編集画面に移動します.(9reという名前でやっています.) urlの末尾がeditとなっていることに注意してください.ここでタイトル(この図だとflash on 2009-10-26)をクリックします. これでタイトルが編集できる状態になるのですが、そ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
