◀ 工作室へ戻る
CRA-029 🔨 工作室 実験日:2026.07.18 / 記録者:SUZ

AIとゼロからラボのサイトを作ってみる

🎯 やったこと

Claudeと一緒に、このヤスマズラボラトリーのサイトをゼロから作り始めた。
デザインの相談・実装・トラブル対応まで、全部AIと会話しながら進める
というやり方がどこまで通用するのか試してみる。

🧰 使ったもの

・Claude(サイト設計・コード実装・トラブル対応)
・Claude Design(見た目のデザイン作成)
・WordPressテーマ「Arkhe」+自作の子テーマ
・ConoHa WING(サーバー)

🔬 手順・過程

1. サイトの世界観を決める(研究所の断面図がそのままナビになる構成)
2. Claude Designでトップ・部屋アーカイブ・記事ページ・ABOUTのデザインを作成
3. 出来上がったデザインのコードを解析して、WordPressの子テーマとして実装
4. 実機で開いて確認 → ズレや不具合を報告 → 直す、を繰り返す

📊 結果

初回アップロード時点でリンクが全部トップに戻ってしまうバグと、
イラスト内のアニメーション(湯気・電球・水滴の位置)がズレる問題が発生。
前者はWordPressの古い関数が原因、後者は元データの座標基準のズレが原因と判明。
どちらも1つずつ潰していった。

💭 わかったこと・失敗したこと

○ AIに丸投げするより、「見た目→実装→実機確認」を小さく繰り返す方が
 結局早いとわかった。
× 一度に全部直そうとすると原因の切り分けが難しくなる。
 「これは合ってる/これはズレてる」を一つずつ確認したほうが、
 結果的に近道だった。

関連実験

工作室の記録