project-1b73b31e System Requirements Document

Introduction

This document outlines the system requirements for "project-1b73b31e," a B2B SaaS application named "DemoCraft AI." The application enables sales representatives to generate dynamic software demos using React frontends and mock APIs by leveraging the Gemini API.

System Overview

DemoCraft AI is designed to streamline the process of creating software demos for sales purposes. It utilizes a combination of modern web technologies and AI integration to provide a seamless experience for users. The system is structured as a monorepo, housing both the frontend and backend components, along with a PostgreSQL database.

Source Content Inventory

• Frontend: Next.js with App Router and Tailwind CSS for styling.
• Backend: Python FastAPI for API services.
• Database: PostgreSQL with pgvector extension for vector operations.
• AI Integration: Google GenAI SDK (gemini-1.5-flash) for AI capabilities.
• Infrastructure: Docker for sandbox isolation.

Functional Requirements as Story Points

• As a Sales Representative, I should be able to generate dynamic software demos by providing context to the Gemini API.
• As a Developer, I should be able to access a health-check endpoint to verify the backend service status.
• As a System Administrator, I should be able to deploy the application using Docker Compose to ensure consistent environment setup.

User Personas

• Sales Representative: Utilizes the application to create and present software demos to potential clients.
• Developer: Works on maintaining and improving the application, ensuring its functionality and performance.
• System Administrator: Manages the deployment and infrastructure of the application, ensuring it runs smoothly and efficiently.

Core User Flows

• Sales Representative inputs context -> Gemini API processes request -> Dynamic demo is generated.
• Developer accesses /api/health endpoint -> Receives status confirmation -> Proceeds with further development.
• System Administrator runs Docker Compose -> Services are initialized -> Application environment is ready for use.

Visuals Colors and Theme

• primary: #1E3A8A (Deep Indigo)
• primary_light: #3B82F6 (Light Blue)
• secondary: #F97316 (Vibrant Orange)
• accent: #10B981 (Emerald Green)
• highlight: #F59E0B (Amber)
• bg: #F3F4F6 (Light Gray)
• surface: rgba(255, 255, 255, 0.8)
• text: #111827 (Dark Gray)
• text_muted: #6B7280 (Muted Gray)
• border: rgba(209, 213, 219, 0.2)

Signature Design Concept

Interactive Demo Showcase: The landing page will feature an interactive demo showcase where users can see a live preview of the software demos being generated. As users hover over different demo options, the page will dynamically update to show a preview of the selected demo. This will be implemented using motion/react for smooth transitions and animations. The showcase will include a carousel of demo templates that users can scroll through, with each template expanding into a full preview upon selection.

LANDING HERO MOTION BRIEF

The hero section will feature a continuous loop animation where a user inputs data into a form, the data is processed by the Gemini API, and a dynamic software demo is generated and displayed. The animation will use motion/react to create a seamless transition between input, processing, and output, highlighting the efficiency and capabilities of DemoCraft AI.

Interaction Model & Motion Direction

• Intended Interaction Model: Animated
• The landing page will feature moderate scroll-triggered reveals and hover transitions, providing a polished and engaging user experience.

Non-Functional Requirements

• The system must be scalable to handle multiple concurrent demo generations.
• The application should maintain high availability and reliability.
• Security measures must be in place to protect user data and API interactions.

Tech Stack

• Frontend: Next.js with App Router, Tailwind CSS, Lucide Icons
• Backend: Python FastAPI
• Database: PostgreSQL with pgvector extension
• AI Integration: Google GenAI SDK (gemini-1.5-flash)
• Infrastructure: Docker for containerization

Assumptions and Constraints

• The application will be deployed in a Dockerized environment to ensure consistency across different setups.
• The PostgreSQL database will have the pgvector extension installed for vector operations.
• The AI capabilities will be powered by the Google GenAI SDK.

Glossary

• Gemini API: An API provided by Google GenAI SDK for generating AI-driven content.
• pgvector: A PostgreSQL extension for handling vector operations.
• Docker Compose: A tool for defining and running multi-container Docker applications.