Claude Codeで、はじめてサイトとゲームを作った話

この記事では、
記事作りにしか使っていなかったClaudeで、
公式サイトとミニゲームを作って、
公開するまでの夜たちを書いています。

むずかしい話はありません。
実際にできたものも、
そのまま遊べる形で置いてあります。

お盆休みの、
ちいさな挑戦のきっかけに
なりますように🌙

Claudeに、記事を手伝ってもらう。

私の毎日は、
ずっとそれでした。

下書きを整えてもらったり、
言葉を探してもらったり。

noteを書いている方には、
同じ使い方の方が
多いんじゃないかと思います。

あなたは今、
何に使っていますか？

私は、Claude Codeという
ツールも使っていました。

名前にcodeと付いているのに、
コードなんて一度も書かないまま。

使い道は、記事のお手伝いだけ（笑）

アプリも作れるらしい。
サイトも作れるらしい。

AIと会話しながらものを作る
「Vibe Coding」という言葉にも、
ほんとうは興味がありました。

…らしい、のまま、
数か月が過ぎていました。

やり方が、分からなかったんです。

クラウドとローカルの違いも、
正直よく分かっていませんでした。

（ブラウザの中で使うか、
　自分のパソコンの中で使うか、
　の違いです。
　私はずっとブラウザの中だけでした）

調べようとしても英語の画面ばかりで、
何をどうすれば始まるのかが、
そもそも分からない。

分からないまま閉じたタブが、
いくつもありました。

それでも記事は書けていたから、
困ってはいませんでした。

…困っていないことに、
していたのかもしれません。

変わったきっかけは、
ひとつのセミナーでした。

お盆休みなら、
少しだけ時間がとれる。

今年はその時間を、
「らしい」を確かめることに
使ってみよう。

そう思って申し込んだら、
事前課題が届きました。

「Claude Codeでゲームを作ってみましょう」

作れるわけない、と思いながら、
言われるままに、
デスクトップアプリを入れて、
空のフォルダをひとつ作って、
課題の文章を貼り付けました。

白状すると、この日の私は、

「フォルダはどこに作るの？
　PCに？　Claudeの中に？」

と、本気で質問しています。

その程度のスタートでした。

数分後。

画面の中で、
ゲームが動いていました。

矢印キーで動いて、
光の弾が出て、
音まで鳴る。

私が渡したのは、
日本語の文章だけなのに。

でも、一番驚いたのは、
そのあとでした。

ホームページを作ってもらったとき。

作業の進み具合が、
リアルタイムで見えるんです。

文字だけだった画面の向こうで、
サイトが、絵になって、
できあがっていく。

進行と同時に、
絵で見れる。

記事の手伝いを頼んでいた
数か月のあいだ、
一度も見たことのない景色でした。

ここが、工房だったんだ。

私は書斎の椅子から、
一歩も動いていなかっただけで。

もちろん、
魔法のように一発で
できたわけではありません。

ゆめとルナのイラストを用意して、
「顔が切れてる」「ここが変」と、
何度もやり取りして。

作業できるのは、夜だけ。

それでも夜をいくつか重ねて、
まる一日分くらいの時間を、
一緒に作っていました。

その時間は、作業というより、
となりで手を動かしてくれる相手と
おしゃべりしている感覚に
近かったです。

そうして、
できたものたちです。

水晶ゆめの公式サイト。

ルナと夜を歩くミニゲーム、
「よるを浄める」。

ゲームはスマホでも遊べます。

サイトの下のほうの
「よるのあそびば」からも、
のぞいてみてください🌙

ゲームは、課題で作ったものを、
自分の作品に作り替えました。

敵を撃ち落とすのではなく、
夜の靄を、ルナが浄めていく。

ゲームオーバーの画面には、
「ゆっくり休んで、また明日」。

読者を責めない、急がせない。

記事でずっと守ってきた約束を、
ゲームの中でも
守れることが分かりました。

もしあなたも、
Claudeを記事作りにしか
使っていないなら。

そしてこの連休、
少しだけ時間があるなら。

デスクトップアプリを入れて、
空のフォルダをひとつ作る。

最初の一歩は、
たったそれだけでした。

（ひとつだけ、正直に。
　この一歩には、パソコンが必要です。
　スマホだけで書いている方は、
　今日のところは
　「こんな世界もあるんだ」だけ、
　持ち帰ってもらえたら🌙）

英語の画面に戸惑ったら、
Claudeに日本語で聞けば、
日本語で教えてくれます。

フォルダの場所も分からなかった私が、
何日かあとの夜には、
自分のサイトをスマホで開いていました。

わからないことを、
わからないと言える相手と一緒なら。

挑戦は、思っていたよりも、
やさしい形をしていました🌙

この工房を、どう作って、
どう育てているのか。

私の声で書ける「第二の脳」のことや、
決めるボタンだけは手放さない仕組みのことは、
別の記事にまとめる予定です。

あなたの「やってみたい」が、
今夜すこしだけ、
軽くなっていますように💫