おもちゃの「へぇボタン」をIoT化してみた

## はじめに
とあるIoT系コミュニティのイベントの協賛品としておもちゃの「へぇ〜ボタン」をIoT化して提供しました。

![heibutton.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/83f4ad77-9ef4-bfb8-0389-bebead7da597.png)

この「へぇ〜ボタン」ですが、平成時代に流行った「トリビアの泉」という番組内で使われていたボタンがおもちゃになったものです。押すと「へぇ〜」と音が鳴って、番組のボタン同様に押した回数が表示されます。

当時は持っているだけで周りから崇められるようなおもちゃだったのは知る人ぞ知るところだと思います。

https://ja.wikipedia.org/wiki/%E3%83%88%E3%83%AA%E3%83%93%E3%82%A2%E3%81%AE%E6%B3%89_%E3%80%9C%E7%B4%A0%E6%99%B4%E3%82%89%E3%81%97%E3%81%8D%E3%83%A0%E3%83%80%E7%9F%A5%E8%AD%98%E3%80%9C

## ネタか技術か
イベントでの協賛品ということもありますが、今回このおもちゃで一番実現したかったのが、ボタンを押したときに「へぇ〜」という音が鳴ると同時にSlackの記事に対して「へぇ〜」のカスタムアイコンでのリアクションすることです。

![heisetu.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/61c6a2f9-0514-eee8-9b84-a127cc36f4f6.png)

こうやって書きますと単なるネタ記事ですが、この取り組みというかプロジェクトの中で実装していったことを切り出してみると、ソフトウェアに関連する部分が思いのほかQiita的な技術情報となりましたので、こちらは別立てで共有いたします。

この記事では今回やったことと最終形を少しハード寄りな観点でご紹介いたします。

## 実現した機能
今回実装した機能がこちらになります。

* 「へぇ〜ボタン」を押したときにSlackの投稿に対して「へぇ〜」のカスタムアイコンでリアクション
(BOTのような第三者的な動きではなく**ユーザ自身**のリアクション)
* Slackの投稿を監視して新しい投稿があれば、ボタンの周りに付いているLEDを点滅させて新規投稿があることを通知
* ボタン操作だけではなくスマホとBLE接続してリモートで「へぇ〜」と鳴動
* 「へぇ〜」カウンタの自動リセット
(ボタン押した回数が7セグに表示されますが値をリセットするにはリセットボタンを押す必要あり)

「へぇ〜」アイコンでリアクションさせる以外にもIoT機器ならではの機能を実装しています。まずはこれらの機能から必要とされる技術要素を汲んでいただけたらと思います。

## 開発環境
おもちゃをIoT化するにあたり小型で手頃なCPUボードがないか探していたところ、下記ESP32系のボードが手頃でかつ同ボード上で動くMicropythonでやりたいことが手軽に実装できそうだったので今回採用しました。
<dl>
  <dt>CPUボード</dt>
  <dd>ESP32-DevKitC-32E</dd>
  <dt>開発言語</dt>
  <dd>Micropython</dd>
  <dt>IDE</dt>
  <dd>Thonny</dd>
</dl>

## ハードの分解と解析
「へぇ〜ボタン」のおもちゃをIoT化するにも中身のハードウェア構成や配線状況がわかっていないと何もできないので少々バラしてみました。

![heibutton2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/b2c50c82-391c-8423-2d4c-a064b4fe0dd9.png)

さらに、基板上の配線を確かめるためにワイヤー類を外した状態がこちらになります。
カウンタの7セグが付いている基板にBOCが載っているのがわかります。

![kiban.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/e0d25936-6b15-77ed-c9c1-72682eae3251.png)

上記写真の基板では5ピンコネクタを外してしまっていますが、もともとはこの基板の5ピンコネクタを介して上部のボタン内の基板と接続されていました。
基板のパターンを追いかけて起こした回路図がこちらです。

![schema1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/c5966c2f-637e-0942-c736-ae9413344584.png)

7セグ(U2)周りやスピーカ周辺はかなり端折って書いています。
BOC(U1)から見た信号の入力系と出力系は回路図から以下のようになると推測されます。

<table>
  <caption>入力系</caption>
  <thead>
    <tr>
      <th>制御部位</th>
      <th>BOC端子</th>
      <th>動作</th>
    </tr>
  </thead>
  <tr>
    <td>上部のボタン</td>
    <td>SW</td>
    <td>通常LOW、ボタン押下時HI<br>上部のボタン内部にはSW1〜SW4の<br>4つのスイッチがある</td>
  </tr>
  <tr>
    <td>カウンタリセットボタン</td>
    <td>RST</td>
    <td>通常HI、ボタン押下時LOW<br>BOCのリセット入力に直結されている模様</td>
  </tr>
</table>

<table>
  <caption>出力系</caption>
  <thead>
    <tr>
      <th>制御部位</th><th>BOC端子</th><th>動作</th>
    </tr>
  </thead>
  <tr>
    <td>7セグカウンタ</td><td>(端子名は割愛)</td><td>PWMで各セグメントを制御</td>
  </tr>
  <tr>
    <td>スピーカー</td><td>AUDIO</td><td>音声信号出力</td>
  </tr>
  <tr>
    <td>上部ボタンのLED</td><td>LED</td><td>LOW出力時LED消灯、HI出力時LED点灯</td>
  </tr>
</table>

## IoT化のための改造ポイント
IoT化するために次のような方針で改造を行いました。
* 7セグと「へぇ〜」の音声出力はBOC制御のまま(このまま使ったほうが一番安全)
* 上部ボタンやカウンタリセットボタンの入力はESP32側で受けて、もともとBOCが受けていたボタン入力部へ代わりにESP32側から信号出力
* LED制御はESP32側へ移行

## 実際に行った主な回路変更
回路の構成や電圧の違い加味して以下のように回路変更を行っていきました。

#### 電源
おもちゃ自体はもともと単三電池3本(4.5V)で動くようになっていましたが、ESP32を使うということもありESP32のVBUS(5V)で動作するように電源周りを改造しました。

#### LED制御
単にLEDの制御ラインをESP32に切り替えただけでは、ESP32の出力が3.3V系なので、一石入れてVBUS(5V)相当の電圧で出力するようにしました。結果的に、ESP32からVBUSの電圧レベルでPWM出力できるようになりました。

#### カウンタのリセットボタン制御
ESP32がリセットボタンの入力を受けて、代わりにESP32からBOCにリセット信号を出力するようにしました。念の為、ESP32からのHI出力時はオープンドレイン出力になるように設定しています。

#### 上部ボタン制御
ESP32側がボタンの入力を受けるようにしますが、ボタンの入力信号はVBUS相当の電圧で入ってくることになるのでESP32の入力手前で抵抗分割して3.3V相当で受けられるようにしました。

#### おまけの改造
おもちゃの底に電池をON/OFFするためのスライドスイッチがありましたが、今回は全体がVBUSの電源で動作するようになるためスライドスイッチがあまり意味をなさなくなってしまいます。そこで、このスライドスイッチをスピーカへの音声信号のラインに挟むことでミュートスイッチのような動きをするように改造しました。

#### 最終的な回路図

最終的にでき上がった回路図がこちらになります。
(ハード設計は本業ではないので配線が確認できるレベルで書いています。ご容赦ください。)

![schema2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/b4f4fdee-cdbd-e209-defe-92c0b7bb4b26.png)

## 改造工程
こんな感じで改造を行っていきました。
(画像が少ないので雰囲気だけでも掴んでいただけると幸いです)
#### 基板スペース確保のため電池ボックス部を分離
![kaizo1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/7b81e4db-1a30-e2e5-c316-ebe41cf9d2b9.png)

#### 電池ボックスのあったスペースにユニバーサル基板を配置
![kaizo2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/9a6bf251-a1c9-ad9c-2042-023421e83b9d.png)

#### ESP32-WROOMの基板実装と配線
![kaizo3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3763691/dc36b545-7e1d-835e-35bc-1d28ec1b0368.png)

すべて手配線なのでアレですが、こんな感じで改造を行っていきました。
ハード改造後、ソフトを実装すれば完了です。

## 完成品の動き

#### 自動カウンタリセット
<iframe width="640" height="320" src="https://www.youtube.com/embed/7dwm8u6-GrU" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" loading="lazy" allowfullscreen></iframe>

ボタンを押した後に、ESP32からのソフト制御でリセット信号を出してカウンタをリセットしています。

#### LEDの点滅
<iframe width="640" height="320" src="https://www.youtube.com/embed/4_WAnagdErI" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" loading="lazy" allowfullscreen></iframe>

最終的にESP32からVBUS相当の電圧でPWM出力ができるようになっているので、点滅もPWM制御でじんわり点滅できるようにしています。

#### スマホからのリモート操作でSlackに「へぇ〜」でリアクション
<iframe width="640" height="320" src="https://www.youtube.com/embed/q7GFcyjqJzs" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" loading="lazy" allowfullscreen></iframe>

スマホ側とBLEで接続しておくことで、スマホからのリモート操作で「へぇボタン」のボタンを押したときと同じ動作をができます。

このとき、Slackの指定チャンネルに新着投稿があれば「へぇ〜」のアイコンで「リアクション」もできます。

## 最後に
今回作ったIoT化「へぇボタン」をハードウェア寄りな観点で紹介させていただきました。
ソフトウェア寄りな技術条項は別立て共有したいと思います。

## 関連技術情報

https://qiita.com/aramss/items/982906d1a8441c5a2729

https://qiita.com/aramss/items/dfaf8b174ac915c559f6

https://qiita.com/aramss/items/0c92f4161b3765d4a5d5