Claudeでポモドーロタイマーを作ってみた｜プログラミング未経験の作業療法士の体験談

作業に集中しすぎて疲れてしまう自分のために、Claudeへ相談しながらポモドーロタイマーを作ってみました。

この記事では、Claudeにどのように希望を伝え、完成したタイマーを修正していったのか、プログラミング未経験者の体験をもとに紹介します。

HTMLファイルをパソコンで使う方法と注意点にも触れています。

既存アプリではなく、自分用のタイマーが欲しかった

効率的に作業を行うために、時間を区切って作業と休憩を繰り返す「ポモドーロ・テクニック」という方法があるのは知っていました。

ただ、既存のアプリやYouTubeの動画を探してみると、スマホアプリだったり、BGM付きだったり、デザインが自分好みではないものが多く、活用できていない状況でした。

私が欲しかったのは作業時間と休憩時間を知らせてくれるだけのシンプルなタイマーです。

AIに頼めば、このような小さなツールも作れると知り、Claudeという生成AIへお願いしてみることにしました。

Claudeの画面で作りたいものを伝え、生成されたコードとプレビュー画面を確認しながら作りました。

最初に伝えたのは、次の内容です。

HTMLとJavaScriptで、ポモドーロタイマーを作ってください。

すると、作業時間、短い休憩、長い休憩を切り替えられるタイマーが、実際に動く形で作られました。

一度で思い通りのものができるかというと、そうではありませんでした。

でも、プレビュー画面で実際に使ってみて、気になったところをそのまま伝えると、少しずつ直すことができました。

例えば、「パソコンで見ると小さいです」「色が暗いです」「音が短くて気付かない」など、普段の話し言葉で指示をするだけでAIが修正してくれました。

AIへ画面やコードを共有する場合は、個人情報、患者情報、APIキー、パスワードなどが含まれていないか確認してください。

AIとの一つひとつのやり取りは思いついたことをそのまま伝えただけです。

それでも自分専用のタイマーができあがっていました。

プログラミングの知識がほとんどない私でも、頭の中にあった「こういうものが欲しい」を実際に形にでき、完成して動いたときには、自分にもできるんだと嬉しくなりました。

作成したHTMLファイルをダウンロードしてパソコンへ保存しておけば、次回からそのファイルをブラウザで開いて使えます。

パソコンへ保存したHTMLファイルは、そのパソコンの中に置かれています。

ブラウザで開くと、アドレス欄に「file://」から始まる文字が表示されることがあります。

これは、インターネット上のページではなく、パソコン内のファイルを開いていることを表しています。

そのURLを他の人へ伝えても、相手のパソコンからファイルを見ることはできません。

ただし、HTMLファイルそのものを他の人へ渡すと、その人はファイルの内容を確認できます。

また、すべてのHTMLファイルが安全とは限りません。

自分で内容を確認できないファイルや、他人から送られてきたファイルを安易に開かないよう注意が必要です。

Claudeに日本語で希望を伝え、実際の動きを確認しながら修正を重ねることで、プログラミング未経験の私でも自分用のポモドーロタイマーを形にできました。

一度で理想どおりに作ることよりも、実際に使って気づいたことを「ここを直してほしい」と具体的に伝えることが大切でした。

AIを使えば何でも簡単に完成するわけではありませんが、日常の小さな不便を自分で改善する選択肢は増えたと感じています。

Claudeへ希望を伝えながら作ったポモドーロタイマーを公開しています。

作業時間、短い休憩、長い休憩を切り替えられます。開始、一時停止、リセットのほか、時間を変更する機能も付けました。

よければ、実際に使ってみてください。

このタイマーには、氏名やメールアドレスなどを入力する機能はありません。

時間などの設定は、使用しているブラウザ内に保存されます。

個人で作成した簡易的なツールのため、動作や継続的な公開を保証するものではありません。

予告なく内容を変更したり、公開を終了したりする場合があります。