じゃんけんグローブ「絶対！ぬぎPON」の作り方

Funnelのセットアップ

　[FIO公式サイト]

　FIOを参考に必要なものをそろえていきます。私はすべてスイッチサイエンスの通販で購入しました。合計1万5000円くらいです。

• Funnel I/O (FIO)：1個
• XBeeモジュール・チップアンテナ型（日本国内使用可能）：2個
• XBeeエクスプローラUSB：1個
• リチウムイオンポリマー電池1000mAh：1個
• リチウムイオン電池充電器（完成品）：1個

　[スイッチサイエンス]

　次に、Funnelをセットアップしていきます。funnelから最新バージョンのFunnel「funnel_009.zip」（4月26日現在）をダウンロードします。documentsフォルダ内のマニュアルに従ってインストールを進めていきます。

フィジカルにアイデアをスケッチするためのツールキット「funnel」

　FIOとActon Script 3を使うので、マニュアル内の1→2→3→4.4→5.1→6.1→6.2.4→7.1のように進めます。

　以下、私がつまずいた個所などをフォローしていきます（Windows XP環境です）。

◆マニュアル4.4.1

　次の写真のようにはんだジャンパを閉じます。

◆マニュアル4.4.3

　PCのシリアルポート数が多くてXBeeConfigToolのConfigureボタンが表示されない場合は、アプリを編集して高さを調整します。

1. http://processing.org/からProcessingをダウンロードして、XBeeConfigTool.pdeを開きます。
2. application.windows\libフォルダの中身を、Processingのライブラリフォルダに配置します。
   
   3. 「size(500, 400);」とある行を探して「size(500, 500);」のようにアプリの高さの値を変更します。
   4. Runボタンを押してアプリを起動します。

◆マニュアル6.1

　setting.txtのport欄にはXBeeエクスプローラUSBのシリアルポート番号を指定します。

◆マニュアル6.2.4

　FIOに接続したFunnel Serverが正常に起動したとき、次のような画面が表示されます。

◆マニュアル7.1

　動作確認にlibraries\actionscript3\examples\workshopフォルダ内のFioFirstTest.swfを起動します。

　黒丸をマウスダウンすると、FIOのLEDが点灯します。

グローブコントローラの作成

　FIOや曲げセンサ、抵抗器などを使って電子回路を組み立てていきます。部品はスイッチサイエンスや秋葉原の千石電商などで購入しました。手袋はドン・キホーテで購入したスキー用のグローブを使います。

• 曲げセンサ：4個
• 10kΩ抵抗：4個
• ピンソケット：1セット
• ブレッドボード：1個
• ジャンプワイヤ：1セット
• ユニバーサル基盤：1個
• リード線：1セット
• 手袋：1個

　工具は以下のものを準備しました。東急ハンズでそろえました。

• はんだごて
• はんだごて台
• はんだ
• ドリル
• ニッパー
• ペンチ
• やすり
• ゴムテープ
• 裁縫セット

◆FIOの準備

　3V3ピン、GNDピン（電源用）とA0〜A7ピン（アナログ入出力用）にピンソケットを取り付けます。ここでは10穴のソケットを2個使って、14ピン分はんだ付けしています。

◆曲げセンサの準備

　曲げセンサはセンサ本体の曲がり具合で抵抗値が変化するセンサです。真っすぐな状態で10kΩ、90度曲がった状態で30〜40kΩです。曲げセンサはこのようにリード線をはんだ付けして使います。また、配線部分の接触によるショートを防ぐため、ゴムテープで保護します。

◆ プロトタイプ

　次の回路図のように回路を組み立てていきます。

グローブコントローラの回路図

　まずブレッドボードで組んで、次節のFlashアプリの作成に進んで、曲げセンサの値にアクセスできるかどうか動作検証を行います。うまく動作しない場合はここに戻って回路の設計を見直しましょう。ブレッドボードを使った回路にははんだ付けの必要がなく、動作検証時やプロトタイプ作成時に便利です。

　次に、回路を手袋に組み込んで、グー・チョキ・パー判定の動作検証を行います。Flashアプリのチューニングと並行して、グローブコントローラのブラッシュアップも進めます。ここではセンサや回路をできるだけ表に出さない方向で進めていきます。

1. 手袋の甲部分の縫い目を破って中の綿を取り出します。
2. 破った縫い目から指部分に沿うように曲げセンサを入れていきます。
3. ブレッドボードもいけるところまで突っ込みます。

　ブレッドボードが厳しいです……。

　 ブレッドボードをドリルでぶった切って軽量化、回路を小さく組み直してみます。まだサイズ的に厳しいです。またグローブを激しく動かすとブレッドボードに挿し込んだワイヤが抜けてしまいます。

◆ブラッシュアップ

　ブレッドボードを使った回路から、ユニバーサル基盤を使った回路に組み替えていきます。

　 ユニバーサル基盤でははんだ付けで回路を組み立てていくため、ブレッドボード時と比べてトライ＆エラーが面倒になりますが、耐久力とスリム化に優れています。

完成した回路

　次の写真は完成直前のものです。

　 甲部分の破った個所を縫って基盤を完全に隠してしまいます。FIO部分はバッテリー交換やスイッチオン／オフなどのメンテナンス性と操作性を考えて、手首の内側部分に収まるようにして閉じてしまわないようにします。ピンソケット部分は線が抜けないようゴムテープで補強してあげます。装着時もストレスなく動かせればいい感じです。これでグローブコントローラが完成です。

2/3

INDEX
次世代のインプットを考えよう ──マウスとキーボードを超えたフィジカルコンピューティング（4） じゃんけんグローブ「絶対！ぬぎPON」の作り方
	Page1 グー・チョキ・パーに対応するアプリを作成 絶対！ぬぎPON アプリの仕組み
	Page2 Funnelのセットアップ グローブコントローラの作成
	Page3 Flashアプリの作成 「発想を形にするヒント」とか

【関連記事】

chumby開発者が語る誕生秘話とビジネスモデル D89クリップ（2）　かわいらしいルックスとハッキングのしやすさが注目を集める「chumby」。chumbyの生みの親が、ガジェットに対してユーザーが受け身でいられる自由を語る デザインハック ＜ リッチクライアント 2008/11/25

テレビでYahoo!―デバイスが変わればUIデザインも WebとUIをつなぐトリックスター（2）　制作の要となるエンジニアとデザイナのチームワークのツボを探る連載。今回はヤフーのテレビ向けサービスのデザイン担当に話を聞いた デザインハック ＜ リッチクライアント 2008/11/19

Flashの基礎を無料で習得！ ActionScript入門 ActionScriptを知っていますか？ Flash技術の要となる言語で無料で簡単にFlashアプリケーションを作れます。そのActionScriptについて初心者のために一から丁寧に解説していきます

Flash制作を簡単にするActionScriptライブラリとは？ Flasherに便利なオープンソース「Spark project」　Flashの複雑なアニメーションや機能をどのように制作していますか？ 実は、無料で簡単に実現する方法があります デザインハック ＜ リッチクライアント 2008/12/10

[an error occurred while processing this directive]

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