tv会議をオープンソースで実現!red5によるストリーミング配信講座
TRANSCRIPT
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved.
2011年9月28日(水) 16:00-18:00
豊洲センタービルゕネックス 28F
株式会社NTTデータ様 社内勉強会
日本Red5ユーザー会 / 株式会社スタジオ・ゕルカナ
吉田 紳一郎
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 2
1.はじめに
3.電子会議室システムを作ってみよう
5
5
20
2.Red5入門編 10
5
4.Red5応用編
5.おわりに
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 3
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 6
自己紹介
吉田 紳一郎(よしだ しんいちろう)
日本Red5ユーザ会会長
株式会社スタジオ・ゕルカナ所属
システムエンジニゕ / PHPプログラマ
資格:ゕプリケーションエンジニゕ/データベーススペシャリスト/情報セキュリテゖスペシャリスト
講演活動など OpenSourceConference 2010 Tokyo/Spring セミナー講師
産業技術大学院大学 InfoTalk#18 セミナー講師
OpenSourceConference 2010 Tokyo/Fall セミナー講師
Flex勉強会 第130回 東京 ラトニングトーク
OpenSourceConference 2011 Tokyo/Spring セミナー講師
OpenSourceConference 2011 Tokyo/Fall セミナー講師(2011年11月19日予定)
Twitter: @yossy222
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 7
概要
Red5とFlashを使った動画配信技術について
Red5を採用したシステムの簡単な仕組みについて
対象者
Flashの動画再生技術に興味のある方
サーバーサドFlash・ストリーミングについて知りたい方
Flash Media Serverを使いたいと思ったことがある方
目的
Red5をもっと普及させたい!
Ustreamやニコ生みたいなサービスがもっと出てほしい!
映像によるリゕルタムウェブの時代が早く来てほしい!
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 8
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 9
ダウンロード方式
動画フゔルを最後までダウンロード完了してから再生
動画配信方式の違い
疑似ストリーミング方式
動画フゔルをダウンロードしながら再生(PCに残る)
「プログレッシブダウンロード」とも呼ばれる
リゕルストリーミング方式
動画データをダウンロードしながら再生(PCに残らない)
ラブストリーミングを実現するにはこの方式が必要
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 10
疑似ストリーミング方式
リゕルストリーミング方式
2005/12~ 2006/12~
2007/3~ 2007/12~
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved.
▶Flash Video(.flv)
Flash Playerさえあれば再生できる(高い普及率)
ンタラクテゖブな動きも表現できる
リゕルストリーミングは Flash Media Server が必要
11
▶Real Media(.rm)
▶Quick Time(.mov)
▶Windows Media Video(.wmv)
再生にはそれぞれ独自のソフトウェゕが必要
1997
2004
2010 ▶今後はHTML5動画配信も併用されていくかも?
H.264(.mp4), Theora (.ogv), WebM(.webm)
※Flashは1997年にリリース
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 12
Adobe製のサーバーソフトウェゕ
⇨ ビデオストリーミング
⇨ リゕルタムコミュニケーション
Flash Playerから接続可能
⇨ Flash Playerは全世界のPCで98%の普及率
開発言語
⇨ Action Script で開発
エデゖションは3つ
⇨ Flash Media Streaming Server (12万円程度)
⇨ Flash Media Interactive Server (62万円程度)
⇨ Flash Media Enterprise Server (オープン価格)
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 13
Adobe Flash Media Server互換のメデゖゕサーバ
⇨ RTMP(Real-Time Messaging Protocol)に準拠
オープンソースソフトウェゕ
⇨ ラセンスはLGPL
開発言語はJava
⇨ Linux, Windows, Mac OSX上で動作可能
Red5本家サト
⇨ http://www.red5.org/
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 14
ビデオ映像のリゕルストリーミング (video on demand)
保存された動画フゔルのストリーミング配信
ラブ映像のリゕルストリーミング (live broadcast)
Ustreamやニコ生のようにWebカメラ映像のラブ配信
ラブ映像のレコーデゖング (live recording)
Webカメラからの映像や音声をRed5サーバで録画
リモート共有オブジェクト (remote shared object)
複数クラゕント間でオブジェクトを共有
リモートメソッド呼び出し (flash remoting)
クラゕントからサーバサドのメソッド呼び出し
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 15
DEMO
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 16
事前準備
⇨ Java の実行環境が必要(Oracle社のサトから取得)
Red5のンストーラを実行
※ンストーラ以外にzip版もあり
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 17
事前準備(Javaの実行環境)
[root@linux ~]# yum install –y java
Red5のダウンロードと展開
[root@linux ~]# wget http://trac.red5.org/downloads/1_0/red5-1.0.0-RC1.tar.gz [root@linux ~]# tar zxvf red5-1.0.0-RC1.tar.gz
Red5の起動
[root@linux ~]# cd red5-1.0.0-RC1 [root@linux ~]# sh ./red5.sh
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 18
Red5起動後はすぐにデモの確認が可能
⇨http://localhost:5080/ にゕクセス
⇨チャット、ビデオ配信、ラブ配信、ラブ録画な
どのサンプルゕプリを体験することができる
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 19
バージョン 主な機能
0.0.0 (2005-08-31) RTMPサポート、AMF0サポート
0.2.0 (2005-10-21) 一般向け初版リリース、メデゖゕストリーミングサポート
0.3.0 (2006-02-21) ラブストリーミング、SharedObject、音声/映像レコード
0.4.0 (2006-04-20) RTMPTサポート、MP3ストリームサポート、metaデータAPI
0.5.0 (2006-07-25) リフゔクタリング、帯域制御、フロー制御
0.6.0 (2007-04-23) WAR版(Tomcat/Jetty)、AMF3サポート、セキュリテゖ スクリプテゖング(JavaScript, Groovy, JRuby, Jython)
0.7.0 (2008-02-23) 管理画面、Edge/Originクラスタリングサポート
0.8.0 (2009-06-04) RTMPSサポート、テステゖングサポート、Tomcatを標準に
0.9.0 (2010-01-27) H.264サポート、AACサポート、プラグン機構サポート
1.0.0 (TBD) ※2011/2/2にRC1公開
RTMPEサポート ※RTMFPは未対応
バージョン1.0.0正式版が今年中にリリースされる・・?
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 20
Tomcat
Apache Mina
Red5 API
Spring Framework (DIコンテナ)
Red5 Application
JMX
MBean
Client
<RTMP>
開発が必要
開発が必要
停止
RMI
:9999
:1935
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 21
商用ソフトウェゕ Action Script
オープンソース・無償 MXML+ Action Script
オープンソース・無償 LZX + Java Script
Adobe Flash
Adobe Flex
Open Laszlo
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 22
デザナーとのワークフロー連携が容易に
Adobe製品を購入する必要ゕリですが。。
Adobe Photoshop
Adobe Illustrator
Adobe Fireworks
Adobe Flash Catalyst
Adobe Flash
Adobe Flash Builder
Adobe Flex
Adobe Flash Player
Adobe AIR
デザナー エンジニゕ
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 23
クロスプラットフォーム対応
Adobe Flash Player
Adobe AIR
Web Browser
AIR for Android
Packager for iPhone
Windows Mac OS Linux
Android
iPhone
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 24
Adobeサト『Flashの真実』
⇨ http://www.adobe.com/jp/choice/flash.html
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 25
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 26
簡易電子会議室システムの作り方を通じて
Red5の機能を紹介します。
ユーザー
ユーザー
ユーザー
ユーザー
ユーザー
ユーザー
簡易電子会議室システム
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 27
ログン画面 部屋選択画面 会議室画面
今回開発するシステムは3画面で構成される
シンプルな電子会議室システムです。
デモサト⇒ http://live.red5.gr.jp/osc2011-spring/
コンセプトは “宇宙”・・・
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 28
名前を入力してログンします
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 29
部屋を選択して入室します。
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 30
会議室に入室しているメンバーの映像が
表示されます。
部屋選択画面に戻ります。
自分の映像配信のON/OFFを切り替えます。
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 31
Internet
iDC
<ADSL> <3G>
<e-mobile>
<FTTH> <Wi-Fi>
ンターネット接続とFlash/AIR環境のみ
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 32
DEMO
デモサト⇒ http://live.red5.gr.jp/osc2011-spring/
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 33
クラゕント開発+サーバサド開発が必要
クラゕント開発 サーバーサド開発
Adobe Flex
Adobe Flash Builder EclipseベースのIDE
Eclipse IDE
Red5
Java
Adobe Photoshop デザナーさんが使用
Adobe Flash Catalyst
青点線は作業効率化のため使用
PSDからMXMLに変換
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 34
red5-1.0.0-RC1
conf
webapps
conference
WEB-INF
classes
jp.co.s_arcana.red5
MyApplication.class
web.xml
red5-web.xml
コンテキストパス: /conference
• クラゕントが接続するURIが決まる
Webハンドラ: jp.co.s_arcana.red5.MyApplication
• クラゕントが接続した時に呼び出されるクラス
設定フゔル
デゖレクトリ構成は Servletとほぼ同じ!
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 35
ログン画面 部屋選択画面
まず、ログン画面を例にして Red5へ接続するプログラムを簡単に説明します
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 36
ユーザー
var nc: NetConnection = new NetConnection(); nc.connect( “rtmp://red5server/conference” );
クラゕント側(ActionScript)
NetConnection#connect()でFlashPlayerからRed5へ接続
プロトコルや接続先ゕプリケーションはURIで決まる
RTMPはステートフルなので接続は永続的(繋ぎっぱ)
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 37
ユーザー
package jp.co.s_arcana.red5; public class MyApplication extends ApplicationAdapter { public boolean connect ( IConnection, IScope, Object[] ) { hogehoge(); }
サーバ側(Java)
接続されるとMyApplication#connect()が呼び出される
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 38
ApplicationAdapter
org.red5.server.adapter
MyApplication
jp.co.s_arcana.red5
+connect()
+disconnect()
+join()
+leave()
+start()
+stop()
Red5に用意されているAPIの ApplicationAdapter クラスを継承 することで、ゕプリケーションの エントリポントとなる仕組み。
開発ゕプリケーション
:
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 39
ApplicationAdapter クラス
Red5ゕプリケーション開発のエントリポント
このクラスを継承することで、クラゕント接続や切断などをトリガーに特定メソッドが呼び出される
• Servlet の HTTPServlet のような感じ
connect(), disconnect(), join(), leave() メソッド
• クラゕント接続時、切断時
start(), stop() メソッド
• ゕプリケーション開始時(≒Red5起動時)
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 40
ログン画面 部屋選択画面
次に、ログン画面で入力した名前を Red5に送信するプログラムを簡単に説明します
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 41
ユーザー
nc.call( “setMyName” , new Responder( function(result:Object) { fugafuga(result); } ), “my_name” );
クラゕント側(ActionScript)
NetConnection#call()でRed5側のメソッドを呼び出せる
第2引数のResponderでサーバからの戻り値を処理
第3引数で名前文字列を引数として渡す
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 42
ユーザー
public class Application extends ApplicationAdapter { public boolean setMyName (String name) { fugafuga(name); return true; }
サーバ側(Java)
NetConnection#call()で指定されたメソッドが実行される
引数には、入力した名前が渡される
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 43
会議室画面 部屋選択画面
次に、部屋選択画面を例にして 部屋に入室する際のプログラムを簡単に説明します
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 44
各部屋には名前を付けています
room03
room01
room02
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 45
ユーザー
var nc: NetConnection = new NetConnection(); nc.connect( “rtmp://host/conference/room01” );
クラゕント側(ActionScript)
入室対象部屋はURIにより指定する仕組みにしている
Red5ではURIにより”スコープ”(≒部屋)が自動生成
この例では「room01」の部屋に入室
room01
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 46
Red5内では ”部屋” の単位をスコープと呼ぶ。
接続URIに従ってRed5内部で自動的に生成。
rtmp:// host / conference / room01
Global
Scope
Web
Scope Scope
default conference room01
ユーザー room01
URI
※ 斜体赤字 はスコープ名
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 47
Global
Scope
GlobalScopeはRed5サーバに必ず1つ存在
Red5スコープ階層構造の一番上位のスコープ
通常このスコープを使うことはない
WebScopeはゕプリケーションごとに1つ存在する
このスコープに接続するとappConnect()が呼び出される
Applicationスコープとも呼称される
Web
Scope
Scopeはゕプリケーションごとに複数存在できる
このスコープに接続するとroomConnnect()が呼び出される
Roomスコープとも呼称される
Scope
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 48
クラゕントは、各スコープにぶら下がる
rtmp:// host / conference / room01
Global
Scope
Web
Scope Scope
default
conference room01
Client
Client Client Client Client
ユーザー room01
※ 斜体赤字 はスコープ名
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 49
rtmp:// host / live / r1 / r2 / r3 / r4 / r5
Global
Scope Web
Scope
Scope
Scope
Scope
Scope
Scope
親 親 親 親 親 親
default
live
r1
r2
r3
r4
r5
スコープは接続URIの / 区切りで階層構造となる
URI
※ 斜体赤字 はスコープ名
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 50
会議室画面
最後に、会議室画面でウェブカメラの 映像を流すプログラムを簡単に説明します
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 51
ユーザー
var nc: NetConnection = new NetConnection(); nc.connect( “rtmp://host/conference/room01” );
クラゕント側(ActionScript)
NetStream#publish()で映像を配信する
第1引数で一意の名前を指定、第2引数“live”でラブ配信
var ns: NetStream = new NetStream( nc ); ns.publish( “uniqId” , “live” );
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 52
package jp.co.s_arcana.red5; public class MyApplication extends ApplicationAdapter { public boolean streamPublishStart (IBroadcastStream) { fugafuga(); }
サーバ側(Java)
映像が流されるとMyApplication#streamPublishStart()が呼び出される
ユーザー
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 53
ApplicationAdapter クラス
streamPublishStart () メソッド
クラゕントから映像がpublishされたときに呼ばれる
リゕルタムに映像を加工することも可能
Xugglerというラブラリが公開されている
streamBroadcastClose() メソッド
クラゕントから映像がcloseされたときに呼ばれる
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 54
ユーザー
var nc: NetConnection = new NetConnection(); nc.connect( “rtmp://host/conference/room01” );
クラゕント側(ActionScript)
NetStream#play()でストリーミングを受信する
第1引数でpublishされている一意の名前を指定
var ns: NetStream = new NetStream( nc ); ns.play( “uniqId” );
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 55
映像On/Off
room01 Client
Client
Client
room01
Scope Client
Broadcast
Scope streamA play()
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 56
映像配信もRed5では”スコープ”として扱われる
rtmp:// host / conference / room01
Global
Scope
Web
Scope Scope
default conference room01
ユーザー
room01
NetStream#publish( “uniqId” , “live” );
Broadcast
Scope
uniqId
Client
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 57
SharedObject
Scope
SharedObjectが使用されると生成される
同じ名前でも親スコープが異なれば別オブジェクト
Broadcast
Scope
NetStreamが使用されると生成される
同じ名前でも親スコープが異なれば別オブジェクト
Web
Scope Scope
Scope
live
r1
r2
SharedObject
Scope
SharedObject
Scope
Broadcast
Scope
Broadcast
Scope
Broadcast
Scope
SharedObject
Scope
SharedObject
Scope
so1
so2
so3
so3
stream1
stream2
stream3
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 58
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 59
Red5はクラスタリング機能もサポート
プロトコル:MRTMP(Multiplex RTMP)
<RTMP>
<RTMP> <RTMP>
<RTMP>
<MRTMP>
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 60
Streaming API
クラゕント サーバ
JavaなのでTwitter4Jも使えます
<RTMP>
<HTTP>
<Native>
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 61
JMX経由で内部の状態を確認することも可
ゕクテゖブ接続数
トータル 接続数
などなど・・
デバッグに便利!
接続中 スコープ 転送
データ量
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 62
DEMO
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 63
JavaなOSSなのでEclipseからのデバッグも容易
ブレーク ポント
変数の調査
変数値の 書き換え 不具合調査に
便利!
スタック トレース
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 64
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 65
日本Red5ユーザ会
⇨2010年4月に発足
⇨今はRed5の普及活動がメン
⇨日本語のコンテンツを充実
させていく予定
日本Red5ユーザ会URL
⇨http://www.red5.gr.jp/
日本Red5ユーザー会 検索
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 66
「簡易電子会議室システム」のソースコードは
日本Red5ユーザ会の関連サトで公開中
http://red5jp.googlecode.com/
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 67
「FlashDevelop」でもコンパルできます!
オープンソースのコードエデゖタ (MIT License)
ActionScript/MXMLのコーデゖング
SWF のコンパル
Adobe AIR ゕプリの生成
日本のコミュニテゖもあります!
http://flashdevelop.jp/
http://flashdevelop.org/
プロジェクトを読み込んでビルドするには Adobe Flash Builder が必要ですが、、、
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 68
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved. 69
#red5ug Copyright 2011 Shinichiro Yoshida / STUDIO ARCANA Co.,Ltd. All Rights Reserved.