Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web app that allows users to take notes while simultaneously nurturing a virtual pet. As users write notes, their pet grows and evolves, providing a fun and engaging way to encourage productivity and creativity. The app combines note-taking functionalities with gamification elements, enhancing user interaction and motivation.

## CORE FEATURES
1. **Note-Taking Interface**: A clean and intuitive space for users to write and organize their notes, with support for rich text formatting.
2. **Pet Growth Mechanism**: The virtual pet grows in size and evolves based on the amount and quality of notes taken, providing visual feedback and rewards.
3. **Achievements and Rewards**: Users can unlock achievements and earn rewards for reaching note-taking milestones, enhancing engagement.
4. **Customization Options**: Users can customize their pet’s appearance and environment, allowing for personalization and a more immersive experience.
5. **Analytics Dashboard**: A summary of note-taking habits and pet growth statistics to help users track their progress and improve productivity.
6. **User Profiles**: Allow users to create accounts to save their notes and pet progress, enabling access across devices.

## 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 sidebar for navigation with sections for notes, pet status, achievements, and user settings, complemented by a central note-taking area and pet display.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Context API for managing user sessions and pet growth data.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React app with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Design the Layout**: Create a responsive layout using Tailwind CSS, ensuring a minimalist aesthetic with ample white space.
3. **Develop the Note-Taking Interface**: Implement a rich text editor for note-taking, ensuring it integrates smoothly with the pet growth mechanism.
4. **Implement Pet Growth Mechanism**: Create logic that tracks note input and updates the pet's status based on user activity.
5. **Build the Achievements System**: Develop a backend or local storage solution to track user milestones and earn rewards.
6. **Create the Customization Options**: Allow users to select different appearances for their pets and environments, storing preferences in user profiles.
7. **Integrate User Authentication**: Set up user accounts using a robust authentication system to save notes and pet progress.
8. **Test and Optimize**: Conduct thorough testing for usability and performance, ensuring a smooth and engaging user experience.

## USER EXPERIENCE
Users will be greeted by a minimalist interface featuring their virtual pet and a prominent note-taking area. As they begin typing, visual cues will indicate their pet's growth in real-time. Users will receive notifications for achievements and have quick access to customization options. The analytics dashboard will provide insights into their productivity, encouraging them to engage further with both note-taking and pet care. The overall flow will be seamless, with responsive design ensuring accessibility across devices.