タグ

ブックマーク / level0.kayac.com (32)

  • _level0 | Kayac Interactive Designer's Blog

    KAYAC Front End Engineer チームによるHTML5 iOS Android ActionScript Flash イベント デザイン ニュースのブログ

    _level0 | Kayac Interactive Designer's Blog
  • #prayforjapan | _level0 - KAYAC Front Engineer Blog

    3月11日に発生しました東北地方太平洋沖地震の影響を受けた皆様に心よりお見舞い申し上げます。 また復旧にあたっての努力を続けてくださってる関係者の皆様に感謝いたします。 一日も早い復興をお祈り申し上げます。 Twitter、Instagramなどでは#prayforjapanで世界中からの応援メッセージが溢れています。 国内でも応援ソングやデザイン、絵や映像など色々な方法で日を応援しています。 僕も何かみんなが元気になることを と思いwonderflにもprayforjapanをつくってみました。 #PrayForJapan - wonderfl build flash online ソースにInstagramAPIの簡単なサンプルと、セキュリティサンドボックス越えのproxyAPIがあります。 ご自由にお使いください。 今回、菅野ようこさんの応援ソングをyoutube経由でBGMとして

    #prayforjapan | _level0 - KAYAC Front Engineer Blog
  • Corona で スマートフォン アプリ開発をしよう。開発編 | _level0 - KAYAC Front Engineer Blog

    海賊王をめざす男 マツです。こんにちは。 Corona で、タップするとその位置に画像が追加され、地面に落下するアプリをつくってみます。 local screenW, screenH = display.contentWidth, display.contentHeight local physics = require("physics") physics.start() display.setStatusBar( display.HiddenStatusBar ) local ground = display.newImage( "ground.png" ) ground.x = 160; ground.y = 445 physics.addBody( ground, "static", { friction=0.5, bounce=0.3 } ) local scaleFactor

    Corona で スマートフォン アプリ開発をしよう。開発編 | _level0 - KAYAC Front Engineer Blog
  • oFで2照射立体プロジェクションに挑戦してみた(光の女神技術解説) | _level0 - KAYAC Front Engineer Blog

    さて、前エントリで光の女神プロジェクションについて紹介させていただきましたが、 今回はそれをどうやって作ったかについて解説いたします。 普段ではやらないようなDIYな作業が多かったので、文化祭のようでなかなか楽しかったです。 さて、まず今回のソースは一式githubに上げちゃいました。 https://github.com/haramakoto/MuseofJiyugaoka 興味ある方は見てみるとよいかと思います。 アプローチ 今回は「服状のものに投影したら色々いい演出ができるんじゃないか」という考えから出発しています。 服状のものに投影するということは、 ・服が必要 ・できるだけリアリティを出すためには複数台の投影、マッピングプロジェクション的な調整が必要 ということになります。 概要 図のような感じで、2カ所から映像を投影して中央の服に表情をつけます。 服 投影用の服ですが、今回は「

    oFで2照射立体プロジェクションに挑戦してみた(光の女神技術解説) | _level0 - KAYAC Front Engineer Blog
  • openFrameworksでプチ・プロジェクションマッピング | _level0 - KAYAC Front Engineer Blog

    こんにちは、haraです。 今回はopenFrameworksとプロジェクションマッピングという、およそFlasherにはなじみがあるのかないのかわからないテーマについて紹介します。 プロジェクションマッピングって? プロジェクションマッピングとは、ビルとか車のような、実在する物体があたかも「変性」したり「拡張」しているように見えるように、映像をプロジェクションして見せるコンテンツのジャンルの名前です。(大意) 海外ではよくやられているようで、ちょっと紹介させていただくと こういうのとか こういうのとか あるいはこういうのとか。すごいですね。 P.O.P. | 3D video mapping | experimental study from urbanscreen on Vimeo. インターンのいぶくろくんのブログに詳しく解説があるので、ひとまずこちらをご確認を。 http://d.

    openFrameworksでプチ・プロジェクションマッピング | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2010/10/05
    絵の中を拡張するような感じとかだと面白いなぁ
  • 今すぐ出来るPackager for iPhone | _level0 - KAYAC Front Engineer Blog

    AdobeのPackager for iPhone®の開発が再開されましたね。 こんにちは、堀口です! Packager for iPhone®の開発が再開されましたね! テンションあがっちゃったので早速実機にアプリを転送してテストする所までまとめました。 前提として、AppleiPhoneデベロッパー登録は済んでいるという事にします。 それでは早速やりましょう! と、そのまえに CorLeonis.net - Packager for iPhone®でつくられたiPhoneアプリ こちら、Flash CS5発売前のプライベートベータプログラムに参加された方々が Packager for iPhoneで制作したアプリが丁寧にまとめられています。 どのようなアプリが作れるのか、とてもとても参考になりますので、目を通す事をお勧めします。 まずは、事前準備 さて、Packager for iP

    今すぐ出来るPackager for iPhone | _level0 - KAYAC Front Engineer Blog
  • PixelBenderで輪郭抽出 | _level0 - KAYAC Front Engineer Blog

    Flashで輪郭抽出を行う方法はいくつかあるかと思いますが、 畳込みフィルターよりも、(ビジュアル的に)綺麗な輪郭抽出にチャレンジしてみました。 今回はPixelBenderで輪郭抽出アルゴリズムのひとつの、Sobelオペレータを実行しています。 Sobelオペレータについては、Web上にたくさんドキュンメントがあるかと思うので 僕のつたない説明より、そちらを参考にしていただいた方が良いかと思いますが 前後のピクセルの差分をもとにゴニョゴニョする感じです。 サンプル pbjファイルはこちら pbkソースはこんな感じ < languageVersion: 1.0; > kernel EdgeDetection < namespace : ""; vendor : "Shimada Kousho"; version : 1; description : "detect edge"; > { i

    PixelBenderで輪郭抽出 | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2010/09/13
  • マッチムーブなmARio cARt | _level0 - KAYAC Front Engineer Blog

    僕はマリオカートが大好きな子で、友達の家で集まってはマリオカートをしているそんな小学生でした。 今回はそんなマリオカート好きにはたまらない映像をご紹介。 マッチムーブという映像技法をご存知でしょうか。 名前のとおり、カメラの動きにあわせて別の動画を合成する合成映像の手法です。 くわしくはこちら。 http://ja.wikipedia.org/wiki/マッチムーブ このマリオカートは、撮影された映像から特徴点を抽出して3次元空間を作り、マッチムーブを適用するBoujouというソフトを利用して作られた映像だそうで、マリオカートのスプライトをMayaでアニメーションさせ、Nukeで仕上げる格仕様。 たった10秒程度ですが、自然なのに不自然な素敵な仕上がりです。 車載カメラで撮影した映像に適用しているのもいいアイディアだなーと思っていて、マリオカート(SFC版なのがぐっときます!)の思い出と

    マッチムーブなmARio cARt | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2010/09/06
  • FlashでVJ.そんな楽しみ方も良くないですか? | _level0 - KAYAC Front Engineer Blog

    皆さんこんにちは。iPad買いましたか? 新しい機械が出るととりあえず買ってしまうガジェット大好きMuraiです。 haraのこのエントリで紹介している光がゆらぐ表現。マウスの動作にあわせて綺麗な光が揺らぐ綺麗なエフェクトに魅入られてForkしてSoundVisualiserを作ってみました。 当はお気に入りの曲があって、YouTubeのChromelessPlayerからサウンドを拾おうとしたんですが、Youtubeのcrossdomainって許可されてないんですね。。。 どうりでやる人が見当たらないと思いました。 ちなみにこれです。大好き。 今のコードは読み込んでいるwiredのmp3に最適化したパラメータで組んでしまっています。 なので、この曲でやる時はdiffやコメントアウトのコードを見て、お好みの数値に書き換えて是非試してみてもらえると嬉しいです。ローカルにソースを落としたsw

    FlashでVJ.そんな楽しみ方も良くないですか? | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2010/06/01
  • Flex コンポーネントの破棄 注意点 | _level0 - KAYAC Front Engineer Blog

    海賊王をめざす男 マツです。こんにちは。 使用されなくなったオブジェクトを破棄することによってメモリを解放するガベージコレクション。 使用していないオブジェクトがガベージコレクタによって必ず破棄されるには、子に対する親の参照など、使用していないオブジェクトに対するすべての参照を削除する必要があります。 親コンテナからコンポーネントを削除するには、removeChild() メソッドまたは removeChildAt() メソッドを使用します。 コンテナからすべての子コントロールを削除する場合は、removeAllChildren() メソッドも使用できます。 他のオブジェクトにその子への参照が保存されている場合、その子はメモリから削除されないので、 オブジェクトがガベージコレクションの対象となるようにするには、removeEventListener() メソッドを使用して、これらのオブジェ

    Flex コンポーネントの破棄 注意点 | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2010/05/13
    知らなかった
  • ImageSnapshot でキャプチャしよう | _level0 - KAYAC Front Engineer Blog

    海賊王をめざす男 マツです。こんにちは。 DisplayObject をキャプチャすることって結構あるのですが、Flex には便利な ImageSnapshot があるのでそれを使用します。 ImageSnapshot.captureBitmapData(source:IBitmapDrawable, matrix:Matrix = null, colorTransform:ColorTransform = null, blendMode:String = null, clipRect:Rectangle = null, smoothing:Boolean = false):BitmapData BitmapData として UI コンポーネントの生のスナップショットを取得するユーティリティメソッド。 ImageSnapshot.captureImage(source:IBitmapDra

    ImageSnapshot でキャプチャしよう | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2010/01/13
    こんなのもあるのか
  • TextField設定レシピ (1) - XMLを使った書式の設定 | _level0 - KAYAC Front Engineer Blog

    こんにちはtaroです. 明けましておめでとうございます. 今回はXMLを利用して、TextFieldに複雑な書式を設定する方法について考えていきます. TextFieldに複雑な書式を設定するには2通りの方法があります. TextFormatとTextField.setTextFormat()の組み合わせ. htmlTextを用いる. 今回はhtmlTextを使用して, 色々な書式を設定していきます. しかし, htmlTextというと少し面倒です. tf.htmlText = '<font face="_ゴシック" color="#C83E43"><u><a href="event:' + event_name + '">' + str + '</a></u></font>'; このように, + や ' が大量にある式を書くこととなるからです. XMLを利用する そこで, htmlTe

    TextField設定レシピ (1) - XMLを使った書式の設定 | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2010/01/07
  • 「未定義である可能性のあるメソッド」警告をとりあえずスルーする方法 | _level0 - KAYAC Front Engineer Blog

    こんにちは。スロースターター安藤です。 年明け最初のエントリーなので肩の力を抜いて小ネタでございます。 var s:Sprite = new Sprite(); s.hoge(); //エラー:未定義である可能性のあるメソッド hoge を.....Spriteにはhogeなんてメソッドは無いのでコンパイルエラーで通らないのですが、↓のような場合はどうでしょう。 var s:Sprite = new HogeClass(); //HogeClassはSpriteを継承したクラスで、hoge();メソッドが定義されている。 s.hoge(); //しかし同様にエラー。Spriteとしてオブジェクト化されたHogeClassオブジェクト。しかしhogeメソッドは未定義とされ呼べません。 コードの都合でどうしてもSpriteとして宣言する必要がある、でもhogeメソッドを一行だけでいいから呼ばせ

    「未定義である可能性のあるメソッド」警告をとりあえずスルーする方法 | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2010/01/07
    HogeClass(s).hoge(); でいいんじゃないんですか?
  • SynthProbe 発売記念!Delay の簡単な作り方 | _level0 - KAYAC Front Engineer Blog

    _level0 でご無沙汰しています。 この度 SynthProbe (iTunes はコチラ) という iPhone音楽アプリを作りました! (通称、セオシレーターと言われていた GravSynth を大幅にパワーアップ&もっと楽しく使いやすくしたものです。音楽好きの方は是非!) が、、、ちゃんと Flash もつくっている seo です。。 さて、SynthProbe で Delay (音がやまびこのように聴こえるエフェクト) を実装したのですが、それを AS3 にしてみたので作り方をご紹介します。 という前に Delay の仕組みをまず説明。 どうやってエコーを実現しているかというと、輪になって永久に回るカセットテープをまずイメージしていただくと良いかもしれません。(↓実物はこんな感じ) そのテープに録音をするヘッドと再生するヘッドがありまして、まず入力信号 (マイクとでもしてお

    SynthProbe 発売記念!Delay の簡単な作り方 | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2009/12/24
  • Kap Inspect でリアルタイムデバッグ | _level0 - KAYAC Front Engineer Blog

    海賊王をめざす男 マツです。こんにちは。 久々にすごいツールに出会いました。その名も Kap Inspect。 Flex でアプリケーションの構造を視覚化、イベントプロセスをモニターして分析することができます。 またデザインとスタイルもチェックできて、プロパティの変更などオブジェクトの操作が可能です。 ダウンロード Kap Inspect http://lab.kapit.fr/display/kapinspect/Kap+Inspect KapInspect.1.5.0.zip (2009/11/18 現在) 使い方 KapInspect.swc を Flex ビルドパス(ライブラリパス)libs に通します。 import fr.kapit.KapInspect; var myKapInspect:KapInspect = new KapInspect(); KapInspect 起動

    Kap Inspect でリアルタイムデバッグ | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2009/11/19
  • 不要なメンバー変数・メンバー関数を減らすコツ | _level0 - KAYAC Front Engineer Blog

    どうもtaroです. ちょっとした小ネタなのですが、変数のスコープを上手く利用して、不必要なメンバー変数やメンバー関数、クラスを減らす方法というのをご紹介いたします。 LoaderやURLLoaderを使う時、非常に良く出くわす問題として、一回しか使わないような変数をprivateなメンバー変数としてしまうことがありますが、僕は前から何だかこの書き方に少し疑問を持っていました。 private var _ldr:URLLoader; private var _data:Object; public function load():void { _ldr = new URLLoader(); _ldr.addEventListener(Event.COMPLETE, onLoaded); _ldr.load(new URLRequest(API_URL)); } private functi

    不要なメンバー変数・メンバー関数を減らすコツ | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2009/11/17
  • 画像フラクタル化への道#1 単位面積あたりの偏差を取る | _level0 - KAYAC Front Engineer Blog

    これをソース等を参考せずに独学でなんとかやってみようと思います。 フラクタルとは フラクタルとは:フランスの数学者ブノワ・マンデルブロ (Benoît Mandelbrot) が導入した幾何学の概念。図形の部分と全体が自己相似になっているものなどをいう(wikipediaより) つまり全体的に見回しても一部分を拡大しても同じような図形が見られる、という意味みたいです。先へ行くほど分かれていく木の枝や、渦がどんどん小さくなっていく巻貝などが自然界で見られるフラクタルの例です。↑の例でも、全体が一つの画像の長方形であると同時に、無数の小さな長方形で中身が区切られているのがわかるかと思います。 単位面積あたりの標準偏差をとる ではさっそく、アルゴリズムを考えてみます。 背景の単調な部分は大きな長方形が多い 人物の顔や輪郭部分のような細かい部分には小さい長方形が多い 最初は大きな長方形で大雑把に区

    画像フラクタル化への道#1 単位面積あたりの偏差を取る | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2009/11/16
  • Flex で使える汎用スクロールバーコンポーネント | _level0 - KAYAC Front Engineer Blog

    Flex でいろいろ使えるスクロールバー コンポーネント(RichScrollBar.swc)をつくりました。 スクロールさせたい target オブジェクトと mask となるオブジェクトを指定することでいろんなものをスクロールできます。 特徴 ・スクロールバーのデザインは、fla ファイルを編集することで可能。 ・fla ファイルのシンボルを Flex コンポーネントに変換できます。 ・mask の大きさにあわせてスクロールバーの位置や高さを自動でセットします。 ・Mac マウスホイール対応。(MacMouseWheel 使用) 【デモ】 【ダウンロード】 バグがあったので修正しました。2010/01/07 よりも前にダウンロードされた方はお手数ですが、再度ダウンロードをおねがいします。 Tweener と MacMouseWheel をそれぞれ別途ダウンロードしてください。 使い方

    Flex で使える汎用スクロールバーコンポーネント | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2009/11/15
  • 第4回CHECKMATEを振り返る[マスメディアン編] | _level0 - KAYAC Front Engineer Blog

    すっかり寒くなってきましたね。1人の方もそうじゃない方も風邪などひいてないでしょうか。hidakaです。 さて11月、ということはCHECKMATEも第4回が終わりました。 マスメディアン様からのお題は「クリスマスカラーをつかって、イルミネーションを演出してください。」 青色LEDが数年前から氾濫してますがやっぱり緑・赤・白ですよね。それでは振り返っていきましょう

    第4回CHECKMATEを振り返る[マスメディアン編] | _level0 - KAYAC Front Engineer Blog
    soh335
    soh335 2009/11/08
  • 偶然のアート Glitch | _level0 - KAYAC Front Engineer Blog

    おはようございます。MacBookの修理が完了したとの連絡を受けてウキウキの安藤です。HDDが一部アクセス不可になっていたため交換対応となりました。これから受け取りにいってきます^^ さて、こういう電子回路上の接触不良などで発生するノイズやデータの破損を「グリッチ」と言いますが、最近はそれがアートになっているらしいので、ASでやってみることにしました。 グリッチが画像ファイルのデータ上で発生するとピクセルのズレや色のズレが起こり、簡単に言うとファミコンがバグったような画像になってしまいます。しかし稀に「おっ、なんかキレイじゃね?」と思えるものが発生します。(Googleで「glitch art」でイメージ検索) では、ASで再現してみます。ローカルのjpgファイルを読み込み、ByteArrayに渡し、ランダム位置でバイナリを書き換えます。1回だけだとほぼ変化がないので数十回繰り返します。

    偶然のアート Glitch | _level0 - KAYAC Front Engineer Blog