Vocabulary app · Public alpha / Project 13
EnStudy-Hub
Learning application · From a vocabulary collection to a daily review
What I built
A vocabulary-learning application connecting deck discovery, validated CSV imports, review sessions, and progress visualization, with a public alpha available online. The focus is a complete learning flow with clear choices, keyboard controls, and useful feedback.
- Learning flows
- Import UX
- Keyboard interaction
- Data visualization
- My role
- Frontend Developer & UI/UX Designer
- Project status
- Public alpha
- Tools & technologies
- Next.js · TypeScript · Tailwind CSS · Framer Motion · Zustand · Supabase · Drizzle · FSRS
Try the interface
A little of the app,
right here.
An interactive mockup adapted from the project’s frontend. Explore the controls with sample data; reset to try the flow again.
Daily review
0/3 reviewedTry revealing and rating a flashcard.
Portfolio preview · sample changes reset on reload.
01 / The project
The experience
in context.
EnStudy-Hub is an English-vocabulary application for Vietnamese learners, available as a public alpha. Collections, topics, lessons, and cards give the content a navigable structure. A review queue connects that content to daily practice, while personal imports and card editing let learners bring their own material. The portfolio mockup uses sample data; the website link opens the deployed application.
The user flow
- 01Browse a collection or import a CSV
- 02Preview and validate the cards
- 03Open a lesson
- 04Start a review session
- 05Reveal and rate an answer
- 06Inspect progress and adjust daily limits
02 / The making
What went
into it.
Preview before importing
Learners can upload or paste CSV data, download a template, and inspect a validation preview before creating a personal lesson. The form separates preview and submission states and returns readable errors when the data or lesson details need attention.
A review flow with several ways to practice
Flashcards, cloze questions, multiple choice, typing, and listening share a review-session structure. Answer ratings feed the spaced-repetition queue; notes and suspend or bury actions give learners control over individual cards.
Keyboard support for repeated actions
A command palette and review shortcuts reduce the effort of repeated navigation and rating. Session state preserves the selected practice mode, while visible controls remain available for people using touch or a pointer.
Make progress visible
The dashboard and statistics views combine a streak, activity heatmap, due counts, retention, and card-maturity charts. SVG visualizations present different aspects of the same learning history, with theme and daily-limit settings nearby.