Remix

Make your own version of StudyHub VN

Edit the prompt below and generate a customized version in seconds.

Original by thaiduongh504

Describe your app

# STUDYHUB VN – MVP V1 (LOVABLE PROMPT)

Build a complete modern web application called **StudyHub VN**.

StudyHub VN is a smart study planning platform designed specifically for Vietnamese students from Grade 6 to Grade 12.

The goal is to help students automatically organize their study schedules, track assignments, monitor grades, and prepare for upcoming exams.

This is NOT a generic task manager.

The core idea is:

**Students enter their school schedule and upcoming exams once, and the system automatically generates a personalized study plan.**

The application must feel like a real product, not a demo.

---

# DESIGN STYLE

Create a modern and premium UI inspired by:

* Notion
* Todoist
* TickTick
* Google Calendar

Design requirements:

* Clean
* Minimal
* Modern
* Professional
* Mobile-first
* Responsive

Use:

* Tailwind CSS
* Large spacing
* Rounded corners
* Soft shadows
* Smooth transitions

Color palette:

Primary:
#2563EB

Success:
#22C55E

Warning:
#F59E0B

Danger:
#EF4444

Background:
#F8FAFC

Typography:
Inter

Support:

* Light Mode
* Dark Mode

---

# APPLICATION STRUCTURE

The application should contain:

1. Landing Page
2. Onboarding Setup
3. Dashboard
4. Study Planner
5. Exam Manager
6. Assignment Manager
7. Grade Tracker
8. Calendar
9. Settings

---

# LANDING PAGE

Create a professional landing page.

Hero Section

Headline:

"Study Smarter Every Day"

Subheadline:

"Automatically plan your studies, manage exams, track grades, and stay organized."

Buttons:

* Get Started
* Learn More

Additional sections:

* Features
* How It Works
* Student Benefits
* FAQ
* Footer

---

# ONBOARDING SETUP

This is the most important flow.

When users enter the application for the first time:

---

## STEP 1 – SELECT GRADE

Allow selection:

* Grade 6
* Grade 7
* Grade 8
* Grade 9
* Grade 10
* Grade 11
* Grade 12

Store grade level.

---

## STEP 2 – SELECT STUDY GOAL

Options:

* Maintain Grades
* Good Student
* Excellent Student
* High School Graduation Preparation
* University Entrance Preparation

Store selected goal.

---

## STEP 3 – SCHOOL SCHEDULE

Allow user to enter:

Morning School End Time

Example:

11:30

Afternoon School End Time

Example:

17:00

Wake Up Time

Example:

06:00

Sleep Time

Example:

22:30

---

## STEP 4 – WEEKLY DAYS OFF

Allow multiple selections.

Example:

Saturday

Sunday

Store selected days.

---

## STEP 5 – SUBJECTS

Display common Vietnamese subjects.

Allow selecting active subjects.

Examples:

Mathematics

Literature

English

Physics

Chemistry

Biology

History

Geography

Civic Education

Technology

Computer Science

---

# DASHBOARD

Create a beautiful dashboard.

Display cards:

Today's Study Time

Upcoming Exams

Assignments Remaining

Weekly Progress

Study Completion Rate

Nearest Exam Countdown

Today's Recommended Study Plan

Example:

Today

Math – 60 minutes

English – 45 minutes

Literature – 45 minutes

Review – 30 minutes

---

# EXAM MANAGEMENT

Allow users to create exams.

Fields:

Subject

Exam Name

Exam Date

Description

Example:

Mathematics

Midterm Exam

2026-06-20

---

Automatically calculate:

Days Remaining

Example:

5 days remaining

Countdown must update automatically every day.

Display upcoming exams on dashboard.

Sort exams by nearest date.

Highlight nearest exam.

---

# ASSIGNMENT MANAGEMENT

Allow creating assignments.

Fields:

Title

Subject

Deadline

Description

Status

Status options:

* Not Started
* In Progress
* Completed

Features:

* Create
* Edit
* Delete
* Mark Complete

Dashboard should display:

Assignments Due Today

Assignments Due This Week

Overdue Assignments

---

# GRADE TRACKER

Implement Vietnamese grading system.

Allow entering:

Oral Test

15-Minute Test

1-Period Test

Semester Exam

Automatically calculate:

Subject Average

Semester Average

Overall Average

Display results visually.

Use charts and progress indicators.

---

# STUDY PLANNER ENGINE

This is the core feature.

Build a rule-based automatic planner.

Calculate available study time.

Example:

School Ends:
17:00

Sleep:
22:30

Available Time:
5.5 hours

Automatically generate study sessions.

Example:

17:30–18:30 Mathematics

19:00–20:00 English

20:15–21:00 Literature

21:00–21:30 Review

---

# SUBJECT PRIORITY SYSTEM

Generate priority scores.

Factors:

1. Exam Date

Closer exams get higher priority.

2. Study Goal

Excellent Student receives more study time.

3. Assignment Load

Subjects with more assignments get higher priority.

Priority levels:

High

Medium

Low

Display priority badges.

---

# CALENDAR

Create a modern calendar.

Views:

Month

Week

Day

Display:

Exams

Assignments

Study Sessions

Allow clicking any event to view details.

---

# SETTINGS

Allow users to edit:

Grade

Study Goal

Subjects

Days Off

School Schedule

Theme

Language

---

# DATA STORAGE

For MVP:

Use local storage.

Do NOT require backend.

All user data should persist locally.

Store:

Profile

Subjects

Assignments

Exams

Grades

Settings

Schedules

---

# RESPONSIVE DESIGN

Must work perfectly on:

Desktop

Tablet

Mobile

All pages must be responsive.

---

# REQUIRED MVP LOGIC

The application must automatically:

* Calculate available study hours
* Calculate exam countdowns
* Sort exams by urgency
* Prioritize subjects
* Generate daily study plans
* Update countdowns every day
* Display nearest exam prominently

---

# IMPORTANT

Do NOT build:

* Admin Panel
* AI Features
* Gamification
* XP System
* Level System
* Chat Features
* Social Features
* Premium Plans
* Payment System

Focus entirely on creating the best possible MVP for Vietnamese students.

The final result should feel like a polished educational productivity application that students can actually use every day.

Free to use. No credit card required.