500種類の時計をすべてClaudeが作った、江戸の和時計から俳句の時計まで1つのWebページに

3行でわかる
- トム・ギャリー氏がClaude Opus 5.5に、時刻の見せ方がすべて違う500種類の時計を作らせ、Webページ1枚で無料公開した
- 江戸時代の和時計、縦書きの漢数字、毎分変わる俳句、テレビゲーム風など9分野に分かれ、コードと解説文はすべてClaudeが書いた
- Claudeが自分で作業を分けて複数のAIに並行で作らせ、出来の悪い時計は作り直させた。4回の会話で合計約18時間かかった
トム・ギャリー(Tom Gally)氏は日本時間10月18日、AnthropicのAI「Claude Opus 5.5」に作らせた500種類の時計を、1つのWebページ「Five Hundred Clocks」にまとめて公開しました。どの時計も今の時刻を違う方法で表示し、プログラムも解説文もすべてClaudeが書いています。ギャリー氏は指示を出して結果を確かめただけで、コードには一切手を入れていません。
何を作ったか
ページを開くと、小さな正方形の時計が壁一面に並びます。数字の針の時計だけではありません。2進数で光るランプ、昔の電信の暗号、細胞が増えたり消えたりする模様、宇宙の星の動きなど、時刻の「読み方」そのものが1つずつ違います。マウスを乗せると名前と一言の説明が出て、クリックすると拡大して「読み方」と「仕組み・歴史」の解説が読めます。
日本に関わる時計もあります。江戸時代の「和時計」は、昼と夜をそれぞれ6つに分け、季節によって1刻の長さが伸び縮みする当時の時刻の数え方を再現しています。ほかにも、和紙に墨で縦書きした漢数字の時計や、1分ごとに五・七・五の句が書き換わり、真ん中の句が今の時刻を詠む「俳句の時計」があります。
ページのコードを数えると、時計は「言葉」「機械」「歴史」「ゲーム」「数学」など9つの分野に50個前後ずつ分かれていました。ページの上部では分野で絞り込んだり、時間を最大3,600倍の速さで進めたりできます。
驚くのは作りの小ささです。画像ファイルは1枚もなく、すべての絵はブラウザーの中でプログラムが描いています。ファイルを手元に保存すれば、ネットにつながっていなくても動きます。
The whole gallery is one self-contained HTML file. It uses no external libraries, fonts, images or network requests, and it runs when opened directly from disk.
ギャラリー全体が、それだけで完結した1つのHTMLファイルです。外部のライブラリー、フォント、画像、通信を一切使わず、手元のディスクから直接開いても動きます。
原文を読む(github.com)ファイルの大きさは6.3MBで、スマホで撮った写真1〜2枚分ほどです。
どう作ったか
作業はClaudeのチャット画面で進めました。9月にまず「100個の時計」を試し、10月15日から18日にかけて、会話を4回に分けて100個、240個、380個、500個と増やしています。最初の会話では、6つの分野と具体例を挙げた詳しい仕様書を渡しました。2回目以降は「これまでと重ならない、独自で美しい時計を140個足して」といった短い指示を出し、デザインの判断はClaudeに任せています。
Claudeの働き方は「現場監督」に近いものでした。Claude自身が仕様と担当の割り振りを書き、別のClaude(サブエージェント=手分けして作業する子分のAI)を同時に何体も動かして、1体あたり約20個ずつ時計を作らせます。出来上がった時計は自動でブラウザーに表示して画面を撮り、Claudeが一覧で見て「小さいと読めない」ものなどを作り直させました。最後の回では、新しく作った120個のうち14個が差し戻されています。
使った量も公開されています。
| 回 | 時計の数 | かかった時間(目安) |
|---|---|---|
| 1回目(10月15日) | 100個 | 約8時間(中断で約3時間を失った) |
| 2回目(10月16日) | 240個 | 約3.5時間 |
| 3回目(10月16日) | 380個 | 約4.25時間 |
| 4回目(10月17〜18日) | 500個 | 約2.25時間 |
合計は約18時間で、子分のAIが処理した文字の量(トークン)は約1,400万〜1,500万と見積もられています。ギャリー氏はほとんどの時間、その場にいなかったと書いています。費用について聞かれたギャリー氏は、Hacker Newsで、定額の「Max」プランの1週間分の利用枠を大きく使ったと答えています。Maxは月100ドルからのプランです(Claudeのプランの記事)。
なお、この説明文(README)もClaudeが書いたものです。ギャリー氏は役割分担をこう明記しています。
Tom wrote the prompts, reviewed the results and decided what to keep; he did not write or edit the code.
トムは指示を書き、結果を確かめ、何を残すかを決めた。コードを書いたり直したりはしていない。
原文を読む(github.com)反応
Hacker Newsのコメント欄では、ポン(テニスゲーム)の時計や、文章を読み進めるゲーム風の時計を気に入ったと挙げる人がいました。一方で、8割は見た目が良くないので数を絞るべきだという意見や、よくできた作品の安い模造品に見えるという厳しい感想も出ています。ギャリー氏も、ゲームを使った時計など同じ発想が繰り返されている点は認め、荒い案は手直しが要るとしたうえで、発想のほぼすべてがAIから出てきたことを考えれば見事な出来だと書いています。
Claudeに遊び心のあるものを作らせる例は、AIデジマでもiPhoneアプリで木の間違い探しゲームを作らせた例を紹介しました。今回は、1つの作品ではなく「500個を自分で手分けして作り、点検し、作り直す」という段取りまでAIが担った点が違います。
日本のビジネスへの影響
使えるか: 同じことは日本からClaudeの有料プランで試せます。Claude Opus 5.5は月20ドルのPro以上で使え、チャット画面は日本語に対応しています。ギャリー氏は、次の回で使う指示文や手順書、作った時計の一覧を「キット」としてGitHubで無料公開しており、ライセンスはCC0(権利を放棄し、誰でも自由に使える形)です。
誰にどう効くか: 展示会やWebキャンペーンの企画担当、教材を作る教育担当に向いた例です。「同じテーマでバリエーションを大量に出し、AIに自分で品質を点検させる」という進め方は、時計に限らず、診断コンテンツやミニゲーム、説明用のアニメーションの量産にそのまま応用できます。
今すぐやれること: まず仕様を細かく書いた1回目の指示で10〜20個を作らせ、気に入ったら「これまでと重ならないものを足して」と短く頼む、という2段階の進め方を真似してみるとよいでしょう。チャット向けAIの選び方はチャットAIのおすすめと料金比較にまとめています。
注意点: 量が増えるほど質はばらつきます。コメント欄の指摘どおり、500個のうち人に見せられるものは一部かもしれず、最後に選ぶのは人の仕事です。解説文にも誤りが残りうるとギャリー氏自身が断っており、社外に出すなら事実の確認は欠かせません。使う量も大きく、定額プランの利用枠を早く使い切る点にも気をつけたいところです。
一次情報
- 公式サイトGitHub tkgally/500-clocksFive Hundred Clocks(README)
- 公式サイトtkgally.github.ioFive Hundred Clocks(ギャラリー本体)
- コミュニティHacker NewsShow HN: 500 clocks in one 6.3 MB HTML file by Opus 5.5
AIデジマは、公式発表・X投稿・論文などの一次情報を起点に、複数の情報源を照合して日本語でまとめています。情報の収集・翻訳・下書き・照合にはAIを使い、編集方針と最終責任は編集長が負います(AIの活用について)。誤りを見つけた場合は訂正のご連絡をお願いします。