Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a minimalist web application designed to provide users with a clean and simple interface that focuses on essential functionalities. Its main purpose is to deliver a user-friendly experience while maintaining visual clarity and accessibility through thoughtful typography and an unobtrusive color palette.

## CORE FEATURES
1. **User Authentication**: Secure sign-up and login functionality, allowing users to create and manage accounts with ease.
2. **Dashboard Overview**: A central hub for users to view key metrics or information at a glance, designed for quick access and easy navigation.
3. **Interactive Task Management**: Users can create, edit, and delete tasks with a straightforward interface that prioritizes usability.
4. **Data Visualization**: Graphical representations of user data to enhance understanding and facilitate decision-making.
5. **Responsive Design**: Optimized for various screen sizes, ensuring a consistent experience across devices.
6. **Contact/Support Section**: Easy access to support resources or contact forms for user assistance.

## 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 layout will feature a top navigation bar, a main content area with a sidebar for navigation, and a footer. The dashboard will display user metrics prominently, with task management features easily accessible.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Redux (if complex state management is needed) or React's built-in state.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript using Create React App or a similar tool.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and component library.
3. **Create File Structure**: Organize the project into folders for components, pages, assets, and hooks.
4. **Implement Authentication**: Set up user authentication using JWT or OAuth, with protected routes for secure access.
5. **Build Dashboard Layout**: Create the layout with a navigation bar, sidebar, and main content area, applying the specified design principles.
6. **Develop Core Features**: Implement the interactive task management and data visualization functionalities.
7. **Responsive Testing**: Ensure the application is responsive and visually appealing on different devices and screen sizes.
8. **Deploy Application**: Use a platform like Vercel or Netlify for deployment, ensuring continuous integration is set up for future updates.

## USER EXPERIENCE
The user experience will focus on intuitive interactions, where users can smoothly navigate through the application. The dashboard will greet users with essential information upon login, while task management features will allow for quick updates. Users will benefit from clear calls to action, ensuring they can easily access support or additional resources. The minimalist design will reduce distractions, helping users focus on their tasks effectively.