概要

大手飲料メーカーと、人気アイドル育成ゲームIPとのコラボレーションキャンペーンサイトの開発・実装を担当しました。QRコード付きのキャンペーンシールによる抽選応募受付、オリジナルグッズの抽選応募、エピソード投稿機能、キャラクターコンテンツなど、多彩なユーザー参加型コンテンツを実装。大規模トラフィックにも耐える堅牢な設計と、IPの世界観を活かした没入感のあるUI/UXを実現しました。

IPの世界観を再現した、体験型コラボキャンペーンサイト

ReactとViteによる高速な描画基盤の上に、Radix UIとTailwind CSSを組み合わせ、IPのビジュアルに寄り添ったインタラクティブなUIを設計・実装。QRコード付きキャンペーンシールを用いた応募フォームの構築から、ユーザーが自身のエピソードを投稿できる参加型コンテンツまで、多岐にわたる機能を一貫して開発しました。人気飲料×IP作品のこだわった世界観体験設計で、ファンの熱量に応えるサイトを構築しました。

大規模アクセスにも耐える安定稼働と、ブランド価値を高める実装品質

バックエンドにはHono × Node.jsによる軽量・高速なAPI基盤を採用し、VercelのCDNと組み合わせることでキャンペーン解禁直後の集中アクセスにも安定して対応。大規模IPとのコラボキャンペーンという性質上、リリース直後に膨大なアクセスが集中することを想定し、事前に本番環境相当での負荷試験を実施。ピーク時のレスポンスタイムやエラー率を検証・改善することで、サービスダウンのリスクをゼロに抑えた万全の体制でリリースに臨みました。SupabaseとDrizzle ORM（PostgreSQL）による型安全なデータ管理で応募データの信頼性を担保し、Sentryによるリアルタイムのエラー監視で万が一の障害にも即時対応できる運用体制を整備しています。

Claude CodeによるAIネイティブな開発体制の構築

Claude Codeを単なる補助ツールとしてではなく、チーム開発の基盤として組み込むAIネイティブな開発体制を構築しました。
プロジェクト固有のアーキテクチャ方針・コーディング規約・命名規則をチーム共通のAI設定として集約し、全員が同一のコンテキストでAIを活用できる環境を整備。ツール設定の共通化やカスタムコマンドの整備により、個人の習熟度に依存しない安定したAI活用を実現しました。またGitワークフローとの統合設計を行い、AIによる実装がレビュープロセスや品質基準と一貫して連動する体制を確立しています。