組み込み未経験でもAIでロボットは動かせる?StackChanライブデモ #devio2026

組み込み未経験でもAIでロボットは動かせる?StackChanライブデモ #devio2026

DevelopersIO 2026 Tokyoの登壇内容です。M5StackとStackChanの基礎、Claude CodeでC++を書かずにロボットを動かしたライブデモ、現実世界へ広がる活用アイディアを紹介します。
2026.10.25

「動け…デモよ動け………お!?動くか!???」

先日のクラスメソッド主催イベントDevelopersIO 2026 Tokyoにおいて、「AIをリアル世界に解き放つ 〜M5Stack×AIであなたのアイディアを手の平に〜」というタイトルで登壇しました。

DevelopersIO 2026 | 圧倒的技術文化祭 | クラスメソッド

久しぶりの登壇、さらにがっつりデモもあるかなり綱渡りの登壇だったのですが、リアルなデバイスを前にしたVibe Codingによる挙動の変化を沢山の人にみていただき、喋っている自分も非常に楽しかったので、その登壇の様子をお届けします。

このブログを読むと、きっと皆さん「StackChan欲しい!!」という気持ちになること間違いなしです。

登壇概要「AIをリアル世界に解き放つ」

AIの登場で、私たちのソフトウェア開発は大きく様変わりしました。しかし、その変化はソフトウェアの世界に留まっていることが多いのではないでしょうか。

本セッションでは、AI活用のリアル世界への入口として、M5Stackのような小型デバイスに注目します。組み込みやIoTは、多くのWebエンジニアにとって馴染みの薄い技術スタックです。その壁を、AIがどのように吸収し、乗り越えさせてくれるのか——実際に光り、喋り、動くデバイスを題材に紹介します。

リアルタイムデモを中心に、みなさんとAIの可能性とワクワク感を一緒に体験出来る場となればと思います。

Agenda

会場の方にも参加してもらいたかったので、その場で案を募りながらの進行でした。なかなかスリルがありましたね!

  • M5Stackとは?
  • StackChanとは?
  • StackChanのカスタマイズ方法
  • ライブデモ(会場リクエスト求む)
  • 基本的なソースコードの構造解説
  • 追加のミニデモ(会場参加型)
  • 更なる活用のアイディア

M5Stackとは?

そもそも「マイコン」とは

slide12.png

M5Stackを理解するには、最初にマイコンの概念をおさらいしておく必要があります。

マイコン(マイクロコントローラー)は、特定用途に最適化された小さなコンピューターです。ポイントは3つあります。

  • 1つのチップに全部入り
    • CPU・メモリ・入出力の回路が、1つのチップにまとまっています
  • 電源オンですぐ動く
    • 書き込んだ1つのプログラムだけが動きます。OSは無いか、FreeRTOSのような軽量のものです
  • ピンから直接、電気を出し入れできる
    • LEDを光らせる、モーターを回す、センサーを読む、がプログラムから直接できます(GPIO)

家電・リモコン・おもちゃなど、身の回りのあらゆる機械に入っているのがマイコンです。

マイコンの代表格「ESP32-S3」

今回の主役であるStackChanの頭脳には、Espressif社のESP32-S3というマイコンが入っています。一般的なノートPCのCPUと並べると、性能の差は一目瞭然です。

一般的なノートPC(目安) ESP32-S3
CPU Intel/AMD(x86)、Appleシリコン(Arm) Xtensa LX7(x86でもArmでもない)
クロック 数GHz 240MHz
コア数 8〜十数コア 2コア
メモリ 16GB前後 内蔵512KB(+外付けPSRAM 8MB)
ストレージ SSD数百GB〜 フラッシュ16MB
OS macOS/Windows/Linux なし(またはFreeRTOS)
無線 別チップで搭載 Wi-Fi・Bluetooth LEを内蔵
外とのつながり USBなどの規格越し プログラムできるピン45本

内蔵メモリ512KBは、16GBのPCのおよそ3万分の1。それでも、顔を描いて、首を動かして、喋らせるには十分足ります。

ESP32-S3 | Espressif Systems

M5Stackは「マイコンを買ってすぐ使えるようにした開発キット」

slide15.png

では改めて、M5Stackとは何なのか。一言でいうと、マイコンを、買ってすぐ使えるようにした開発キットです。

ESP32-S3のようなマイコンは、数ミリ角のチップです。そのままでは基板を作って部品をはんだ付けしないと何もできません。M5Stackは、そこに画面・スピーカー・マイク・センサー・電池・ケース・Groveポート、さらにライブラリやボードパッケージまでセットにして、USBをつなげばすぐ動く形にしてくれています。

Webエンジニア向けにたとえるなら、マイコンがAppleシリコン(チップ)、M5StackがMacBook(製品)のような関係です。

M5Stackの製品は、同じESP32・同じ開発環境のまま、形の違うものがたくさん提供されています。

slide16.png

  • Core: CoreS3・Core2・Tab5。画面付きの定番
  • Stick: StickC-Plus・StickS3。持ち歩けるスティック型
  • Atom: AtomS3R・Atom Voice。約2.4cm角の極小サイズ
  • Cardputer: キーボード付き
  • Dial: 回すダイヤルのUI
  • E-Paper: PaperS3・CoreInk。電子ペーパー
  • AIハードウェア: Module LLM・LLM630。デバイス上でLLMを動かす

slide17.png

ちなみに、2026年5月に発売されたStopWatchという丸い有機ELの手の平デバイスも紹介しました。1.75インチの丸型有機ELタッチ画面に、マイク・スピーカー・6軸IMU・振動モーターまで入って39gです。このStopWatchを手に入れた経緯は、こちらのブログにも書いています。

M5Stack StopWatchで技適未取得機器の特例制度を使ってみた | DevelopersIO

Groveポートによる機能拡張

slide19.png

M5Stackのさらに素晴らしいところが、Groveポートによる機能拡張です。はんだ付けなしで、ケーブルを挿すだけでセンサーや部品を足せます。

ポートは色で役割が分かれています。

色 ポート 通信 主な用途
赤 Port A I2C 温湿度・距離などのセンサー
黒 Port B GPIO ボタン、アナログ入力など
青 Port C UART GPSなど(シリアル通信)

slide20.png

このポートに挿す拡張部品を、M5Stackでは「Unit」と呼びます。センサー、アクチュエーター、表示・入力、オーディオ、カメラ、無線・通信、拡張と、挿せば使えるUnitが大量にあります。この拡張性が、後半の活用アイディアにつながっていきます。

Grove | M5Stack Docs

StackChanとは?

slide22.png

StackChan(スタックチャン)は、顔があって、首が動く、手の平サイズのロボットです。中身はさっきのM5Stackで、画面が顔になり、サーボモーターで首を振ります。

コミュニティが育てたロボット

StackChanの面白いところは、その生い立ちです。

  • 2021年: 1人のOSS
    • Shinya Ishikawa(ししかわ)氏が個人のオープンソースプロジェクトとして公開しました
  • その後: みんなで育てる
    • 自作キットが広まり、AIで会話できるようになり、2023年には組み立てキットも発売。「#スタックチャン」でそれぞれのスタックチャンが共有されてきました
  • 現在: 公式製品に
    • M5Stackの公式キット(K151)として製品化されました

しかも、もともとのStackChanのファームウェアはJavaScriptで書かれていて、Web開発者が組み込みの深い経験なしに動かせることを狙って作られていたそうです(Hackaday.ioのプロジェクトページより)。今回のテーマを、5年前にすでに形にしていた人がいたわけです。ちなみに、今回のデモでStackChanの顔を描いているライブラリ(M5Stack_Avatar)も、作者のししかわ氏によるものです。

stack-chan/stack-chan | GitHub

公式製品化にあたっては、M5StackがKickstarterで「The First Co-Created Open-Source AI Desktop Robot」として支援を募り、4,141人が支援、目標額の約46倍が集まりました。コミュニティと共に作った(Co-Created)ロボットというわけです。

StackChan: The First Co-Created Open-Source AI Desktop Robot | Kicktraq

StackChanの中身

今回使った公式キットK151には、光る・喋る・動く・感じる・繋がる、が一通り入っています。

  • 動く: フィードバックサーボ2軸。水平360°・垂直90°で、今の角度も読めます
  • 光る: RGB LED 12個(左右6個ずつ)
  • 喋る: 1Wスピーカーとマイク2つ
  • 感じる: 頭の3ゾーンタッチ、0.3MPカメラ、9軸IMU、近接・照度センサー
  • 繋がる: NFC、赤外線、Wi-Fi。赤外線で家電も操作できます

頭脳はCoreS3(ESP32-S3)、画面は2.0インチ、バッテリーは550mAhです。

StackChan | M5Stack Docs

slide26.png

そして実は、StackChanは箱から出した時点で、もうAIロボットです。「Hi, StackChan」と話しかけると会話できるAIエージェントが入っていて、スマホアプリで名前・声・性格を設定したり、Home Assistant経由で家電を操作したりもできます。これ一つ買うだけで、やりたいことはほとんどできてしまいます。

ですが、今日はこのファームウェアを全部消して、AIで作ります。

StackChanのカスタマイズ方法

StackChanのいじり方は、実はいろいろあります。

方法 何を書くか Webエンジニアから見た距離
① 工場ファームのまま設定 書かない(スマホアプリ) 一番近い。設定の範囲まで
② UiFlow2 ブロック(MicroPython) 近い。ブラウザで完結
③ 元祖スタックチャン JavaScript/TypeScript 近い。npmで完結
④ Arduino(今日) C++ 遠い。C++・ボードパッケージ・ピン
⑤ ESP-IDF/PlatformIO C/C++ 一番遠い。本格的な組み込み

今回はあえて、④の「C++で直接書く」方法を選びました。理由は3つです。

  • 一番遠い道で証明したかった
    • ①〜③はWebエンジニアでも入りやすい道です。あえて遠いC++で「AIなら書ける」を見せたかった
  • ハードを全部触れる
    • 公式ライブラリで、首・LED・タッチ・NFC・赤外線まで直接扱えます
  • ターミナルで完結する
    • arduino-cliを使うので、Claude Codeがビルドから書き込みまで自走できます

CPUの種類が違うためクロスコンパイルが必要

C++で書く場合、最初の壁になるのがビルド環境です。Mac(Appleシリコン=Arm)とESP32-S3(Xtensa LX7)はCPUの種類が違うので、Macでビルドしたものはそのままでは動きません。ESP32向けに変換するクロスコンパイルが必要で、そのための道具一式が「ボードパッケージ」です。

ボードパッケージの中身を、Webの道具にたとえるとこんな感じになります。

中身 実物 Webで言えば
クロスコンパイラ xtensa-esp-elf-gcc / g++ tsc
コア Arduino.h + ESP-IDF(SDK) Node.js
ボード設定 boards.txt / pins_arduino.h 設定ファイル
書き込みツール esptool デプロイ

ビルドのコマンドは次のような形です。--fqbnは「パッケージ:チップ系統:ボード」の指定です。

arduino-cli compile --fqbn m5stack:esp32:m5stack_cores3 sketches/stackchan_base

Webエンジニアが組み込みで最初につまずくのは、だいたいこの環境づくりです。今回は、これもClaude Codeに「M5CoreS3でビルドしたい」と頼んで整えてもらいました。

Groveポート接続機器の制御もAIにお願いできる

Groveポートに挿すUnitの種類は膨大ですが、今はライブラリの選定からコードを書くところまで、AIにお願いできます。M5Stackには、どのUnitも同じ書き方で扱える共通ライブラリ(M5UnitUnified)も用意されています。

たとえば「CO2センサーのUnitを挿して、1000ppmを超えたら困った顔をして」と頼めば、ライブラリ探しからコードまでAIが書いてくれる、というイメージです。部品を足すたびに覚えることが増えるのが組み込みの大変さでしたが、そこをAIが肩代わりしてくれます。

m5stack/M5UnitUnified | GitHub

ライブデモ

slide34.png

ここからがお待ちかねのライブデモです。Vibe Codingで進めるので、無事完走するかどうかは皆さん次第。

流れは次の3段階です。

  • デフォルト: 頭をタップすると、うなずいて挨拶する最初の状態
  • ラウンド1: セリフと動きを変える
  • ラウンド2: 会場リクエストを、その場で作る

会場リクエストのメニューとして、表情(笑顔/怒り/悲しみ/困惑/眠い)、セリフ(何でも)、首の動き(うなずく/首を振る/見回す/踊る)、LED(色・点滅・虹色)を用意しておきました。

デフォルト

最初の状態は、頭をタップすると、うなずいて「こんにちは、スタックチャンです。よろしくね」と挨拶するだけのシンプルなものです。ここから、Claude Codeに日本語でお願いしていきます。

ラウンド1: セリフと動きを変える

Claude Codeに送ったのは、こんなお願いです。

今からセリフを「DevelopersIOにようこそ。」としてください。また、もっとテンション上げて下さい。

Claude Codeは、セリフの音声を少し早口・高めの声で作り直し、動きも合わせて変えてくれました。書き込み後のStackChanは、虹色に光りながら弾むように2回うなずき、「DevelopersIOにようこそ!」と喋ったあと、喜んで首を左右に振ります。

「テンション上げて」という、かなりふわっとしたお願いでしたが、声の速さと高さ、LEDの虹色、首の動きの大きさに落とし込んでくれたのが印象的でした。

ラウンド2: 会場リクエスト

続いて、会場からのリクエストです。

頭を触ったら、ちょっと考えてから「なんでやねん!!」と、できるだけテンション上げて騒いで下さい。

書き込み後のStackChanは、頭を触るとこんな動きをします。

  1. 考える: 困った顔で首をかしげ、青く光って「うーん……」
  2. 騒ぐ: 怒った顔に変わり、赤と黄色に激しく点滅しながら、首を大きく左右に振って「なんでやねん!!」
  3. 落ち着く: 正面に戻って笑顔に

ちなみに、ラウンド1の「ようこそ」は消さずに、頭をスワイプすると出るように残してくれていました。こういう気の利かせ方も、AIならではだなぁと思います。

依頼してから実機が動くまでは、1回あたり約1分。その間、私は1行もC++を書いていません。

基本的なソースコードの構造解説

デモで何が起きていたのかを、ソースコードの構造から振り返ります。

開発の全体像

slide37.png

流れはとてもシンプルです。

Claude Code(日本語で依頼)
  → arduino-cli(ESP32向けにビルド)
  → USBケーブル(書き込み)
  → StackChan(光る・喋る・動く)
項目 値
ボードパッケージ m5stack:esp32 3.3.10
ライブラリ M5StackChan 1.1.1(首・LED・タッチ)、M5Stack_Avatar 0.10.0(顔)
かかる時間 ビルド約10秒+書き込み約9秒。AIの作業込みで1回約1分

デモに使ったコードは、GitHubで公開しています。

HamadaKoji/stackchan-demo | GitHub

スケッチの基本形:setupとloop

Arduinoのプログラム(スケッチ)は、「起動時に1回」と「ずっと繰り返す」の2つだけでできています。

void setup() {
  M5StackChan.begin();  // 初期化
  avatar.init();        // 顔を出す
}

void loop() {
  M5StackChan.update();
  if (TouchSensor.wasClicked()) {
    greet();            // 挨拶する
  }
}

setup()はWebで言えば初期化処理、loop()はイベントループのようなものです。ブラウザがイベントを待ってくれる代わりに、自分で「触られた?」を毎回見に行きます。

光る・喋る・動く・顔は、それぞれ数行

面倒なハードウェアの部分は、ライブラリが全部隠してくれます。

やりたいこと コード メモ
首を動かす Motion.moveYaw(300, 400); 10=1度、速さ0〜1000
首を傾ける Motion.movePitch(500, 300); 上下は5〜85度で
LEDを光らせる setRgbColor(0, 168, 0, 0); 12個を番号で指定
表情を変える avatar.setExpression(Happy); 6種類
吹き出し avatar.setSpeechText("…"); 日本語OK
喋る M5.Speaker.playWav(voice, len); WAVを再生
撫でられた? TouchSensor.wasClicked(); スワイプも区別

喋る仕組み:Macの音声合成を埋め込む

StackChanの声は、クラウドもAPIキーも使っていません。セリフをMacのsayコマンドで音声にして、16kHz・16bitのWAVに変換し、C++の配列としてファームウェアに埋め込んでいます。

2〜3秒のセリフで約100KB。フラッシュ16MBに十分入りますし、会場のWi-Fiが不安定でも喋れます。その代わり、セリフはビルドのときに決まります。その場で考えて喋らせたいなら、LLMとつなぐ必要があります(これは後半の活用アイディアで)。

AIへの取扱説明書:CLAUDE.md

今回のVibe Codingを支えていたのが、リポジトリに置いたCLAUDE.mdです。

  • デバイスの仕様(首の可動範囲、LEDの数など)
  • 進め方(ビルドと書き込みまで自分で実行して終える、会場で投影されるので返答は短く)
  • ビルド・書き込みのコマンド
  • セリフの音声の作り方

これを書いておくだけで、「セリフを変えて」の一言で、音声データの生成、コードの修正、ビルド、書き込みまでをClaude Codeがやり切ってくれます。首を85度より上げると機構に負担がかかる、といったことはAIは知りませんが、書いておけば守ってくれます。今回改めて感じたのは、コンテキスト設計は、組み込みでもそのまま効くということです。

AIが書いたコードの例

実際にラウンド2でClaude Codeが書いた「なんでやねん」のコードの一部がこちらです。

// 頭を触ったら: ちょっと考えてから「なんでやねん!!」と騒ぐ
void nandeyanen()
{
    // 考える: 困った顔で首をかしげ、青く光る
    avatar.setExpression(Expression::Doubt);
    setLeds(0, 0, 168);
    M5StackChan.Motion.move(150, kPitchCenter + 150, 300);
    speak(voice_hmm, voice_hmm_len, "うーん……");
    delay(800);

    // 騒ぐ: 赤と黄色に激しく点滅しながら、首を大きく振って「なんでやねん!!」
    avatar.setExpression(Expression::Angry);
    avatar.setSpeechText("なんでやねん!!");
    M5.Speaker.playWav(voice_nandeyanen, voice_nandeyanen_len);
    for (int i = 0; i < 6; i++) {
        M5StackChan.Motion.moveYaw(i % 2 ? -400 : 400, 900);
        // ...(LEDの点滅と口パク)
    }
    // ...(落ち着いて笑顔に戻る)
}

自分では1行も書いていません。でも、読めば何をしているかは分かります。「読めるけど書けない」を、AIが埋めてくれる感覚です。

追加のミニデモ

後半は、StackChanをAPIやWebとつなぐ「追加のミニデモ」です。どちらもWi-Fiにつないで動かします。

curlでロボットを動かす

1つ目は、StackChanに小さなHTTPサーバーを立てて、いつものcurlで物理世界を動かすデモです。

curl http://stackchan.local/alert                # 首を振って赤く光る「アラートだよ!」
curl http://stackchan.local/ok                   # 虹色に光って「解決したよ」
curl "http://stackchan.local/say?text=こんにちは"  # 吹き出しに好きな文字

Webエンジニアが毎日使っているcurlで、ロボットが首を振る。これをGitHub ActionsやCloudWatchのアラートにつなげば…と、想像が広がりませんか?

GitHubのスターで喜ぶ

2つ目は会場参加型です。StackChanがGitHub APIでデモのリポジトリのスター数を定期的に確認し、スターが増えると虹色に光って踊り、「スターありがとう!」と喋ります。

デモ用のファームに切り替えた時点で、リポジトリにはすでにスターが4つ付いていました。ここで、スターが増えたときだけ喜ぶ動きを、その場でこう変えてもらいました。

スターが0から1になったときだけ喜ぶ気がしてます。もう、スターがあったら、無条件で喜び続けて

結果、スターが1つでもあれば2秒おきに喜び続ける、とにかく嬉しそうなStackChanが誕生しました。

よかったら、皆さんもスターを付けてあげてください。

HamadaKoji/stackchan-demo | GitHub

更なる活用のアイディア

slide50.png

最後に、StackChanでできることの広がりを紹介しました。

StackChanはWi-Fiでつながるので、APIを叩いて天気や予定を喋る、Webhookを受けて首を振る、センサーの値をクラウドに貯めて可視化する、LLMを呼んでその場で考えて話す、といったことができます。普段のWebのスキルが、そのままリアル世界の出口になるわけです。

個別の機能だけでも、たとえばこんなアイディアが考えられます。

  • CIの相棒: ビルドが落ちたらうなだれる
  • アラート係: 監視のアラートで首を振る
  • 会議の秘書: 次の会議を読み上げる
  • 話し相手: LLMと会話する
  • 受付ロボ: 人が来たら挨拶する
  • スマートリモコン: 赤外線でエアコンをつける
  • 入退室チェック: 社員証(NFC)で名前を呼ぶ
  • オフラインAI: Module LLMでデバイス上でLLMを動かす

その中から、具体的な4つの例を紹介しました。

例:AIエージェントの机上の相棒

Claude Codeに大きめの修正を頼んで席を立ち、戻ってくると、StackChanが困った顔で青く光って「ねえ、ファイルの削除していいか聞かれてるよ!」と教えてくれる。許可して数分後には、虹色に光って「終わったよ!テストも全部通ったって!」。

Claude Codeのhooksから、ミニデモと同じcurlでStackChanを動かすだけで実現できる構成です。hook起点で動かすことで、ITの結果を受け取って現実世界の動作につなげることが簡単にできます。

例:部屋の「AI執事」になる

帰宅して「ただいま、暑い…」とつぶやくと、「おかえり!室温29度だね。冷房を26度でつけるね」と答えて、赤外線でエアコンが「ピッ」と鳴る。

マイクで聞き取った言葉をLLMが解釈し、温湿度センサーを読む、赤外線を送る、カレンダーAPIで予定を調べる、といった道具を自分で選んで使う。考える頭はLLM、現実世界への手は赤外線です。これはLLMのtool useそのもので、道具の中身がWeb APIから赤外線やセンサーになっただけ、と考えるとWebエンジニアにもイメージしやすいと思います。

例:Unitを足すと腕が生える

サーボドライバのUnitを足せば、首と画面だけだったロボットに腕が生えます。距離センサーで人が近づいたことに気づいて振り向き、小さな腕で手を振って「いらっしゃい!セッション会場はあっちだよ」と方向を指し示す。腕の身振りも、話す内容に合わせてAIに決めさせられます。

例:Unitを足すと工場の見守りロボ

最後は、私の仕事に一番近い例です。RS485のUnitで工場の機械(PLC)とつなぎ、ラインの横で機械を見守る。3号機の温度がじわじわ上がり始めると「3号機、いつもより温度が高いよ」と作業者に声をかけ、事務所の保全担当のスマホにも通知を飛ばす。

ハードの信頼性の問題があるので、このまま工場で使えるわけではありません。ただ、概念実証としては十分に検証の余地があると考えています。

まとめ

StackChan自身や、そこから派生する各種センサーを使うと、ITだけではない世界への拡張が見えてきます。

慣れないデバイスや言語、ライブラリでも、生成AIがあればVibe Codingできる。ソフトウェア開発の外に出ると、リアル世界への可能性が見えてくる

今回、組み込みの経験がほとんどない私が、C++を1行も書かずに、会場のリクエストに応えてロボットを動かせました。マイコンのメモリはPCの3万分の1で、CPUの種類も違う。それでも、AIにデバイスの事情を教えてあげれば、日本語のお願いだけで光る・喋る・動くまで届きます。

ぜひ皆さんも、StackChanを手に入れて、AI活用の新しい地平を切り開いてみてください。

登壇後記

デモが多くて本当に完走できるんかな?と思いながら準備した登壇でしたが、途中いくらかトラブルはありつつも、なんとか無事に終えることができました。広い会場での登壇だったので、WebカメラとStackChan用のマイクを用意して、できるだけその動きをリアルに皆さんにお届けすることができたのも良かったです。

ほとんど今の仕事に関係ない登壇だったのですが、自分自身も非常に楽しい登壇になりました。AIによるVibe Coding。こういうリアルデバイスを相手にするのもめっちゃ楽しいと思うので、この記事をみて気になった方は、是非チャレンジしてみて下さい。

それでは今日はこのへんで。濱田孝治(ハマコー)でした。


Claudeならクラスメソッドにお任せください

クラスメソッドは、Anthropic社とリセラー契約を締結しています。各種製品ガイドから、業種別の活用法、フェーズごとのお悩み解決などサービス支援ページにまとめております。まずはご覧いただき、お気軽にご相談ください。

サービス詳細を見る

この記事をシェアする

AI白書

関連記事