Project Story

About the Project

This project is a bilingual, interactive Demo for an all-subject student self-study experience.

It turns scattered study tasks into one clear learning loop: Plan → Do → Check → Act.

Most learning products organize content but still leave students to decide what to do next. This Demo organizes the learning process itself.

Students choose a subject, review a daily plan, complete guided learning, recall without support, evaluate the result, and receive a clear next-step recommendation.

The current Demo includes English, Mathematics, and Physics. It supports both understanding and memorization, custom study plans, session recovery, bilingual use, and a student-to-teacher review flow.

Live Demo: pdca-self-study-demo-3100.justinchu.chatgpt.site

Inspiration

The project grew from a simple classroom observation: students often have enough content but not enough clarity.

A student may need to remember English vocabulary, understand a mathematics concept, and review a physics formula. The materials exist, but the sequence and definition of “finished” are often unclear.

This creates hidden work. Students must choose, switch, estimate time, decide when to test themselves, and work out what to do after a weak result.

We wanted to answer a more useful question:

Can one learning structure guide a student across different subjects without pretending that every subject is learned in the same way?

The PDCA model provided the organizing principle. Plan gives direction, Do guides execution, Check requires active recall, and Act turns the result into the next plan.

What It Does

Plan

Students choose English, Mathematics, or Physics and see what is due, what is new, the expected time, and the recommended order.

They can also create a personal plan by selecting an objective, learning mode, duration, and custom recall cards.

Do

The system guides the student through due review and new content in sequence. Each screen emphasizes one clear next action.

Memorization mode shows the complete answer before removing support. Understanding mode hides the reference and asks the student to explain the relationship in their own words.

Check

The reference disappears and the student must recall before revealing the answer.

After checking, the student rates the result as Know, Unsure, or Not yet.

Learning progress and recall performance remain separate. Viewing content does not automatically become proof of mastery.

Act

The result identifies difficult items, summarizes the session, and prepares the next recommended review.

That adjustment becomes the starting point for the next learning plan.

Student and teacher continuity

The Demo supports refresh recovery, plan history, browser navigation, and a privacy-conscious learning-record export.

The teacher view checks the record structure, marks the source as unverified, previews the result, and requires confirmation before import.

How We Built It

We began with the education problem and product flow rather than the interface.

The human creator defined the classroom need, the subject-learning boundaries, the PDCA direction, and the final product decisions.

Codex powered by GPT-5.6 was used as an agentic product and engineering partner throughout planning, implementation, iteration, and quality assurance.

Codex helped compare product directions and turn the chosen PDCA structure into a complete interaction model.

GPT-5.6 generated and refined the React and TypeScript state machine, bilingual interface, responsive layouts, custom planning, recall checks, browser persistence, and student-to-teacher record flow.

The implementation uses Next.js 16, React 19, TypeScript, Vinext, and Vite. Demo progress is stored in the current browser and does not connect to a production student database.

Codex also ran production builds, automated tests, browser interaction checks, responsive visual reviews, and side-by-side screenshot comparisons.

The repository includes product-review notes, browser acceptance evidence, desktop and mobile screenshots, and an English launch script.

Challenges We Faced

Designing one loop for different subjects

English vocabulary, mathematical concepts, and physics reasoning cannot be reduced to one identical card format.

We kept the shared PDCA structure while allowing the learning action to differ. Memorization emphasizes recall, while understanding asks students to explain relationships and reasoning.

Separating learning from evidence

Many systems treat content completion as mastery. That is convenient, but educationally misleading.

The Demo records progress during learning but generates recall evidence only during the Check stage. This keeps exposure, recall, and broader subject mastery conceptually separate.

Keeping the next action obvious

A full learning product can quickly become crowded with courses, metrics, histories, plans, and recommendations.

We reduced competing navigation and made one primary action dominant on each screen. Course directories remain available without competing with the daily plan.

Supporting interruption without losing context

Self-study is frequently interrupted. Refreshing, leaving the page, or using browser navigation should not force the student to restart.

We built browser-local state recovery, explicit plan history, and controlled back and forward behavior to preserve the student’s place.

Sharing progress without overstating trust

The Demo needed a way to show student-to-teacher continuity without building a production account system.

We used a limited local record with structure checks, duplicate detection, source warnings, preview, and teacher confirmation. The interface clearly states that structure validation is not proof of authorship.

What We Learned

The most important lesson is that a learning product should organize decisions, not only content.

We also learned that:

• A shared process can work across subjects when subject-specific learning actions remain distinct.
• Studying, recalling, and mastering are different states and should not share one score.
• One clear next action is often more useful than a dashboard full of information.
• Recovery after interruption is part of the learning experience, not merely a technical detail.
• Bilingual design must include feedback, teacher views, and system states, not only navigation labels.
• Automated validation should surface uncertainty and preserve human confirmation.
• Human–AI collaboration works best as an iterative loop of judgment, implementation, testing, and revision.

What We Are Proud Of

We are proud that the project is more than a collection of learning screens.

It demonstrates one coherent organizing principle across subjects while respecting the difference between memorizing information and understanding an idea.

The student always knows the current subject, the current stage, and the next action. The teacher receives a limited, reviewable record instead of an unexplained score.

Most importantly, the project turns self-study from a vague instruction—

“Go study something.”

—into a repeatable learning process:

plan → learn → recall → reflect → adjust → begin again

That closed loop is the central story of the project.

Built With

• ai
• aiedu
• codex
• g
• gpt5.6
• languages