Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a web application for a note-taking tool inspired by Google Keep. Its primary purpose is to provide users with a simple and efficient way to create, manage, and organize notes, allowing for personal and collaborative use. The application will focus on minimalism and usability, ensuring a seamless experience across devices.

## CORE FEATURES
1. **Note Creation**: Users can create text notes with options to categorize and color-code them for easy organization.
2. **Note Editing**: Each note can be edited or deleted, with autosave functionality to prevent data loss.
3. **Search Functionality**: A robust search feature that allows users to quickly find notes based on keywords or tags.
4. **Collaboration**: Users can share notes with others, enabling real-time collaboration on shared notes.
5. **Reminder Setting**: Users can set reminders for specific notes, helping them keep track of important tasks.
6. **Archive and Trash**: Notes can be archived or moved to trash for easy retrieval or permanent deletion.

## 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 for easy access to different functionalities, a sidebar for quick navigation between categories, and a central area for displaying notes. Each note will be presented as a card for visual clarity and ease of interaction.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API or Zustand for global state management if necessary

## IMPLEMENTATION STEPS
1. **Set Up the Development Environment**: Initialize the project with Create React App using TypeScript. Install Tailwind CSS and configure it for the project.
2. **Design the Layout**: Develop the main layout structure, including the navigation bar and sidebar. Use Tailwind CSS for responsive design.
3. **Create Core Components**: Build components for note cards, note editor, search bar, and reminder settings. Utilize shadcn/ui for UI elements.
4. **Implement Note Functionality**: Develop the logic for creating, editing, and deleting notes. Integrate local storage or a database for persisting notes.
5. **Add Search and Filter**: Implement the search functionality to filter notes based on user input.
6. **Setup Collaboration Features**: Develop the sharing and collaboration features, allowing users to invite others to view or edit notes.
7. **Testing and Debugging**: Conduct thorough testing to ensure all features work as intended. Fix any bugs and optimize performance.
8. **Deploy the Application**: Once testing is complete, deploy the application to a hosting platform like Vercel or Netlify.

## USER EXPERIENCE
Users will have a straightforward experience when using the app. Upon logging in, they will be greeted with a clean interface displaying their notes. They can create a new note by clicking a prominent button, which opens an editor. The sidebar will allow users to quickly navigate between different categories or tags they have set up. The search bar will be easily accessible, enabling them to find notes rapidly. Collaboration features will allow users to invite others via email, making it easy to share ideas and notes. The overall design will ensure that users can create and manage their notes effortlessly with a focus on functionality and minimal distractions.