AI Proposal

Introduction

The AI Proposal project aims to develop a user-friendly AI-powered system that enables users to quickly generate and edit professional proposals. The system is designed to be flexible, allowing for future expansions such as a dashboard and analytics.

System Overview

The AI Proposal system will provide a seamless experience for users to create proposals by inputting project details in plain English. The system will leverage AI to generate a polished proposal that requires minimal edits. The workflow is designed to be intuitive and efficient, ensuring that users can produce high-quality proposals quickly.

Functional Requirements as Story Points

• As a Visitor, I want to access the Landing Page to start creating a proposal.
• As a User, I want to click "Create Proposal" to begin the proposal generation process.
• As a User, I want to fill out the Proposal Information Form with sections for Client Details, Company Details, Project Details, Requirements, Budget, Timeline, and Additional Notes.
• As a User, I want the AI to understand all provided information and create a complete professional proposal.
• As a User, I want the proposal to include a Cover Page, Executive Summary, Problem Statement, Proposed Solution, Scope of Work, Deliverables, Timeline, Pricing, Payment Terms, Assumptions, Terms & Conditions, and Contact Information.
• As a User, I want to use an Interactive Proposal Editor to edit any section, regenerate individual sections, add or remove sections, change tone, improve wording, and see a live preview.
• As a User, I want to finalize the proposal and have options to Download PDF, Copy Content, Share via Link, and Save for Future use.

User Personas

• Visitor: An individual exploring the platform to understand its capabilities.
• User: A registered user who creates and edits proposals using the AI Proposal system.

Core User Flows

1. Visitor Flow:

   • Access Landing Page -> Explore features -> Register as a User

2. Proposal Creation Flow:

   • User logs in -> Clicks "Create Proposal" -> Fills Proposal Information Form -> AI generates proposal -> User edits in Interactive Proposal Editor -> Finalizes and downloads/shares proposal

Visuals Colors and Theme

• primary: #1A73E8 (a deep blue for brand consistency)
• primary_light: #E8F0FE (a lighter blue for hover states)
• secondary: #FF6F61 (a coral hue for emphasis and links)
• accent: #FFD700 (a vibrant gold for CTAs and active states)
• highlight: #FFA500 (a warm orange for notifications and active indicators)
• bg: #FFFFFF (a clean white background)
• surface: rgba(240, 240, 240, 0.8) (a light grey for cards and panels)
• text: #202124 (a dark grey for primary text)
• text_muted: #5F6368 (a softer grey for secondary text)
• border: rgba(218, 220, 224, 0.2) (a subtle grey border)

Signature Design Concept

Interactive Proposal Galaxy

The homepage will feature an "Interactive Proposal Galaxy" where each star represents a different section of a proposal. Users can click on stars to expand sections, drag to rotate the galaxy, and hover to highlight connections between sections. This concept will be built using @react-three/fiber and @react-three/drei for a 3D interactive experience. The galaxy will dynamically update as users add or remove sections, providing a visually engaging and interactive way to navigate the proposal creation process.

Landing Hero Motion Brief

The landing page will feature a continuous motion loop illustrating the transformation of a simple project description into a polished proposal. Using motion/react, the animation will show inputs (e.g., text snippets) gathering around a central document, which then transforms into a complete proposal with visible sections. The animation will loop every 10 seconds, with interactive elements allowing users to pause and explore specific sections.

Interaction Model & Motion Direction

• Intended Interaction Model: Parallax
  • The landing page will use layered depth via scroll, with decorative elements translating at different speeds to create a visually rich first impression. Real content will scroll naturally, enhancing the storytelling aspect of the proposal creation process.

Non-Functional Requirements

• The system must be scalable to accommodate future expansions such as dashboards and analytics.
• The proposal generation process should be completed within one minute.
• The system should support secure access control to protect user data.

Tech Stack

• Frontend: React for Web
• Backend: Python with FastAPI
• Database: MySQL or MariaDB, with Alembic for migrations
• AI Models: GPT 5.4 for user-friendly responses
• AI Tools: Litellm for LLM Routing, Langchain
• Local Orchestration: Docker, docker-compose
• Server-side Orchestration: Kubernetes

Assumptions and Constraints

• The system assumes users have basic familiarity with proposal content and structure.
• The AI model will be trained to understand and generate proposals based on industry standards.
• The system must comply with data protection regulations applicable in India.

Glossary

• AI: Artificial Intelligence
• Proposal: A formal document outlining a project plan, including objectives, scope, and pricing.
• Interactive Proposal Editor: A tool within the system that allows users to edit and customize proposals.
• Parallax: A visual effect where background images move slower than foreground images, creating an illusion of depth.