前回、M5 CoreInk で Hello World した続きです。

せっかくなのでAI開発

せっかくなので昨今話題の Cline と、claude 3.7 sonnet を使って開発してみます。

claude 3.7 sonnet の API key を準備

まずは Anthropic API に課金します。
手順は下記を参考にさせていただきました。
とりあえず$5だけ購入しました。

手順を参考に、API keyを発行しておきます。

Cline の準備

VS Code で Cline を使えるようにします。
拡張機能から Cline を検索、インストール。
インストール出来たら先程の API key を設定します。

詳しい手順はこちらの記事などを参考にさせていただきました。

Cline に M5 CoreInk へ天気予報を表示するように開発を指示

とりあえず作ってもらう

はじめに下記のようにタスクを実行して、開発してもらいました。
「M5 CoreInkで開発を行っています。天気予報を表示させるようにしたいです。」

途中、API は気象庁のものを使ってもらうように指示したり、更新間隔を3時間毎に指定しながら「Task Completed」となるまで繰り返しました。
そして5分程で完成。
完成したプログラムをデバックしたところ、なんと一発で通って、かつ書き込みも成功しました…すごい。

しかし、文字が豆腐になってしまっていたり、画面内に収まっていないため微調整しました。

微調整

豆腐の回避ですが、日本語で表示するとハマりそうだったので全て英語にしました。

画面内に収める調整が言葉だけでは難しく、写真を撮影して Cline に読み込ませて調整を試みました。
ハードを扱う開発では実機を確認しながらでないとデバックが難しいところは Cline も同じみたいです。

完成品

結果、完成したものが下記となります。
ちょっと表示が崩れていたり、?表記があったりと御愛嬌な部分がありますが、短時間でそこそこ動くものができまし

また、Cline READMEを書いてもらったので、冒頭部分を貼っておきます。

# M5 CoreInk 天気予報アプリケーション

このアプリケーションは、M5 CoreInkデバイスに京都府の天気予報を表示します。気象庁のAPIからデータを取得し、3日間の予報と気温、降水確率を表示します。

## 機能

- 京都府の天気予報を表示
- 3日間（今日、明日、明後日）の予報を表示
- 気温と降水確率を含む
- 3時間ごとに自動更新
- ボタン押下による手動更新
- M5 CoreInkの画面に最適化されたレイアウト

コストと時間

添付画像の完成品を作るまでに要したAPIの料金ですが、$1.7922でした。
ジュース1.5本くらいの値段です。

準備から完成までに要した時間は1時間くらいです。
Cline に作業したもらったのは30分程度でした。

感想

今回、あえての組み込み開発をしてもらいましたが、短時間で動くものができたのは驚きでした。
指示がイケてなかったので表示もイケてないですが、より丁寧に要件定義や設計をすることで、より高品質なものが作れそうです。
ただ正直、実用に耐えうるのかというと怪しいレベルでした。
ここはプロンプトの調整でいけるのか、Cline 然り Sonnet の限界なのかはもう少し触ってみる必要がありそうです。

次回、実用に耐えうるレベルにまで作り込みます。