Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project aims to create a web application that serves as a learning platform for driving schools. The platform will provide users with access to educational content, practice tests, and resources to help them prepare for driving exams. The focus will be on creating a user-friendly interface that simplifies the learning process.

## CORE FEATURES
1. **User Registration and Authentication**: Allow users to create accounts, log in, and manage their profiles securely.
2. **Course Content Management**: Provide a system for organizing and displaying driving courses, including text, images, and videos.
3. **Practice Tests**: Offer interactive practice tests that simulate real driving exam questions to help users prepare effectively.
4. **Progress Tracking**: Enable users to track their progress through courses and tests, providing insights into areas that need improvement.
5. **Feedback and Support**: Implement a feedback system where users can ask questions and receive support from instructors or peers.
6. **Responsive Design**: Ensure the platform is accessible and functional on various devices, including desktops, tablets, and smartphones.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds.
- **Primary Color**: #1978E5 (accent for buttons, links, highlights).
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements.
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs.
- **Layout**: The main layout will feature a top navigation bar with links to courses, tests, and user profile. The hero section will present the platform's value proposition, followed by sections for featured courses, testimonials, and a call-to-action button to sign up or log in.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: React Context API or Redux (if needed for complex state management).

## IMPLEMENTATION STEPS
1. **Set up the React project**: Initialize the project using Create React App with TypeScript.
2. **Install necessary dependencies**: Add Tailwind CSS and shadcn/ui for component styling.
3. **Create the folder structure**: Organize components, pages, and services for better maintainability.
4. **Implement user authentication**: Build user registration and login forms using controlled components.
5. **Develop course content management**: Create components for displaying course materials and practice tests, pulling data from a backend API.
6. **Add progress tracking functionality**: Store user progress in the state and update it based on interactions with the courses and tests.
7. **Design the UI**: Use Tailwind CSS to style components according to the design specifications, ensuring responsiveness across devices.
8. **Test the application**: Conduct thorough testing to ensure all features work as intended and fix any bugs.

## USER EXPERIENCE
Key user interactions will include seamless registration and login processes, intuitive navigation through course materials, and engaging practice tests that provide instant feedback. Users will appreciate the clear layout and minimalist design, which helps them focus on learning without distractions. The responsive design will ensure a consistent experience across all devices, enhancing usability and satisfaction.