🎯 やったこと
Claudeと一緒に、このヤスマズラボラトリーのサイトをゼロから作り始めた。
デザインの相談・実装・トラブル対応まで、全部AIと会話しながら進める
というやり方がどこまで通用するのか試してみる。
🧰 使ったもの
・Claude(サイト設計・コード実装・トラブル対応)
・Claude Design(見た目のデザイン作成)
・WordPressテーマ「Arkhe」+自作の子テーマ
・ConoHa WING(サーバー)
🔬 手順・過程
1. サイトの世界観を決める(研究所の断面図がそのままナビになる構成)
2. Claude Designでトップ・部屋アーカイブ・記事ページ・ABOUTのデザインを作成
3. 出来上がったデザインのコードを解析して、WordPressの子テーマとして実装
4. 実機で開いて確認 → ズレや不具合を報告 → 直す、を繰り返す
📊 結果
初回アップロード時点でリンクが全部トップに戻ってしまうバグと、
イラスト内のアニメーション(湯気・電球・水滴の位置)がズレる問題が発生。
前者はWordPressの古い関数が原因、後者は元データの座標基準のズレが原因と判明。
どちらも1つずつ潰していった。
💭 わかったこと・失敗したこと
○ AIに丸投げするより、「見た目→実装→実機確認」を小さく繰り返す方が
結局早いとわかった。
× 一度に全部直そうとすると原因の切り分けが難しくなる。
「これは合ってる/これはズレてる」を一つずつ確認したほうが、
結果的に近道だった。