見出し画像

ビジュアルプログラミング環境「プログラミングエモちゃん」の使い方

〜注意〜
本記事は以下のモデルのBOCCO emoのみに対応しています。

※型番はBOCCO emo本体の底面をご確認ください。


はじめに

こんにちは。
ユカイ工学コネクティブエンジニアの宮﨑です。
私は主に、BOCCO emoのソフトウェアの開発を担当しています。

8月6日から、BOCCO emoがビジュアルプログラミングに対応しました!🎉
対応モデルをお持ちの方であれば、無料で使うことができます。

ちいさなお子様やプログラミング初学者でも簡単に、BOCCO emoでプログラミングをすることができます。

例えば

  • BOCCO emoの目の前に人が来たら声をかける

  • BOCCO emoと対話する

  • kurikit製品と組み合わせて、オリジナルのロボットを作る

などを作ることができます。

以下は、プログラミングエモちゃんと、kurikit製品のココロキット+を組み合わせて作成した、「あっちむいてホイ」です。

ココロキット+でスイッチとモータを制御しています。
スイッチを押すことで、ゲームの開始及び矢印の方向を決定しています。
矢印の方向とBOCCO emoの首の動きで勝敗を判定しています。
BOCCO emoが勝ったら喜び、負けると悲しみます。

上記で紹介したようにココロキットココロキット+と組み合わせることもできますし、BOCCO emoだけでもプログラミングをすることができます。

さぁ始めてみましょう!

所要時間:30分~60分
必要なもの:パソコン※

※Webブラウザが操作可能であればスマートフォンやタブレットでも可能です。kurikit製品と組み合わせる場合は、こちらの動作環境をご確認ください。

準備

本作業は最初の1回のみ行います。

【準備1】 「プログラミングエモちゃん」の利用開始

スマートフォンアプリのBOCCOチャンネル画面から、「ユカイラボ > プログラミングエモちゃん」を購読します。


BOCCOチャンネル一覧画面


利用確認画面

【準備2】 BOCCO emo Platform APIを利用するための認証情報の取得

次に、ビジュアルプログラミング環境で使用する、リフレッシュトークン(パスワードのようなもの)を取得します。

BOCCO emo Platform APIのログイン画面を開きます。

BOCCO emo Platform APIのログイン画面

開発者の方 > 「BOCCOアカウントでログイン」をクリックします。

BOCCOアカウントログイン画面

BOCCOアカウントのメールアドレス及びパスワード(普段お使いのBOCCO emoアプリでログインしているもの)を入力し、利用規約同意のチェックボックスをチェックした後に、「ログイン」をクリックします。

使用許可画面

権限付与の確認が表示されます。
「許可する」をクリックします。

ダッシュボード画面

ダッシュボードが表示されます。
ダッシュボード下部の「リフレッシュトークン」を、コピーして控えておきます。
以後の「リフレッシュトークンを設定」で使用します。
一度取得すれば2回目以降は不要です。

使い方

準備が終わったら、早速プログラミングしていきましょう!
kurikitのビジュアルプログラミング環境にアクセスします。

kurikitのビジュアルプログラミング環境画面

画面一番左の縦に並んでいるアイコン列の一番下のBOCCO emoのアイコンを左クリックします。

BOCCO emoアイコン選択後の様子

BOCCO emoのブロックが表示されます。
一番上の「リフレッシュトークンを設定」をクリックします。

リフレッシュトークンの入力画面

準備2で取得したリフレッシュトークンを入力し、OKボタンをクリックします。

リフレッシュトークンの入力完了画面

成功すると、上記のように、「BOCCO emoの準備が完了しました」と表示されます。

ここで、複数のBOCCO emoを使用している方は追加で設定が必要です。

複数のBOCCO emoを使用している場合の追加設定画面

「◯番目の部屋を設定」ブロックの◯を編集することで、どのBOCCO emoに指示を与えるか選択することができます。
「部屋一覧を確認」をクリックすることで、番号とBOCCO emoの部屋の名前が表示されます。
その後、指示を与えたい部屋の番号を入力し、「◯番目の部屋を設定」ブロックを左クリックしてください。

【初級編】 BOCCO emoに発話させてみよう

まずは、発話ブロックを左クリックしてみましょう。

「こんにちは!」を発話させる画面

BOCCO emo が「こんにちは!」と発話したら成功です!
他の言葉を入力して、発話させてみましょう。

発話が成功したら、他のブロックもクリックして、動作を確認してみましょう。

【中級編】 イベントの取得

次に、BOCCO emoのイベントを使用してみましょう。
以下の3つイベントが使用可能です。

  • 新規メッセージを受信

    • BOCCO emoの録音ボタンを押して送信したメッセージ、もしくはスマートフォンアプリから送信したメッセージを受信した時

  • BOCCO emoが音声コマンドを認識

    • BOCCO emoに「エモちゃん、こんにちは」などと話しかけた時

  • BOCCO emoの前に人が近づいた

以下のプログラムを組んだ後に、BOCCO emoの録音ボタンを押して、「今日のおやつは何?」と録音してみましょう。
BOCCO emoが「今日のおやつは、チョコレートだよ!」と発話すれば成功です。

メッセージに「おやつ」が含まれていると、今日のおやつを発話するブロックの様子

このプログラムでは、「新着メッセージの本文」に、「おやつ」という言葉が含まれていた場合、「今日のおやつは、チョコレートだよ!」と発話するように設定しています。
他の言葉に変えて、試してみましょう。

【上級編】 他の拡張機能や、スプライトとの連携

BOCCO emo単体で動かせるようになったら、他の拡張機能や、スプライトと連携してみましょう。

例えば、こんなものができます。

  • 拡張機能「ココロキット+」

    • あっちむいてホイ」のように、ココロキット+で作成したコントローラでBOCCO emoと遊ぶ

  • 拡張機能「NS コントローラ

    • Nintendo SwitchのコントーラでBOCCO emo動かす。

  • スプライト

    • 作成したゲームに勝つと、BOCCO emoが喜んでくれる。

保存・読み込み

作成したプログラムは、「ファイル > コンピューターに保存する」から保存が可能です。
ブラウザを閉じても、保存したプログラムを読み込んで再開できます。
なお、読み込み時はもう一度「リフレッシュトークンを設定」する必要があります。

ファイル保存時の画面

注意事項

利用制限について

プログラミングエモちゃんでは、1分あたり10回の利用制限をかけています。
利用制限を超えると、「制限に到達しました。しばらく待ってから実行してください。」とエラーが表示されます。
エラーが表示された場合はプログラムを見直し、利用回数を減らすようにしてください。

おわりに

いかがでしたでしょうか?
これを機に、BOCCO emoと一緒にビジュアルプログラミングを楽しんでいただければ何よりです。

また、ビジュアルプログラミングでは物足りない方は是非、プログラミング言語で制御可能な、BOCCO emo Platform APIをご活用ください。

これからもBOCCO emoと楽しく遊べる記事を書いていきますのでよろしくお願いします!


BOCCO emoのお迎えはこちら

どちらのモデルにするか迷ったらこちら



この記事が参加している募集

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