Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web-based platform designed to facilitate a structured learning environment for team members based on their specific roles. It provides a comprehensive roadmap and checklist system, allowing users to allocate learning tasks and track progress effectively. The application is structured to promote daily learning and assessments, ensuring team members remain engaged and accountable.

## CORE FEATURES
1. **Role-Based Learning Roadmaps**: Customizable roadmaps for each team member based on their role, detailing the tech stack and learning objectives.
2. **Daily Task Management**: A checklist feature where users can view and complete daily tasks tailored to their roles, ensuring focused learning.
3. **Weekly Schedule Overview**: A calendar view displaying the learning schedule, including daily 1-hour sessions and 2-hour sessions on Sundays.
4. **Quiz and Assessment Integration**: After completing daily tasks, a simple quiz feature to reinforce learning and track knowledge retention.
5. **Progress Tracking Dashboard**: A visual dashboard showing individual progress and completion rates for tasks and quizzes.
6. **Customizable Checklists**: Users can modify their daily checklists based on their learning pace and preferences.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with plenty of white space, minimal color palette, and a focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance readability and reduce eye strain.
- **Layout**: A structured grid layout with a sidebar for navigation and main content area displaying tasks, quizzes, and progress. Each section will be clearly delineated to enhance user experience.
- **Typography**: Use a sans-serif font (e.g., Arial or Helvetica) for body text, with a larger, bolder serif font for headings to create a distinct hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for type safety and component-based architecture.
- **Styling**: Tailwind CSS for rapid styling and responsive design.
- **UI Components**: Using shadcn/ui library for pre-built components to enhance consistency and reduce development time.
- **State Management**: Context API for managing global state related to user progress and settings.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a React app with TypeScript and install Tailwind CSS and shadcn/ui for styling.
2. **Create Role-Based Roadmap Structure**: Define data structures for each role's learning roadmap in a JSON format.
3. **Develop Daily Task Checklist Component**: Create a component that fetches and displays tasks based on the user’s role with check/uncheck functionality.
4. **Implement Weekly Schedule View**: Develop a calendar component that integrates the daily tasks and two-hour Sunday sessions.
5. **Build Quiz Feature**: Create a simple quiz component that prompts users with questions based on completed tasks.
6. **Design Progress Tracking Dashboard**: Develop a dashboard to visualize user progress through charts and completion metrics.
7. **Testing and Iteration**: Conduct user testing to gather feedback and refine features based on user experience.

## USER EXPERIENCE
Users will log into the application, select their role, and be greeted with their personalized learning roadmap. Each day, they will check off completed tasks and receive quizzes to assess their understanding. The dashboard will provide a visual representation of their progress, encouraging continued engagement and motivation. The clean, minimalist design will ensure that users can easily navigate through their tasks and resources without distraction.