Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web app designed for the Product Manager and Product Owner community, providing tools to create and update essential artifacts in their roles. It facilitates onboarding, knowledge gathering, and deliverable creation, ensuring that product professionals can efficiently manage their responsibilities and collaborate effectively.

## CORE FEATURES
1. **Onboarding Setup**: Collects initial information from users about their company and product, including company name, product name, competition, and focus areas.
2. **Product Roadmap Management**: Allows users to create and manage product roadmaps in various formats, such as OKRs or Gantt charts, for their specific cadence.
3. **Knowledge Gathering**: Enables users to store and organize relevant knowledge, including user interviews and meeting notes, through file uploads and connections.
4. **Template Library**: Provides users with templates for deliverables like Feature PRDs, Executive slides, and emails, streamlining the documentation process.
5. **Output Generation**: Offers options to create prioritized feature lists, interview insights, and various executive documents, enhancing productivity and clarity.

## 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, a central content area for forms and outputs, and a sidebar for shortcuts to different functionalities.

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

## IMPLEMENTATION STEPS
1. **Set up the project**: Initialize a new React project with TypeScript and install necessary dependencies (React, Tailwind CSS, shadcn/ui).
2. **Create the onboarding form**: Design a multi-step form to collect company and product details, ensuring smooth user flow.
3. **Develop the product roadmap module**: Implement functionality to create, view, and edit product roadmaps in different formats.
4. **Build the knowledge gathering feature**: Enable file uploads and connections, allowing users to manage their knowledge base effectively.
5. **Create the template library**: Develop a section where users can access and utilize predefined templates for various deliverables.
6. **Implement output generation**: Code the logic to compile user inputs into prioritized feature lists, insights, and documents.
7. **Conduct user testing**: Gather feedback from potential users to refine the user experience and fix any usability issues.

## USER EXPERIENCE
Users will start with an intuitive onboarding process that guides them through entering their company and product details. Once set up, they can easily navigate to the product roadmap section to plan and visualize their strategies. Knowledge gathering will be streamlined with options to upload files and connect sources, while the template library will provide quick access to necessary documents. The output generation feature will allow users to seamlessly create actionable insights and deliverables, enhancing their productivity and collaboration within their teams. The overall design will prioritize simplicity and clarity, ensuring an enjoyable experience.