デザインテンプレートを当てはめるのではなく、AIコーディングエージェントでWordPressテーマをどこまで実装できるのか。それを検証するために、自社のコーポレートサイトを題材に全面刷新を行いました。

■ 実装はすべてAIコーディングエージェントで
WordPressテーマのCSS・JavaScript・PHPをClaude Code等のAIコーディングエージェントで実装しています。人が担当したのは、デザインの方向性を決めること、出力を確認して差し戻すこと、公開を判断することです。

テンプレートの範囲に収めれば制作は速く終わりますが、それでは他社と同じ見た目になります。本件では逆に、テンプレートでは作れない部分をAIで作りました。トップページの背景は、Canvasで描画する有機的なメッシュアニメーションを新規実装。スクロールに応じた読み込み演出も既存プラグインに頼らず自前で実装し、納得できるまで何度も作り直しています。手作業の制作では、工数の都合で見送っていた反復です。

■ 表示速度は最初の描画を62%短縮
公開後、Lighthouseによる速度計測をCIに組み込み、変更のたびに自動で計測される状態にしました。結果としてFirst Contentful Paint（最初の描画）を62%短縮しています。

計測を自動化したことで、原因の特定も進みました。「外部の解析タグが読み込みを55秒ブロックしていた」「特定のブラウザだけ描画が更新されない」といった、目視では気づけない不具合を検出し、修正しています。

■ 公開後は管理画面だけで運用できる設計
ヘッダーのメガメニューは、管理画面のパーツ編集だけで中身を差し替えられる仕組みにしました。実績一覧、お知らせ、FAQも同様です。制作会社に連絡しないと変更できない箇所を、可能な限り残していません。

■ 既存の資産を落とさない移行
旧サイトの記事・URL構造・アクセス数の実績を引き継いだ上で刷新しています。リニューアルで検索評価や過去の実績表示が失われる事故は珍しくないため、移行後に数値を突き合わせて確認しました。

この進め方は、その後のクライアント案件にもそのまま適用しています。自社サイトで先に試し、問題を出し切ってからお客様にご提供する方針です。