cleared

byKamalika

Here's a complete prompt you can give to another AI to build this product: --- **Build "cleared." — a student wellbeing + productivity app** A web app (React + Tailwind) for secondary school students and teachers that reduces academic overwhelm rather than adding to it. The one guiding idea: **"What if you forget?"** — the product should make forgetting homework harmless, not stressful. **Core philosophy** - Every feature must make a student's life better, not busier. - No streaks, no guilt badges, no red when you fall behind. The app should feel forgiving. - The best system is the one you'll actually use — keep it simple. - Students take responsibility together so teachers don't carry the load. **Users & onboarding** - Two roles on sign-up: **student** and **teacher**. - Teachers must verify with an MOE email address (e.g. `@moe.edu.sg`). Validate the email domain at signup; reject non-MOE addresses for the teacher role. - Onboarding collects: full name, role, school name, grade level (students) or subject taught (teachers), optional profile photo. - After onboarding, users land on a dashboard. A gate redirects users with no profile to onboarding. **Feature 1 — Shared Homework Board (the hero feature)** - Any student or teacher can post a homework assignment to a board shared across their school. - Posting captures: title, subject, class/level (optional), due date (required), due time (optional), estimated hours (optional), description (optional). - All users at the same school see the same board. No teacher has to post — students who heard the assignment can post it for everyone. - Each post shows who posted it (student or teacher) with attribution. - Students tap "Add to tasks" on any homework to sync it into their personal to-do list and calendar in one tap. Once added, it shows "Added ✓". - Teachers can delete any post; students can delete their own posts. - Empty state should say "Be the first to share." **Feature 2 — Personal to-do list** - Create tasks with: title, description, optional sub-steps, priority, due date/time, estimated hours, subject. - Priority uses the Eisenhower matrix: urgent+important / important / urgent / low. Colour-code each quadrant. - Toggle tasks complete/in-progress/todo. Store a `completed_at` timestamp. - Group or filter tasks by priority and status. - Keep the UI calm — never shame the user for incomplete tasks. **Feature 3 — Calendar** - Month grid view with colour-coded event types: class, assignment, exam, personal, reminder. - Create events with title, date, start/end time, type, description. - **Drag-and-drop rescheduling:** drag an event onto any day to change its date. This must feel smooth — no modals, no confirmations, just move it. - Tasks with due dates appear as dots on the calendar. - **Free Google Calendar sync:** each event has an "export to Google Calendar" button that opens Google Calendar's pre-filled event page (URL-based, no paid API, no OAuth). This is one-way (app → Google). - Click a day to see its events and due tasks in a side panel. **Feature 4 — Wellbeing toolkit** - **Balance Planner:** student inputs hours of study, social, and rest for the day. App calculates whether the balance is healthy and gives gentle, non-judgmental advice. - **Task Planner:** brain dump → Eisenhower sort → execution. A guided 3-step flow. - **Pomodoro Timer:** configurable focus/break intervals with a visual countdown. - **Anti-procrastination tool:** a "just 2 minutes" starter — a structured nudge to begin a tiny step, with positive reinforcement. **Feature 5 — Customisable identity** - **ID Card page:** a digital student card showing name, school, role, grade/subject, photo. User can pick background gradient and accent colour. Editable fields. - **Dashboard background:** user can upload a custom background image for their dashboard. Store the URL on their profile. Show a remove button. Apply a dark overlay for readability. **Dashboard** - Personalised greeting (time-based) with the user's first name and school. - Stats row: Due Today, Overdue, All Tasks, Hours Planned (this week), Done Today. - Weekly summary line: "X tasks due this week · Yh of work planned." - Today's tasks (top 5) with priority colour dots. - Today's schedule (today's calendar events). - Overdue alert banner if any tasks are past due. - Quick-action buttons to each feature. - Loading spinner while data loads. **Teacher benefit (passive, no extra work)** - Teachers see the same homework board but from a read-only "workload intelligence" angle: a summary of what's due across their school/level this week, aggregated from student posts. This helps them spot deadline clustering without data entry. **Navigation** - Sidebar on desktop (icons + labels), bottom tab bar on mobile. - Tabs: Dashboard, Calendar, Homework, To-Do, Toolkit, ID Card. - Logout button. **Design & aesthetics** - Light, airy theme. Not a dark dashboard. Should feel calming, not corporate. - Font: DM Sans throughout. Use a display font for headings. - Gradient accent (purple → teal) for branding and highlights. - Glassmorphism cards with subtle aurora-style borders. - Text must be easily readable — prioritise contrast on muted text. Don't use pale grey on light backgrounds for anything important. - Smooth Framer Motion transitions (fade-up on scroll, staggered stats). Never heavy or slow. - Responsive: works cleanly on phone and desktop. **Landing page (before login)** - A narrative-driven marketing page that tells the story: 1. Hero: "cleared." with the tagline "do less, breathe more." TDSI project by Cedar Girls' Secondary School. 2. "The Real Problem" — the 11 PM overwhelm scene. Statistics on student stress. The insight that current productivity apps make students feel worse. 3. "What if you forget?" — the hero idea. Reframe around the shared homework board: one person remembers, everyone's covered. Then acknowledge "and if you forget to use the app, that's fine too — no guilt." 4. "Who We Are" — students who lived the burnout and built the fix. The one rule: every feature must make life better, not busier. 5. "What's Inside" — five features, honest count, simple descriptions. 6. CTA: "Less stress. More life." - Two buttons in the hero: "Get Started" (→ dashboard) and "Our Story" (scrolls to narrative). **Data model (entities)** - `UserProfile`: user_email, full_name, role (student/teacher), school_name, grade_level, subject, moe_id, profile_photo_url, theme_color, wallpaper, custom_bg_url, dashboard_bg_url. - `Homework`: teacher_email, teacher_name, posted_by_name, posted_by_role (teacher/student), title, description, subject, school_name, class_level, due_date, due_time, estimated_hours. - `Task`: user_email, title, description, steps (array), priority, status, due_date, due_time, estimated_hours, subject, completed_at. - `CalendarEvent`: user_email, title, description, date, start_time, end_time, color, type (class/assignment/exam/personal/reminder). - Built-in `User` entity for auth (id, email, full_name, role). Users join via invite, not manual creation. **Tech constraints** - React + Vite + Tailwind CSS + shadcn/ui components. - Icons: lucide-react only. - Auth handled by the platform — don't build login pages. - No paid APIs. Calendar sync via Google Calendar URL template (free). - Realtime updates where possible (homework board should feel live). **Don't include** - No streaks, no leaderboards, no gamified pressure. - No dark corporate dashboard aesthetic. - No feature that requires teachers to do daily manual work. - Don't overcomplicate — if a feature adds complexity without reducing stress, cut it. --- Copy that and paste it to the other AI. You may want to tweak the school name, colours, or add your own data seeding requirements before sending.