プロジェクト一覧に戻る
ランディングページ · リード管理2026
AIフォトアニメーションサービスのランディングページとリード管理
パーソナル写真を映画のようなAI生成動画に変えるサービス向け高速ヘブライ語ランディングページ（モバイルファースト、RTL対応）。多段階問い合わせフォームで訪問者を構造化リードに変換し、保護された管理パネルで管理・フォロー。
課題
個人運営者向けに、高品質で構造化されたリード（イベント種類、写真枚数、緊急度）へ変換する高速ヘブライ語マーケティングページが必要。重いCRM不要、積極的なモバイルLCP最適化、Edgeミドルウェア対応認証、コスト配慮の画像パイプラインも求められた。
成果
Next.jsでフルサイトを納品。公開ランディング、リードAPI（DB永続化）、任意メール通知、スパム保護、認証管理パネル。構造化SEO（Schema.org）、完全アクセシビリティ、ポリシーページを備え、Vercelに最適化している。
Tech Stack
Next.jsTypeScriptReactPrismaPostgreSQLAWS SESCloudflare TurnstileVercel BlobTailwind CSSVercel
進め方
アイデアから公開までの5つのステージ。
- 1ページと提供内容の仕様決定：ヒーロー、仕組み、FAQ、問い合わせフォーム
- 2Next.jsによる高速モバイルページ構築—サーバーコンポーネントでLCP最適化、クライアントアイランドでアニメーション
- 3検証付き多段階リードフォーム、進捗バー、スパム防止（Turnstile＋レート制限）
- 4データ層：PostgreSQL（Prisma/Neon）でリード保存、AWS SESによるメール通知オプション
- 5JWT認証の保護管理パネル、完全SEO（JSON-LD）、アクセシビリティ、Vercel公開