本文へスキップ
100 APPS

020

つくったものNO.020

公開中

推し活コーラ

推しへの言葉を込めた、池袋発のクラフトコーラ

  • 「5つの味と、5つの推しワード。」トップページ。「推しと過ごす時間を、もっと特別に。」の見出しと、「池袋発、5フレーバーのクラフトコーラ。一本一本に込めた、推しへの言葉。」の説明、「商品を見る」「ブランドについて」のボタン。その下にグレープ・ピーチ・ストロベリー・レモン・メロンの5本が並ぶ写真
  • 「セットも、単品も。」すべての商品ページ。「ギフトにも、自分用にも。推し活のための6つのアイテム。」の下に、送料込バッジつきで「推し活コーラセット(全5種+お好み1本・計6本)¥3,600」などの商品カードが並ぶ
  • 「選んで、そのままカートへ。」商品詳細ページ。推し活コーラセットの写真とサムネイル、「全5種+お好み1本(計6本)」の説明が並び、フレーバーを選んでカートに入れられる
  • 「味ごとに、キャラクターがいる。」キャラクター紹介ページ。グレープ担当の「ぬまりん(NUMARIN)」が青紫のハートで描かれ、「気づいたら朝だった」の一言、推しワード「推しに沼り中」、味グレープ、出没時間 深夜2時〜明け方、口ぐせ「あと1本だけ見る」が並ぶ
  • 「はじまりは、60人の支援。」ブランドストーリーのページ。「池袋から、推し活カルチャーへ。」の見出しと、推しワードが印刷されたコースターの写真、ブランドが生まれた経緯が読める

どんなアプリか

「推しを応援する時間を、もっと特別なものにしたい」——推し活コーラは、その想いから生まれた池袋発のクラフトコーラです。グレープ・ピーチ・ストロベリー・レモン・メロンの5フレーバーがあり、ボトルにはそれぞれ「推しに沼り中」「推しにきゅんです」といった推しワードと、その言葉から生まれたキャラクターがいます。オンラインストアでは、5種+お好み1本のセットやグラス・コースターを、フレーバーを選んでそのまま買えます。このストアは既製のカートサービスではなく自分たちで実装したもので、商品の陳列から在庫・注文の管理までを1つのコードベースで動かしています。

できること

  • 5フレーバーのクラフトコーラと、グラス・コースターを扱うオンラインストア(全6商品)
  • 「推しに沼り中」「推しにきゅんです」など、味ごとに違う推しワードとキャラクター
  • セット商品はフレーバーを選んでカートへ。送料込みの商品もある
  • 決済は Stripe Checkout に預け、カード情報は自社サーバーを通らない
  • Webhook の署名を検証してから注文を確定し、在庫を引き当てる
  • 管理画面で在庫・注文・仕入れ・売上レポートまで扱える

ほかと何が違うか

既製のECサービスを使わず、Next.js と Stripe で組んだ自社ストアです。「5種+お好み1本」のようにフレーバーを選ばせる売り方は既製のカートだと表現しにくく、自前でつくる理由がそこにありました。決済は Stripe Checkout に預けてカード情報を自社サーバーに通さず、Webhook は署名を検証してから注文を確定させています。公開側の商品ページ・キャラクター紹介・ブランドストーリーと、運用側の在庫・注文・売上をさばく管理画面が、同じリポジトリに入っています。