スクリーンショット_2019_05_28_18_50

タミヤ カムプログラムロボットをobnizでラジコン化してみた

こんにちは、遠藤です。

先日、Twitter上でタミヤのカムプログラムロボットとmicro:bitを組み合わせた画像を見て、自分でも試して記事にしてみようと思ったのですが、しばらく前に買って電源も入れていないobnizが机の中に眠っていて、そういえばobnizってモータードライバーが標準で付いるしmicro:bitよりも簡単に組み合わせられそうだなと思い、カムプログラムロボット x obnizでスマートフォンからロボットを操作するという工作をしてみることにしました。

タミヤ カムプログラムロボットについてはこちらの動画を見て下さい。

プログラムバーにカムを取り付けて、自由にロボットを走らせることができます。これだけでもなかなか楽しいです。

カムプログラムロボットは後継のチェーンプログラムロボット工作セットもありますが、見た目がカムプログラムロボットの方がかわいいのでこちらを購入しました。

obniz はインターネットから操作できるマイコンになります。

「インターネットから操作?Wifi繋げられるマイコン他にもあるよね?」と私も最初わかりませんでしたが、インターネットに単につながるのではなく、マイコンにプログラム(ファームウェア)を焼かなくてもインターネット越しにjavascriptなどで記述したプログラムをそのまま動かせるのが便利です。
また、公式でmicro:bitのようにwebのプログラムエディタが用意されているので開発環境を準備することなくすぐにプログラムが作成できます。

完成はこんな感じです。

カムプログラムロボットのモーターをobnizで制御し、Webアプリのプロポを作成してリモートコントロールしています。

以下の手順で実装していきます。

1. 買い物
2. カムプログラムロボットを組み立てる
3. obnizをWifiにつないでHello Worldしてみる
4. プロポのWebアプリを作る
5. obnizをロボットに乗せる
6. 動かしてみる

1. 買い物

買い物リストです。

・タミヤ カムプログラムロボット
・obniz (Amazonで購入)
・ジャンパーワイヤー オス-メス x 4 (マルツで購入)
・モバイル バッテリー (ダイソーで購入)
・USBケーブル

出来上がりにこだわる場合は、電源周りをコンパクトにする仕組みを考える必要がありますが、今回は安上がりに100円ショップのモバイルバッテリーを使いました。

ジャンパーワイヤーだけ、電子パーツ屋で買う必要があります。マルツで売っている安いセットを買いました。オンラインサイトのリンクを貼っていますのでご利用ください。

2. カムプログラムロボットの組み立て

説明書に沿って組み立てていきます。

しばらくプラモデルとか作ってないので、部品の多さに圧倒されてしまいます。

2時間強経過

出来上がりました。

説明書どおりにカムを組んで走らせてみましたが意外と上手く動かず。。
機械的な動きの調整はある程度必要そうな印象でした。

それはさておき、今回は、オリジナルの仕組みは使わないので放置して、プログラムからクローラーを制御するように改造していきます。

3. obnizをWifiにつないでHello Worldしてみる

obniz 公式ドキュメントのクイックスタートに沿ってobnizの動作を確認してみます。

以下のサイトにアクセスして下さい。

クイックスタートを以下のように選択して[クイックスタートを開始する]をクリックします。

[入門レッスン(html) > クイックスタート]が開きます。[obnizをWifiに接続]の手順にそってWi-fiに接続してみます。

1. 箱から出したら、マイクロUSBをobnizにつないで電源を入れます。(電源を切る時はUSBを抜くだけでOKです)
2. 電源が入るとスイッチの場所を教えるアニメーションがでます。obnizの左上のスイッチを押すことで進み、近くのWifiリストが出てきます。その中からスイッチを左右に倒すことでWiFiを選び、スイッチを押すことで選択します。

obnizをUSBにつないで電源をいれると、ディスプレイに[Switch this!]と表示されます。左上のスイッチを押します。

次にWiFiの接続先を選択します。

3. 接続のためにWifiのパスワードを1文字ずつ入力しましょう。スイッチを左右に動かし、押すことで決定します。入力が終わったら「END」を選びます。

WiFiパスワードを入力。スイッチで入力するのは結構たいへんです。
入力したら[END]に移動してスイッチを押して接続開始します。

4. QRコードが表示されたら完了です!インターネットに繋がりobnizはオンラインになりました。

QRコードが表示されたらセットアップ完了です。

接続したWiFiの情報は記録されているので、次回からは電源につなぐだけでWiFiに接続してくれます。

クイックスタートの「動かしてみよう」のセクションに進み、テストプログラムの[Test Open]をクリックします。

画面が切り替わり以下のダイアログが表示されるので、obnizのディスプレイに表示されている8桁のId(ハイフンを含む)を入力して[OK]をクリックします。

少し待つとobnizと接続されジョブのバーがグリーンに変わります。

[Print obniz]をクリックするとobnizのディスプレイに「Hello World」と表示されます。

以上で、obnizの接続確認は完了です。

4. プロポのWebアプリを作る

obnizのプログラム作成は、javascript、python、Scratch風のブロックエディタの3通りの言語を選択できます。

今回は推奨されていそうなjavascriptを利用して簡単なプロポ Webアプリを作っていきます。

開発は、obnizが用意している開発コンソールで行います。

obnizのサイトの右上の[開発コンソール]ボタンをクリックするか以下のURLにアクセスします。

[プログラム]をクリックします。

ダイアログでobnizのIdを入力して[開く]をクリックします。

プログラムエディタが開きます。

以下のコードをコピペして貼り付けます。

<html>
 <head>
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <script src="https://obniz.io/js/jquery-3.2.1.min.js"></script>
   <script src="https://unpkg.com/obniz@2.0.3/obniz.js" crossorigin="anonymous"></script>
   <style>
       .controls {
           display: grid;
           grid-template-columns:1fr 1fr 1fr; 
           grid-template-rows:1fr 1fr 1fr; 
       }
       .controls button {
           display: block;
           width: 100%;
           height: 100px;
           font-size: 44px;
       }
   </style>
 </head>
 <body>
   <div id="obniz-debug"></div>
   <h1>Cam-Robot Controller</h1>
   <div class="controls">
     <div class="control-cell"></div>
     <div class="control-cell"><button id="forward">▲</button></div>
     <div class="control-cell"></div>
     <div class="control-cell"><button id="turnLeft">◀</button></div>
     <div class="control-cell"><button id="stop">■</button></div>
     <div class="control-cell"><button id="turnRight">▶</button></div>
     <div class="control-cell"></div>
     <div class="control-cell"><button id="reverse">▼</button></div>
     <div class="control-cell"></div>
   </div>
   <div id="print"></div>

   <script>
     var obniz = new Obniz("OBNIZ_ID_HERE");
     obniz.onconnect = async function() {
       var motorRight = obniz.wired("DCMotor", { forward: 1, back: 0 });
       var motorLeft = obniz.wired("DCMotor", { forward: 2, back: 3 });

       //前に進む
       $("#forward").click(function() {
         motorLeft.forward();
         motorRight.forward();
       });
       //右に向く
       $("#turnLeft").click(function() {
           motorLeft.reverse();
           motorRight.forward();
       });
       //停まる
       $("#stop").click(function() {
         motorLeft.stop();
         motorRight.stop();
       });
       //左に向く
       $("#turnRight").click(function() {
           motorLeft.forward();
           motorRight.reverse();
       });
       //後ろに進む
       $("#reverse").click(function() {
         motorLeft.reverse();
         motorRight.reverse();
       });
     };
   </script>
 </body>
</html>

貼り付けたプログラムエディタです。

プログラムの準備は以上です。

5. obnizをロボットに乗せる

まずは、携帯用充電器にobnizをつなぎます。

携帯用充電器につないで電源が入るとすぐにWiFiに接続されます。

2. カムロボットの元の配線を外します。

(不要なのでカムのギアボックも取ってしまった方がより良さそうです)

3. モーターの配線をジャンパーワイヤーでつなぎ、そのさきをobnizの0から3のソケットにつなげます。

写真でわかりにくいですが、以下のようにつないでいます。

・後ろから見て左のモーターの青い線 => 2番
・後ろから見て左のモーターの黄色い線 => 3番
・後ろから見て右のモーターの青い線 => 0番
・後ろから見て右のモーターの黄色い線 => 1番

(モーターの線をジャンパーワイヤーにしっかり差し込むのもなかなか苦労します。オス - オスのジャンパーワイヤーと付属のゴムチューブで結線した方が頑丈かもしれません。)

4. obnizとモバイルバッテリーをロボットに載せて蓋をしめます。

以上で、完成です。

後ろから見ると、見た目がイマイチですね。モバイルバッテリーは高いですがもっと小さいものを使うなどした方がもっとスッキリできそうです。

6. 動かしてみる

obnizのQRコードをスマートフォンで読み取ります。

スマートフォンのブラウザでプログラムエディが開きます。右上の[▶]ボタンをタップします。

obnizのIdを確認して[OK]をタップします。

以下のように、コントローラのアプリが表示されます。

あとは、見ての通りの操作でボタンをオスとロボットが動きます。

あとがき

今回は、カムプログラムロボットとobniz以外は、なるべく安いパーツを揃え、さっと作ってみましたが、せっかくロボットの見た目が良いのに、コードや電池ボックスがはみ出ていてプロトタイプ感満載です。。これでは子供に遊ばせたらすぐにバラバラになってしまいそうですし、もうすこし見た目スッキリ頑丈に組み立てたいところです。
あとは、カムのしくみは今回未使用なので、カムプログラムロゴのタイプAの動作をobniz経由で操作できるようにするのも面白そうです。サーボモーターをどう組み入れるかは工夫が要りそうですが。

というわけで、次はカムプログラムロボットの電池ボックスを生かして、昇圧モジュールを介してobnizに電源供給して見た目の完成度を上げるあたりをやってみようかなと思っていたりします(記事にするかは未定です)。

この記事が気に入ったらサポートをしてみませんか?