02 Owned Media

2.5DGEEK

2.5次元をあなたと楽しむ応援メディア

2.5次元舞台・俳優・声優・VTuberを中心に、ファンと一緒に楽しむ応援メディア。過去から未来のファンまでつながるアーカイブを目指し、企画・設計・実装・運用をすべて自社で行っています。Headless WordPress + Next.jsによるJamstack構成で、表示速度と編集体験を両立。

Visit Website →

Tech Stack

Next.js (App Router) TypeScript Headless WordPress WPGraphQL Tailwind CSS Auth.js Neon PostgreSQL Drizzle ORM GSAP Swiper Resend LINE Messaging API Vercel

Background

「好き」になったとき、まず見るのはインターネット。今だけでなく未来のファンにもつながるアーカイブを残したい。

2.5次元舞台やキャストの情報は散在しやすく、作品を知ったときには過去の公演情報が見つからないことも多い。2.5DGEEKは、現場密着の一次情報を軸に、時間が経っても価値が残るアーカイブメディアとして運営しています。

ただし、情報発信だけでは持続しない。受け身のメディアから脱却し、ファンとの接点を能動的に設計する必要がありました。

Solution 01

WordPress REST API（メインデータ）+ WPGraphQL（Gutenbergブロック専用）のDual-API構成。12以上のfetch関数でデータ取得を最適化し、ISR + SWRで表示速度と鮮度を両立。

— REST APIで記事・カテゴリ・メディア・ランキング・広告バナーを取得（メインデータソース）
— WPGraphQLはGutenbergエディタブロックの取得のみに限定使用
— restPostToGqlNode()変換関数により、コンポーネントに影響なくAPI移行が可能な設計
— ISR（revalidate: 60〜3600秒）+ クライアントSWRで鮮度と速度を両立

Solution 02

WordPressのGutenbergエディタで書かれた記事を、Next.js側でカスタムブロック・ショートコード・YouTube embed・フォールバックまでクリーンにレンダリング。

記事コンテンツの表現力を落とさずにHeadless化するため、Gutenbergブロックのレンダリングパイプラインを独自構築しました。

カスタムブロック、WordPressショートコード解析、YouTube embed抽出を個別に処理し、未対応ブロックはフォールバックで安全に表示。編集者がWordPress上で自由にコンテンツを組み立てられる体験を維持しています。

Solution 03

外部広告ネットワークに依存しない、自社広告配信プラットフォームを構築。WordPress管理画面での入稿から、表示・インプレッション計測・クリック計測・GA4連携までを一気通貫で設計。

— WordPressカスタム投稿タイプ→ REST API → サーバーコンポーネントで取得
— Swiperカルーセルで複数バナーを表示。空枠には「広告募集中」を自動表示
— IntersectionObserverでインプレッション計測 → GA4カスタムイベント送信
— クリック計測 → WordPress REST APIへPOST → GA4イベント送信の二重計測
— アフィリエイト導線はGutenbergカスタムブロックでさまざまなプロバイダ対応

Solution 04

会員機能でファンとの直接的な接点をつくり、「読んで終わり」から「繰り返し訪れる」メディアへ。

Auth.js（メール+パスワード認証）による認証基盤を、WordPressとは独立したNeon PostgreSQL + Drizzle ORMで構築。記事・Photologのお気に入り保存はCMS移行を見越したcontent_type + external_idの抽象設計。@vercel/ogによる動的シェア画像生成で、ファンのシェアも促進しています。

2.5DGEEKの強みは、現場に足を運んで得た一次情報——ゲネプロ写真、独自インタビュー、レポート記事。この「ここでしか読めないコンテンツ」と会員基盤を組み合わせることで、熱量の高いファンへの限定配信やカテゴリ別通知を可能にし、広告に頼らない持続可能な収益モデルへの布石としています。

通知はResendによるメール（サムネイル+抜粋付き）とLINE Messaging API（Flex Message）の2チャネル。WordPress記事公開をWebhookでトリガーし、カテゴリに応じた購読者へ自動配信。管理画面では会員一覧・ブックマーク統計・通知ログを一元管理しています。

Solution 05

ルートベースのi18nとWordPress Polylangで日英対応。PVランキングシステムでコンテンツの発見導線を強化。

/en/ ルートベースの手動i18n + WordPress Polylangの?lang=enフィルターで日英の記事を管理。メニューにあるボタンでユーザーが言語を切り替え可能。

PVランキングはWordPressのプラグインと連携。サイレントfire-and-forgetでPV計測を行い、日/週/月別のランキング一覧を表示。ファンが「今話題のコンテンツ」にたどり着ける導線を確保しています。

Solution 06

運営の手間を外注せず、問い合わせ基盤も内製。Notion DB + Slack通知 + 自動返信メールを Server Action で並列実行する構成。

— フォーム送信 → Notionボードビューに新規ステータスで自動登録。対応状況をカンバンで一元管理
— Slack Incoming Webhookで運営チームに即時通知
— Resendで自動返信メール（入力内容の控え付き）
— Next.js Server Action + Promise.allSettledで並列実行。1系統の失敗が他に影響しない
— Valibotスキーマでクライアント・サーバー両方でバリデーション

Impact

二人の情熱で始まったメディアを、持続可能な仕組みに育てる。事業の設計から運用まで一貫して回す実践の場。

2.5DGEEKは運用2年を超え、Xフォロワーは3,000超。現場密着と設計・実装・運用まで一貫して回せることが強み。会員機能・自社広告配信プラットフォーム・通知パイプラインの自社管理化を経て、受け身のメディアから能動的なファンコミュニティへの転換を進めています。