M.
Webツール Web / PWA

SPI3ドリル(非公式)

SPI3の非言語17分野・言語9分野の練習問題を自動生成して、何問でも解ける無料Webアプリ。要点だけのお手軽モードと、制限時間・メモ・電卓つきの本番モード。PWA対応。

SPI3ドリル(非公式)

SPI3の非言語・言語の練習問題を、その場で自動生成して何問でも解けるWebアプリ。数値や選択肢の組み合わせを毎回作り直すので、同じ問題の答えを覚えてしまうことがなく、解き方そのものを繰り返し練習できる。個人で作った非公式のアプリで、問題はすべてオリジナル。

主な機能

  • 26分野に対応: 非言語は割合・損益算・速さ・確率・場合の数・推論・表の読み取り・物の流れなど17分野、言語は二語の関係・熟語の成り立ち・文の並べ替え・長文読解・英語・構造的把握など9分野。
  • お手軽モード: 小さな数で各分野の要点だけを練習する。答えるとすぐに正誤と解説、その分野の公式・ポイントが出る。時間制限はない。
  • 本番モード: 本番に近い数と形式で、1問ごとに制限時間がある。手書きメモと電卓を使いながら解き、一部の問題は数値を直接入力する。解説は最後にまとめて出る。
  • 出題の選び方: 分野を選んで集中練習するか、非言語/言語/全分野からランダムに5・10・20問。
  • 結果と見直し: 分野別の正答率と、間違えた問題の解説・公式を見直せる。
  • 公式・ポイント一覧: 分野ごとの公式と解き方のポイントをまとめて確認できる。
  • PWA対応: ホーム画面に追加すればオフラインでも練習できる。記録は端末内にだけ保存する。

使い方

  1. ページを開き、「お手軽」か「本番」のモードと問題数を選ぶ。
  2. 分野を1つ選ぶか、非言語・言語・全分野のミックスで始める。
  3. 終わったら結果画面で正答率を確認し、間違えた問題の解説を見直す。

技術構成

ビルド不要の静的サイトで、ES Modulesに分けたJavaScriptをGitHub Pagesでそのまま配信している。分野ごとに問題ジェネレーターを持ち、シード付きの乱数から問題文・選択肢・正解・解説をまとめて作る。手書きメモはCanvas、電卓・タイマー・採点は素のJavaScriptで、外部ライブラリは使っていない。Service Workerでアセットをキャッシュし、オフラインでも動く。

工夫した点

問題を自動生成すると、選択肢の重複や割り切れない答え、正解が2つある問題などが混じりやすい。そこで全分野をお手軽・本番の両方で数千問ずつ生成し、選択肢の重複・正解番号・数値の崩れなどを機械的に検査するテストを用意して、形式が崩れないことを確かめている。また、同じ分野でもお手軽モードは「解き方の型」が見える小さな数に、本番モードは計算の手間と制限時間がかかる数にして、難易度の違いを作っている。

よくある質問

実際のSPI3の問題が出ますか?

出ない。問題はすべてオリジナルで、分野ごとの解き方の型にそって数値や組み合わせをその場で自動生成している。実際の試験問題や市販の問題集とは関係ない。

お手軽モードと本番モードの違いは?

お手軽モードは小さな数で解き方の要点だけを練習するモードで、答えるとすぐに正誤・解説・公式が出る。本番モードは本番に近い数と形式で、1問ごとに制限時間があり、手書きメモと電卓を使いながら解く。解説は最後にまとめて出る。

スマホでも使えますか?

使える。スマホの縦画面を主な対象にしていて、メモは指でも書ける。ホーム画面に追加すれば、オフラインでも練習できる。

解いた記録はどこに保存されますか?

端末のブラウザ内(localStorage)にだけ保存する。サーバーには送らないので、ログインも不要。

SPI3ドリル(非公式) についての記事

SPI3 の練習問題を自動生成する Web アプリを Claude Code で作った(26分野・お手軽/本番の2モード)

SPI3 の非言語17分野・言語9分野の練習問題を、その場で自動生成して何問でも解ける Web アプリ「SPI3ドリル(非公式)」を作りました。問題ジェネレーターの作り方、お手軽モードと本番モードで難易度を分けた方法、15万問を生成して形式の崩れを検査したテストについてまとめます。

同じカテゴリの制作物

Moeter のタイトル画像。AIが生成した4人のキャラクターイラストが並んでいる
Webツール Web

Moeter

4枚のイラストから好きな1枚を選ぶ30問の回答から好みのキャラ属性を読み解き、結果に合わせたオリジナルキャラをAIが1枚描く診断Webアプリ。

  • #TypeScript
  • #Vite
  • #Hono
  • #Cloud Run
  • #Cloudflare
  • #画像生成AI
非公式 学マス プレイリストメーカーの画面。アイドルの選択欄と動画一覧、プレイリストが並んでいる
Webツール Web

非公式 学マス プレイリストメーカー

学園アイドルマスターのMVや歌唱動画から自分だけのプレイリストを作って連続再生できる非公式Webアプリ。アイドル・曲で絞り込み、URLで共有もできる。

  • #Next.js
  • #TypeScript
  • #YouTube IFrame API
  • #Cloudflare Pages
てまぬい図鑑ジェネレーター
Webツール Web

てまぬい図鑑ジェネレーター

写真をアップロードするだけでてまぬい図鑑カードを作れるWebアプリ。AI背景除去・フォント選択・PNG書き出し対応。

  • #JavaScript
  • #Canvas
  • #@imgly/background-removal