WORK 02
問題集作成・学習サービス
Quizpo
制作のポイント
- 何のために
- 問題集を作る手間を減らし、作成から反復学習までをつなぐために制作しました。
- 担当した範囲
- PCの一括入力とスマートフォンの学習画面、認証・DB、Web版の公開を担当しました。
- 工夫した点
- 表形式・CSVでまとめて入力でき、解答を「苦手・微妙・覚えた」に分けて復習できるようにしました。
ABOUT
概要
PCで問題をまとめて入力し、スマートフォンで解いて復習できるWebサービスを制作しました。登録前でも問題集を作り、学習を始められます。
表形式とCSVによる入力、学習履歴、公開問題集の検索・コピー、URLやQRコードでの共有を実装しています。公式カタログには、2026年8月の投入時点で30問題集・544問を収録しました。
- 想定利用者
- 自分用の問題集を作りたい学習者。学校の学習から資格試験まで、短い時間で反復したい場面を想定。
- 制作目的
- 問題を作る手間と、作った後に繰り返し学習するまでの分断を減らすこと。
- 現在の状態
- Web版を本番運用中です。iOS / Android版にはWebと共通の実装基盤がありますが、ストア公開はしていません。
主な機能
- 01
登録なしで問題集を作り、そのまま学習を始める
- 02
表形式の入力やCSVで、多数の問題をまとめて作成・編集する
- 03
公開問題集や公式教材を検索し、コピーして自分用に使う
- 04
解答を「苦手・微妙・覚えた」に分け、復習へつなげる
- 05
URLやQRコードで問題集を共有する
- 06
ログイン後に問題集、学習履歴、連続学習記録を同期する
- 07
PWAとしてインストールし、一部の学習をオフラインで続ける
制作範囲
- 問題集の作成から反復学習までの要件・画面設計
- PC向け一括入力とスマートフォン向け学習画面の実装
- ゲスト利用、認証、学習履歴、データベースの実装
- 公式教材のデータ投入、公開範囲、検索・SEOの設計
- Cloudflare / Supabaseを使ったWeb版の公開と運用手順の整備
- Webとモバイルで共有する型・入力検証の設計
TECHNOLOGY
技術情報
- Web
- Next.js App Router / React / TypeScript / Tailwind CSS
- Mobile
- Expo / React Native。共有パッケージを持つmonorepo構成（ストア未公開）
- Database
- Supabase PostgreSQL / Row Level Security。問題集・学習履歴とアクセス範囲を管理
- Authentication
- Supabase Auth / Google OAuth / メールOTP
- Infrastructure
- Cloudflare Workers / OpenNext
- Offline
- PWA / Service Worker / Dexie・IndexedDB
- Validation
- Zod。Web・モバイル・API間で型と入力規則を共有
- Testing
- Vitest / Playwright / Supabase DB tests / production smoke test