はじめに
唐突に「あー！７セグに、なんでも鑑定団みたいな感じで数字を表示したい！！！ 気温とか出したい！！！」
と思うこと、人生に５度ぐらいは有ると思います。
『開運なんでも鑑定団』にレコード鑑定士として出演いたします！ | COCONUTS DISKより引用
とは言ってもモノホンの７セグメントディスプレイはハードウェア制御が絡み、 表示させるところまでが色々と面倒です。
しかし近日、弊社ビット・トレード・ワンより、
USB経由のシリアル通信だけで英数字等の表示が可能なAD7SGPRという製品が出ます。
マイコンにRP2040、7セグドライバにTM1638を使用しています。回路図等Githubで公開中
USBシリアル通信だけで文字を表示できるので、WEBSerialAPIを使用すれば、
ブラウザ上で様々なAPIから引っ張ってきた数字を7セグに表示することとかが可能です。
ブラウザで作成すればマルチプラットフォーム対応にもなりますし。
接続イメージ
本記事ではAD7SGPRを使って東京の気温を7セグで表示するwebアプリを
GPT4に書いてもらいます。
ソースを持って来てGPTにコーディングさせる
いくらGPT-4にコーディングしてもらうとしても中々面倒な作業です。
そこで骨となるソースコードを用意します。
弊社からAD7SGPRでyoutubeチャンネル登録者数が表示できる
WEBアプリがMITと同等のライセンスで公開されているため、
このコードのSerial通信部分などは流用し、APIから値を取ってくるところだけを書いてもらいます。
私は曖昧な指示をしてAI(部下)が面白いものを作ってくれるのを待つという、
庵野秀明氏にしか許されない方法でAIに成果物を作ってもらうのが好きなので、
天気を取得するAPIを指定しないで作ってもらうことにしました。楽ですしね。
GPT-4への指示
以下のようにGPT-4に指示をしました。
「以下はyoutubeのチャンネル登録者数を所得し、 その数をシリアル通信で送信するwebアプリのソースです。コレのyoutube登録者数取得部分を 東京の気温を取得するAPIに置き換えてください。
<サンプルソースをベタ貼り>」
簡単なwebアプリの場合、HTML,CSS,JSがそれぞれ別ファイルになっていないものを渡したり、出力してもらうのが楽です。
私の中々に大雑把な指示を元に、GPT-4は返信でソースを書いてくれました。
優秀ですね。 後は動くかを確認し、エラーコードなどが出た場合はGPT-4に報告し、仕上げていきます。
今回のやり取りはこちらからご覧いただけます。
(最後の方なんてこの記事の雛形書かせてます......)
完成物
動作の様子
Appの画面
ソースを提示したことも有り、
試行錯誤も合わせて10回程度の会話ラリーで
webアプリから7セグにAPIの値を表示させることに成功しました！
APIキーと頻度を設定すると東京の気温を取得し、
シリアル接続ボタンからAD7SGPRと接続を行うと値を表示できます。
(なんでも鑑定団風のアニメーションは本体側のファームウェアで実現しています。電源起動時のデフォルトでは値表示前のアニメーションは無しになってます。)
本WEBAppをGtihubにソースを上げたので閲覧はこちらからどうぞ。
皆様も7セグ表示欲が出てしまった際はこの記事を参考にしてください。
以上です。