アーティストデジタルトレーディングカード マーケットプレイス
アーティストのデジタルトレーディングカードを販売するマーケットプレイスを開発。
課題
音楽ファンがアーティストとの接点を持ち続ける手段が限られていた。 ライブやグッズ以外に「所有」できるデジタルコンテンツが少なく、ファンのエンゲージメントを高める新しい仕組みが求められていた。
ソリューション
アーティストのデジタルトレーディングカードを販売する、モバイルファーストのマーケットプレイスを開発。 カード画像とフレームを分けて管理し、レアリティ別の演出、購入者限定コンテンツ、Stripe決済まで実装した。
成果
固定費ほぼゼロでMVP運用を開始し、3段階のレアリティカード作成フローを構築
チーム
1 member, 2 months
設計・実装・運用
役割
商品設計、管理画面、決済、在庫管理、購入者向け画面を担当。
ビジュアル・フレームの2層構造、Stripe決済連携、RLSによる閲覧制御を担当。
技術スタック
主要機能
カードビジュアルとフレームの2層構造: 管理画面から1つのビジュアルを登録し、3段階のレアリティ(NORMAL / RARE / SUPER_RARE)へ展開
レアリティ別CSSエフェクト: ホログラム・スパークルなどを純CSSで実装し、外部ライブラリ不要
購入者限定エクスクルーシブコンテンツ: ライブ映像・未公開音源などを購入者のみに提供
Stripe Checkout決済: Webhook署名検証・サーバーサイド金額決定・冪等性保証による安全な決済
PostgreSQL FOR UPDATEロックによるアトミックな在庫管理でシリアルNo.重複を防止
モバイルファーストUI: 3:4アスペクト比の実物トレカ感・固定BottomNav・44x44pxタッチターゲット
注力した点
ビジュアル×フレーム分離設計
コンテンツ(アーティスト画像・楽曲名)とデザイン(フレーム枠・エフェクト)を分離し、フレームの追加・シーズン限定カードの対応をコード側で柔軟に管理可能にした。
RLSによるデータ保護
全テーブルでRow Level Securityを有効化し、購入者のみがエクスクルーシブコンテンツを閲覧できるポリシーをDB層で強制。
固定費を抑えた構成
Vercel + Supabase Free + Stripe従量課金を組み合わせ、MVP段階の固定費をほぼゼロに抑えました。