Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project aims to develop a lightweight project portfolio prioritization tool tailored for small and medium-sized enterprises (SMEs). The application will facilitate structured project scoring, visual portfolio modeling, and resource-constrained prioritization, enabling SMEs to make informed and strategic project decisions.

## CORE FEATURES
1. **Multi-Criteria Project Scoring**: Allows users to evaluate projects based on adjustable weighted criteria tailored to their organizational strategy.
2. **Visual Portfolio Modeling**: Provides visual representations of project data, including risk versus reward bubble diagrams, to assist users in assessing portfolio balance.
3. **Portfolio Prioritization Suggestions**: Generates recommendations for project prioritization based on scoring results and available resources.
4. **Interdependency Flagging**: Highlights dependencies between projects to ensure users can view primary and supportive relationships in their project selections.
5. **User-Friendly Interface**: Designed for first-time PPM adopters, ensuring that the tool is simple and intuitive, requiring no specialist training.

## 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 hero section for tool introduction, followed by core features in a grid layout, a call-to-action section, and a footer with contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux (for managing application state across various components)

## IMPLEMENTATION STEPS
1. **Set Up Project Environment**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Structure Application**: Create the main components: Header, Hero, Features, CTA, and Footer.
4. **Develop Core Features**:
   - Implement multi-criteria project scoring with adjustable weights.
   - Create visual modeling components using charts or diagrams.
   - Develop algorithms for prioritization suggestions based on input data.
   - Integrate dependency flagging functionality.
5. **Style Components**: Apply Tailwind CSS styles to ensure adherence to the design specifications.
6. **Implement Responsive Design**: Ensure all components are mobile-friendly and responsive.
7. **Testing**: Conduct thorough testing for usability, functionality, and responsiveness across devices.
8. **Deployment**: Deploy the application to a suitable hosting platform.

## USER EXPERIENCE
The application will provide a seamless user experience through intuitive navigation and clear visual cues. Users will start at the hero section, understanding the tool's purpose. They can easily access project scoring forms, visualize their portfolio, and receive prioritized recommendations. The interface will be designed for clarity, ensuring that users can make informed decisions without feeling overwhelmed, ultimately supporting their strategic project management efforts.