fierce-productivity

bySuchith Parmi

Build a Duolingo-style Student Productivity App with gamification, levels, streaks, and a real leaderboard system. CORE IDEA: The app should feel like a game where studying = progress and competition. AUTHENTICATION: - Separate Login and Signup pages - Input fields clearly labeled: Username: Password: - Show validation errors - Prevent duplicate usernames - Redirect to Dashboard after login/signup MAIN FEATURES: 1. Daily Goal System: - Default daily goal: 60 minutes - Progress bar showing completion - Completing goal gives bonus rewards 2. XP (Experience Points): - Earn XP: 10 XP per 10 minutes studied - Bonus: +50 XP for completing daily goal - Display total XP 3. Level System: - Every 100 XP = 1 level - Show current level - Progress bar to next level 4. Streak System: - Maintain streak if daily goal is completed - Show streak with flame icon πŸ”₯ - Reset streak if missed 5. Study Sessions: - Timer-based start/stop - Save session duration - Show total study time for the day 6. Achievements / Badges: - First Study Session - 3-Day Streak - 7-Day Streak - 10 Hours Studied - Display badges visually on profile 7. LEADERBOARD (IMPORTANT): - Global leaderboard showing top users ranked by XP - Display: Rank # Username XP Level - Highlight current user’s rank even if not in top 10 - Show Top 10 users - Update leaderboard dynamically when XP changes - Optional (if possible): - Weekly leaderboard reset (every 7 days) - Separate tabs: - Global (all-time XP) - Weekly (XP earned this week) 8. Dashboard UI: Show clearly: - Streak πŸ”₯ - XP ⭐ - Level 🧠 - Daily Goal Progress Bar - Quick β€œStart Study” button - Mini leaderboard preview (top 3 users) 9. Pages: - Login Page - Signup Page - Dashboard - Study Session Page - Leaderboard Page - Profile Page 10. Backend: Store: - username - password (hashed) - xp - level - streak - last active date - study history - badges 11. LOGIC RULES: - Completing goal β†’ streak +1 - Missing a day β†’ streak resets - XP updates level automatically - Leaderboard sorts users by XP (descending) 12. UI DESIGN: - Duolingo-inspired (bright, clean, engaging) - Rounded buttons, cards, smooth progress bars - Mobile-friendly 13. EXTRA: - Add simple animations (progress fill, XP gain effect) - Show rank change animation when user climbs leaderboard TECH STACK: - Frontend: HTML, CSS, JavaScript - Backend: Flask or Node.js - Database: JSON or SQLite OUTPUT: - Full working code - Separate frontend and backend - Instructions to run Make the app feel like a competitive game, not just a tracker.

LoginLeaderboard GlobalSignupUsers
Login

Comments (0)

No comments yet. Be the first!

Architecture

No Services Diagrams Yet

Architecture diagrams will be automatically generated when the Project Manager creates tasks for your project.

Login design preview
Login: Sign In
Dashboard: View Stats
Dashboard: Manage Users
Users: Edit User
Users: Delete User
Leaderboard Global: Monitor Rankings
Leaderboard Weekly: Monitor Rankings
Profile: View User Profile
Settings: Configure App