SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

DeveloperZine(デベロッパージン)- エンジニアの意思決定を支える技術情報メディア ProductZine

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

「作りたい!」を形にする個人開発。AIと叶える「あなただけのスタックチャン」開発入門

数値は指定せず「ぎこちない」と伝えるだけ ──Codexでスタックチャンをスムーズに動かす方法

「作りたい!」を形にする個人開発。AIと叶える「あなただけのスタックチャン」開発入門 第3回

石川 真也/ししかわ[著] / CodeZine編集部[編]

 本連載は、生成AIを相棒にオープンソースロボット「スタックチャン」の個人開発に挑戦する入門講座です。今回は、ひととおり動く最小限の試作をCodexを使って実装します。その動きを実際に見ながら感想を伝え、好みの動きになるようにブラッシュアップしていきます。

最小限に作って、見て、リテイクする開発の進め方

 第1回で「手拍子で踊るスタックチャン」のアイディアを出して、第2回では開発環境を整えました。今回は、頭をなでてダンスモードに入り、手拍子のテンポで踊るスタックチャンを作ります。

手拍子ダンスアプリケーションの動作イメージ(再掲)
手拍子ダンスアプリケーションの動作イメージ(再掲)

 まずはひととおり動く最小限の試作をCodexに実装してもらい、その動きを実際に見聞きして感想を伝えながら、好みのダンスに近づけていきます。

 第1回で、手拍子ダンスのモジュール構成を「入力、処理、出力」に分けて図にしました。

頭なでと手拍子を入力が受け、テンポとダンスパターンを決めて、首振りとLEDへ渡す第1回のモジュール構成
頭なでと手拍子を入力が受け、テンポとダンスパターンを決めて、首振りとLEDへ渡す第1回のモジュール構成

 この設計をCodexに渡して、まずは頭なでによるモード切り替えから、拍手の検知、ダンスまでをひととおり作ってもらいます。プログラムがバグなく動いても、「かわいいダンスになったか」「何度も繰り返し試したくなる反応になったか」は、実際の動きを見ないと判断できません。

 特に、ロボットの動作の印象や操作の分かりやすさは、最新のLLMを使っても、最初から完璧に作り込むのは難しいところです。そこで「まず最小限の動きを実装して、その動きを見て気になったところをリテイクする」を繰り返しながら理想的な動きに近づけていきます。

「小さく、短く、暗く」から始める安全な初回実装

実装前にCodexに計画を立てさせる

 stackchan-idfには、頭のタッチセンサー、サーボモーター、顔の描画、マイク、スピーカー、背面LEDを扱う処理がすでに用意されています。通常のデモにも、頭なでに反応する処理が入っています。今回はこうした既存の処理を利用して、頭なででモードを切り替える処理、拍手からテンポを求める処理、そしてダンスの振り付けを追加します。

 まずはCodexに計画を立ててもらい、どのような動きから作り始め、どの順番で動作を確認するかを決めておきます。例えば、次のように依頼すると、実装から実機での確認までを含めた計画を立ててもらえます。

プロンプト例
頭なでで待機とダンスモードを切り替え、ダンスモードで4回の拍手を受けたら、そのテンポで踊る機能を作りたいです。
stackchan-idfの既存のセンサー、モーター、描画、音声、LEDの処理を利用してください。
まず短時間、小さい首振り、低いLED輝度から始めます。
ビルドと自動テストまで行い、実機への書き込み前に変更内容を示してください。
書き込み後は、私が動きを見て感想を返すまで待ってください。

 今回はスタックチャンの首を動かします。電源投入後に音だけで動き始めると、意図しないタイミングで動く可能性があります。そこで、頭をなでて明示的にダンスモードへ切り替える操作を設けました。起動直後は待機状態になっており、頭を前から後ろ、または逆向きになでて手を離すと、拍手を受け付けるようになります。拍手待ちの状態でもう一度なでて手を離すと、待機状態へ戻ります。

 モーターを動かすので、異音や発熱、想定外の動きがあればすぐに電源を切ります。実機を動かす前の準備や停止方法については、第2回の安全な書き込み手順も参照してください。

Codexの返答(要約)
最初に試すダンスは、90BPMのテンポに合わせて左右5度の範囲で首を振り、3秒間で終了するものにしました。
ダンス中は笑顔を表示してLEDを低い輝度で点灯させ、終了したら首を中央へ戻すとともに、通常の表情に戻してLEDを消灯します。

 ここでいう90BPMは、1分間に90拍を刻む速さです。まずは首の動きに注目して確認したいので、音の演出はあとから加えることにしました。こうして、頭なでから手拍子、ダンスまでをひととおり試せるようになりました。

 さっそく調整したいところですが、どのような仕組みで動いているのかも知っておきたいので、まずは作ってもらった処理の説明を聞いてみます。

生成されたコードの説明資料を作らせる

 Codexが生成したコードをどこまで詳しく把握するかは、作るものの用途によって変わります。例えば本連載のような趣味の試作であれば、まずは動かしてみて、気になった箇所から説明を聞くという進め方もできます。チームで開発する場合は、あとから別の人が変更を加えることもあるため、扱うデータや各機能の役割、状態の移り変わりなどを、チーム内で共有しておきたいところです。

 今回は、操作や見た目に関わる状態の移り変わりを確認するとともに、モーターをどのように動かしているのかも勉強したいと思いました。そこで、Codexに次のように依頼します。

プロンプト例
実装したコードを読んで、説明資料を作ってください。
操作や見た目に関わる状態の移り変わりと、モーターをどのように動かしているのかを知りたいです。

 実装前の計画と照らし合わせながら資料を読めば、作る予定だった機能が、実際にはどのような処理として実装されたのかを確かめられます。

 次の図は、実装した処理をもとに、頭なでや拍手によって状態がどのように切り替わるかを整理したものです。

待機から頭なでと離手で拍手待ちへ入り、4回の拍手でダンスし、終了後に拍手待ちへ戻る。拍手待ち中の頭なでと離手で待機へ戻る
待機から頭なでと離手で拍手待ちへ入り、4回の拍手でダンスし、終了後に拍手待ちへ戻る。拍手待ち中の頭なでと離手で待機へ戻る
Codexの返答(要約)
ダンスモードに入ると、4回の拍手の間隔からテンポを決め、そのテンポに合わせて踊ります。
ダンス中に自分が鳴らした音を拍手として拾わないよう、踊り始める前にマイクの入力を止めています。

 拍手を聞く時間と、音を鳴らして踊る時間を分けているわけです。

 ダンスが終了すると、首を中央へ戻し、通常の表情、LEDの消灯、音の停止を指示したあと、少し待ってから次の拍手を受け付けます。ダンスモードはそのまま続くので、毎回頭をなで直さなくても、手拍子をすれば続けて遊べます。ただし、踊っている間と、終了後に次の拍手を受け付けるまでの待ち時間には、頭なでによるモード切り替えを受け付けません。

 また、ダンスを実行する処理には、テンポと実行時間を引数として渡せるようにしています。これを利用して、拍手から起動するほかに、同じダンスを直接呼び出す開発用の設定も用意しました。この設定を使えば、調整のたびに手拍子をする手間を省き、同じテンポで変更前後の動きを比べられます。より詳しく知りたい場合は、コードと一緒に読める実装の構成とモーター駆動の説明も参照してください。

次のページ
「ぎこちない」を伝える ──感想ベースで動きを磨く

この記事は参考になりましたか?

「作りたい!」を形にする個人開発。AIと叶える「あなただけのスタックチャン」開発入門連載記事一覧

もっと読む

この記事の著者

石川 真也/ししかわ(シンヤ イシカワ/シシカワ)

 秋葉原のロボットスタートアップ企業で働くWebエンジニア。個人ではオープンソースのコミュニケーションロボット「スタックチャン」を企画・開発し、ハード・ソフト・デザインを横断した“誰でも作れて改造できるロボット”の世界観を発信している。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

CodeZine編集部(コードジンヘンシュウブ)

CodeZineは、株式会社翔泳社が運営する開発者のための情報メディアです。日々の開発に取り組むエンジニアやテクノロジーを学びたい方に向けて、プログラミングやAI活用、開発ツール、エンジニアの学びとキャリアに関する記事をお届けしています。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー