CodexでLPを作ってみた感想

• URL: https://zenn.dev/clavisflow/articles/699b97115c81d3
• 日付: 2026-06-22
• Tier: Tier 3
• 要旨: Codex でLPを作って感想。最初のコミットでヒーローセクション・診断フォーム・レスポンシブ・Canvas背景演出一気。プロトタイプ速度は圧倒的。ただ公開形にするまでは終わりでなかった。綺麗なテンプレートに、後から「生々しい意味」を足す。AIは「DX推進」「最適化」と抽象的。ASP.NET 不具合調査・VB6 段階的リプレース・Classic ASP→Blazor 再構築・SQL チューニングなど具体例追加。「相談しやすさ」の空気感チューニング、プロフィールアイコン・サポートメッセージ。「ここが気になるだけでも大丈夫」文言が大きかった。ユーザーの「不安」を先回りして消す。

詳細

ClavisFlow のLPをCodexで短時間で形にした。最初のコミットでヒーローセクション・診断フォーム・レスポンシブ対応・Canvas背景演出まで一気。プロトタイプ作るスピードは圧倒的に速い。ただ公開できる形にする作業はそこで終わりでなかった。綺麗なテンプレートに、後から「生々しい意味」を足す必要があった。最初のLPは見た目として綺麗に成立。でも「何ができるのか」「どこから相談していいのか」という独自強みが伝わらない。AIが書くテキストはどうしても「DX推進」「システム最適化」といった抽象的。後から実績・スキルセクションに具体的な例を足した：ASP.NET業務システムの不具合調査・改修、VB6システムの段階的リプレース、Classic ASPからBlazorへの再構築、SQLチューニング。「相談しやすさ」という空気感のチューニング、プロフィールアイコン入れてサポートメッセージ追加。特に「まずは『ここが気になる』だけでも大丈夫です」という文言が大きかった。状況を整理できず「何がわかっていないかもわからない」状態でカチッとしたフォーム出されるとハードル高く離脱。単に「診断します」機能提供でなく「断片的な情報から一緒に整理しましょう」空気感を出した。モバイル実機確認も大事、AIはスマホ狭さ考慮してブランド名非表示にしたが、スクロール読むうちに「何というサービス見ているのか」ユーザー印象に残らない。CSS調整してスマホでも ClavisFlow 名前自然に残すようにした。実機見ながら「なんか変だな」違和感潰した。