連載インデックスへ
次世代のインプットを考えよう
──マウスとキーボードを超えたフィジカルコンピューティング(2)


バランスWiiボードをリモコンにしてみる


浦野大輔(うらのだいすけ)
サイバーエージェント 新規開発局所属
2009/2/13

ライブラリとリファレンス

- PR -

 ライブラリの各クラスファイルは、Coreフォルダをご覧ください。

 全部で14クラスありますが、Wiiリモコンやヌンチャクコントローラ、クラシックコントローラに関するクラスも含まれているため、バランスWiiボードで使うのは「Wiimoteクラス」「WiimoteEventクラス」「BalanceBoardクラス」かと思います。

 ここでは、バランスWiiボードを表す「BalanceBoardクラス」を簡単に紹介します。

BalanceBoardクラスについて

 BalanceBoardクラスはバランスWiiボードを表しています。

 オブジェクトを直接作成することはできず、Wiimoteオブジェクトのプロパティからアクセスします。

 BalanceBoardクラスの主なプロパティを以下にまとめます。

  • bottomLeftKg …左下のセンサの値
  • bottomRightKg …右下のセンサの値
  • centerOfGravity …バランスボード上の重心の位置
  • topLeftKg …左上のセンサの値
  • topRightKg …右上のセンサの値
  • totalKg …バランスボード上の総重量

 すべてのクラスのリファレンス(英語)は、Documentationフォルダをご覧ください。

サンプルアプリを作ってみる

 WiiFlashの使い方はなんとなくご理解いただけたでしょうか?

 それではいよいよ、バランスWiiボードをリモコンにしたFlashアプリを作ってみましょう。

 ここでは、シンプルな万歩計アプリを作ってみようと思います。デスクワークをしながらでもちょっぴり運動した気になれる、運動不足解消アプリです。

 使い方は、足元に置いたバランスWiiボードを軽く足踏みするだけです。

小さめサイズで作業の邪魔にもなりません!(図5)

図5:pedometer.swf

 完成済みのプロジェクトファイルを下のURLからダウンロードしてみましょう。

pedometer.zip

 中身は以下のようになっています。

pedometer\
   pedometer.swf (万歩計アプリのswf)
   pedometer.fla (万歩計アプリのfla)
   Pedometer.as (万歩計アプリのドキュメントクラス)
   org\ (WiiFlash ActionScript API)
   Pedometer.as3proj (FlashDevelop用のプロジェクトファイル)

 「pedometer.swf」を開いてバランスWiiボードを足踏みしてみてください。歩数がカウントされていますか?

サンプルの解説

 それでは早速、「Pedometer.as」を開いてみましょう。

 「onUpdateメソッド」で歩数をカウントするロジックをコーディングしています。

package {
        import flash.display.MovieClip;
        import flash.events.Event;
        import flash.events.IOErrorEvent;
        import flash.text.TextField;
        
        import org.wiiflash.Wiimote;
        import org.wiiflash.events.WiimoteEvent;
        
        /**
         * バランスWiiボードを使った、シンプルな万歩計アプリです。
         */
        public class Pedometer extends MovieClip
        {
                // Wiimoteオブジェクト
                private var wiimote:Wiimote;
                
                // バランスWiiボードの左側の重さ
                private var leftKg:int;
                // バランスWiiボードの右側の重さ
                private var rightKg:int;
                
                // 歩数
                private var count:int;
                
                // Viwe
                private var view:PedometerView;
                
                public function Pedometer()
                {
                        // Wiimoteオブジェクトを生成します。
                        wiimote = new Wiimote();
                        
                        // 各イベントリスナを追加します。
                        wiimote.addEventListener
                        (Event.CONNECT, trace);
                        wiimote.addEventListener
                        (IOErrorEvent.IO_ERROR, trace);
                        wiimote.addEventListener
                        (WiimoteEvent.BALANCEBOARD_CONNECT, trace);
                        wiimote.addEventListener
                        (WiimoteEvent.BALANCEBOARD_DISCONNECT, trace);
                        wiimote.addEventListener
                        (WiimoteEvent.UPDATE, onUpdate);
                        
                        // WiiFlash Serverに接続します。
                        wiimote.connect();
                        
                        // 歩数を初期化します。
                        count = 0;
                        
                        // Viewを生成します。
                        view = new PedometerView();
                        view.x = 10;
                        view.y = 12;
                        addChild(view);
                }
                
                /**
                 *  バランスWiiボードの各センサの値を処理します。
                 */
                private function onUpdate(e:WiimoteEvent):void
                {
                        // 重量が3kg未満の場合はスルーします。
                        if(wiimote.balanceBoard.totalKg < 3) return;
                        // -- 【1】
                        
                        leftKg = wiimote.balanceBoard.topLeftKg
                            + wiimote.balanceBoard.bottomLeftKg;
                        rightKg = wiimote.balanceBoard.topRightKg
                            + wiimote.balanceBoard.bottomRightKg;
                        
                        // 左足を踏み出したとき、歩数を進めます。
                        if(count%2==0 && leftKg/rightKg>2) 
                        // -- 【2】
                        {
                                proceedStep();
                        }
                        // 右足を踏み出したとき、歩数を進めます。
                        else if(count%2==1 && rightKg/leftKg>2) 
                         // -- 【2】
                        {
                                proceedStep();
                        }
                }
                
                /**
                 * 歩数を進めます。
                 */
                private function proceedStep():void
                {
                        // 歩数を更新します。
                        count++;
                        
                        trace(this,"proceedStep", count);
                        
                        // View を更新します。
                        view.countField.text = count.toString();
                }
                
        }
}

■【1】

 バランスWiiボードに何もしなくても加わっている1〜2kgのノイズを無視します。

■【2】

 歩数をカウントするロジックです。

 バランスWiiボード右側の重量が左側の重量の2倍より大きいときを左足を踏み出した状態とし、歩数を進めます。

 バランスWiiボード左側の重量が右側の重量の2倍より大きいときを右足を踏み出した状態とし、歩数を進めます。

 バランスWiiボードからは4つのセンサの値しか取得できないため、「足踏みしている」などの動作は、4つの値の組み合わせで決めてあげる必要があります。

 今回紹介したロジックは大体正確なざっくりとしたものですので、読者の皆さんも自分なりのロジックをお試しいただけたらと思います。

WiiFlashの公式ブログもチェック

 いかがでしたか?

 今回紹介したWiiFlashは、バランスWiiボードのほかに、Wiiリモコンやヌンチャクコントローラ、クラシックコントローラでも使えたり、最大4つまでのコントローラ接続も可能です。

 そのあたりの使い方は、書籍「Flash OOP for ActionScript 3.0」に紹介されていますので、興味がある方はぜひご覧になってみてください。

Flash OOP for ActionScript 3.0

 また、WiiFlashの次期バージョンでは、ギターコントローラへの対応も予定されています。

 詳細はWiiFlashの公式ブログをチェックしてみてください!

WiiFlash.org


浦野大輔(うらのだいすけ)
株式会社サイバーエージェント新規開発局所属。
インタラクティブデザイナー。
主なプロジェクトはAmeba、プーペガールなど。
http://uranodai.com

【関連記事】

Chumby開発者が語る誕生秘話とビジネスモデル
D89クリップ(2) かわいらしいルックスとハッキングのしやすさが注目を集める「Chumby」。Chumbyの生みの親が、ガジェットに対してユーザーが受け身でいられる自由を語る
テレビでYahoo!―デバイスが変わればUIデザインも
WebとUIをつなぐトリックスター(2) 制作の要となるエンジニアとデザイナのチームワークのツボを探る連載。今回はヤフーのテレビ向けサービスのデザイン担当に話を聞いた
Flashの基礎を無料で習得! ActionScript入門
ActionScriptを知っていますか? Flash技術の要となる言語で無料で簡単にFlashアプリケーションを作れます。そのActionScriptについて初心者のために一から丁寧に解説していきます
Flash制作を簡単にするActionScriptライブラリとは?
Flasherに便利なオープンソース「Spark project」
 Flashの複雑なアニメーションや機能をどのように制作していますか? 実は、無料で簡単に実現する方法があります

3/3  

 INDEX
次世代のインプットを考えよう
──マウスとキーボードを超えたフィジカルコンピューティング(2)

バランスWiiボードをリモコンにしてみる
  Page1
体を使ったFlashアプリ
バランスWiiボードとは?
バランスWiiボードの仕組み
バランスWiiボードとFlashを組み合わせてできること
  Page2
必要なもの
環境構築
動作確認
サンプルの解説
Page3
ライブラリとリファレンス
サンプルの解説
WiiFlashの公式ブログもチェック



 Smart&Social フォーラム トップページへ



Smart & Social フォーラム 新着記事
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)

注目のテーマ

Smart & Social 記事ランキング

本日 月間