SekaEi is a web app for Japanese university students to practise English. It has two tracks:
- Pronunciation Practice — read a passage aloud; get instant per-word and per-phoneme accuracy scores powered by Azure AI Speech.
- Real English (Idioms & Slang) — an idiom quiz with image-based multiple choice. (Work in progress.)
Access is invite-only: users sign up, then an admin approves their account.
- Pick a passage — choose a built-in passage or paste your own text.
- Record — your microphone turns on; read the passage aloud, then stop.
- Get scored — every word is colour-coded within seconds:
| Colour | Meaning |
|---|---|
| Green | Score ≥ 80 — well pronounced |
| Amber | Score 60–79 — acceptable but could improve |
| Red | Score < 60 — needs attention |
Hover over any word to see a breakdown of each individual phoneme.
Overall scores for Accuracy, Fluency, Completeness, Prosody, and a combined Overall are shown at the top.
| Title | Source |
|---|---|
| Interstellar | Christopher Nolan, 2014 |
| The Great Dictator | Charlie Chaplin, 1940 |
| Rocky Balboa | Sylvester Stallone, 2006 |
- Node.js v20 or later
- pnpm (
npm install -g pnpm) - An Azure AI Speech resource (free tier: 5 hours/month)
- A Supabase project (for auth + database)
git clone <repo-url>
cd SekaEi
pnpm installcp .env.example .envFill in your Azure and Supabase credentials. All values are server-only; see .env.example for the full list.
pnpm devOpen http://localhost:3000.
Browser Nuxt/Nitro server Azure
─────── ───────────────── ─────
getUserMedia (mic only)
└─ AudioContext + Worklet ──► 16 kHz mono WAV Blob
POST /api/assess ────────► Azure Speech SDK
◄────────── per-word + phoneme scores
ScoreDisplay renders results
The Azure subscription key never leaves the server. The browser sends audio to /api/assess (your own Nitro endpoint), which proxies to Azure.
For a full directory-level map of the codebase, see docs/architecture.md.
| Layer | Technology |
|---|---|
| Framework | Nuxt 3 + Vue 3 |
| Language | TypeScript (strict) |
| Package manager | pnpm |
| Database / Auth | Supabase |
| Pronunciation API | Azure AI Speech — Pronunciation Assessment |
| Audio capture | Web Audio API (AudioContext + AudioWorklet) |
| Server | Nitro (built into Nuxt) |
If you want to swap out Azure, here are the other providers evaluated:
| Provider | Phoneme-level | Notes |
|---|---|---|
| Speechace | Yes | Learner-focused, IELTS/PTE-aligned scores. Paid only. |
| SpeechSuper | Yes | 8 languages, competitive pricing. |
| ELSA Speak API | Yes | Highest learner UX quality, enterprise pricing. |
| Langcraft | IPA + timestamps | Developer-first, good for high-volume apps. |
Swapping providers requires changing only server/utils/azure.ts and server/api/assess.post.ts.
| Command | Purpose |
|---|---|
pnpm dev |
Start development server |
pnpm build |
Build for production |
pnpm preview |
Preview the production build |
pnpm typecheck |
Run vue-tsc type checking |
pnpm test |
Run unit tests (Vitest) |