Flowmart

byvidhi

give me ui for my project where only 2 users will be there admin and user or buyer who'll purchase the workflows name of project is flowmart-workflow automation marketplace

Landing
Landing

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirement Document
Page 1 of 6

Flowmart System Requirements Document

1. Introduction

Flowmart is a workflow automation marketplace designed to facilitate the purchase and management of automated workflows. The platform caters to two primary user personas: buyers, who purchase workflows, and administrators, who manage the platform's operations.

2. System Overview

Flowmart provides a seamless experience for users to browse, purchase, and manage workflows. The platform is divided into three main modules: Public, Buyer, and Admin. Each module is designed to cater to the specific needs of its users, ensuring a streamlined and efficient workflow management process.

Page 2 of 6

3. Functional Requirements as Story Points

  • As a Public User, I should be able to access the landing page to learn about Flowmart.
  • As a Public User, I should be able to browse available workflows.
  • As a Public User, I should be able to view detailed information about a specific workflow.
  • As a Public User, I should be able to register for an account.
  • As a Public User, I should be able to log in to my account.
  • As a Public User, I should be able to recover my password if forgotten.
  • As a Buyer, I should be able to access my dashboard to view my activities.
  • As a Buyer, I should be able to browse the marketplace for available workflows.
  • As a Buyer, I should be able to view my purchase history.
  • As a Buyer, I should be able to manage my profile information.
  • As a Buyer, I should be able to proceed to checkout and complete a purchase.
  • As a Buyer, I should be able to view a success page after a successful purchase.
  • As a Buyer, I should be able to download purchased workflows.
  • As a Buyer, I should be able to see how workflows operate by clicking a play button.
  • As an Admin, I should be able to log in to the admin dashboard.
  • As an Admin, I should be able to manage workflows, including adding and editing them.
  • As an Admin, I should be able to manage orders.
  • As an Admin, I should be able to manage buyer information.
  • As an Admin, I should be able to view analytics related to platform usage.
  • As an Admin, I should be able to ensure workflows are automatically saved to a drive.
Page 3 of 6

4. User Personas

  • Public User: An individual who visits the platform to explore available workflows and potentially register as a buyer.
  • Buyer: A registered user who purchases workflows and manages their profile and purchase history.
  • Admin: A platform administrator responsible for managing workflows, orders, buyers, and analytics.

5. Core User Flows

  • Public User Flow:

    • Visit landing page -> Browse workflows -> View workflow details -> Register/Login -> Recover password if needed
  • Buyer User Flow:

    • Access dashboard -> Browse marketplace -> View purchases -> Manage profile -> Checkout -> View success page -> Download workflows -> Click play button to see workflow operation
  • Admin User Flow:

    • Login -> Access dashboard -> Manage workflows -> Add/Edit workflows -> Manage orders -> Manage buyers -> View analytics
Page 4 of 6

6. Visuals Colors and Theme

  • primary: #1E90FF (Dodger Blue)
  • primary_light: #63B8FF (Light Dodger Blue)
  • secondary: #FFD700 (Gold)
  • accent: #FF4500 (Orange Red)
  • highlight: #32CD32 (Lime Green)
  • bg: #F5F5F5 (White Smoke)
  • surface: #FFFFFF (White)
  • text: #333333 (Dark Gray)
  • text_muted: #777777 (Gray)
  • border: #DDDDDD (Light Gray)

7. Signature Design Concept

Interactive Workflow Showcase

The homepage will feature an interactive showcase of workflows. Users can click on a workflow to see a dynamic animation of how it operates, similar to a Gmail attachment being automatically saved to a drive. This animation will be interactive, allowing users to click a play button to start the demonstration. The animation will use motion/react for smooth transitions and interactions, providing an engaging and informative experience.

Page 5 of 6

LANDING HERO MOTION BRIEF

The landing hero will feature a dynamic illustration of a workflow being transformed into a completed task. The animation will show inputs gathering around a central workflow icon, which then transforms into a completed task, symbolizing the automation process. This will be a continuous 10-second loop with interactive elements that users can hover over to see additional details. The animation will be built using motion/react for seamless integration and responsiveness.

8. Interaction Model & Motion Direction

  • Intended Interaction Model: Animated
    • The landing page will feature moderate scroll-triggered reveals and hover transitions. Interactive elements will have spring physics for a polished user experience.

9. Non-Functional Requirements

  • The system must ensure secure access control for all user data.
  • The platform should be responsive and accessible across various devices and screen sizes.
  • Workflows must be automatically saved to a drive upon purchase.
Page 6 of 6

10. Tech Stack

  • Frontend: React for Web
  • Backend: Python, FastAPI
  • Database: MySQL or MariaDB
  • AI Models: Not applicable
  • AI Tools: Not applicable
  • Local Orchestration: Docker, docker-compose
  • Server-side Orchestration: Kubernetes

11. Assumptions and Constraints

  • The platform will support only two user roles: Buyer and Admin.
  • All workflows will be digital and automatically saved to a drive upon purchase.
  • The platform will operate primarily in the Indian market, adhering to local regulations and standards.

12. Glossary

  • Workflow: A sequence of automated processes that can be purchased and managed on the platform.
  • Buyer: A registered user who purchases workflows.
  • Admin: A user with administrative privileges to manage the platform's operations.
Admin Login: Sign In
Admin Dashboard: View Stats
Manage Workflows: View List
Add/Edit Workflow: Create Workflow
Orders: Manage Orders
Buyers: Manage Buyers
Analytics: View Reports
Admin Login: Sign In
Admin Dashboard: View Stats
Manage Workflows: View List
Add/Edit Workflow: Create Workflow
Orders: Manage Orders
Buyers: Manage Buyers
Analytics: View Reports