Back to Selected Works
Live • Free + $39/mo Pro

SupportGenie AI

AI Help Center Builder

StackNext.js 16SupabaseGemini AILemonSqueezyFramer Motion

The Product & Mission

SupportGenie is a comprehensive, enterprise-ready B2B Micro-SaaS engineered to completely replace bloated, legacy customer support tools like Zendesk or Intercom for scaling startups. It acts as an autonomous AI-powered Help Center Builder that allows technical and non-technical founders alike to input messy, unstructured thoughts, bulleted lists, or raw brain dumps. Within milliseconds, the platform's proprietary AI engine synthesizes this data into perfectly formatted, highly professional, and SEO-optimized support articles. Furthermore, SupportGenie operates as a full-fledged Content Management System (CMS), automatically deploying and hosting the company's entire knowledge base on a dedicated, lightning-fast custom sub-route.

Target Audience

High-growth startups, SaaS founders, and agile teams who demand a premium, blazing-fast, and professional support center infrastructure without the exorbitant pricing, complex onboarding, or administrative bloat of traditional enterprise solutions.

The Core Problem

Scaling companies waste hundreds of highly paid engineering and support hours manually writing, formatting, and maintaining documentation in sluggish, expensive tools. SupportGenie completely eliminates this friction by leveraging advanced Gemini AI orchestration to generate structured, professional articles with customizable tones (e.g., technical, friendly) and adaptive template modes (e.g., complex troubleshooting, rapid FAQ).

Architectural Deep Dive

The Content Synthesis Engine

Sub-Second Markdown Generation

Engineered a highly resilient, enterprise-scale Next.js API route that ingests unstructured data and interfaces with the Gemini AI API using complex, strict JSON-schema prompting.

  • Deterministic JSON Output: Enforced rigorous, multi-layered schema generation (title, read time calculation, SEO metadata excerpt, markdown body) ensuring perfectly formatted, highly predictable articles every single time.
  • Multi-Model Fallback Orchestration: Implemented an autonomous, cascading fallback system across the Gemini AI model family (Flash Lite, 3.1, 3.0) to guarantee absolutely zero downtime and consistent API availability even during heavy traffic spikes.
  • Dynamic Tone Mapping: Developed an algorithm to dynamically adjust the LLM's system prompt based on user-selected target audiences, ensuring the output is always brand-aligned.

0ms Dashboard Architecture

Zero Flash / Skeleton

Architected a blisteringly fast, state-of-the-art dashboard experience utilizing advanced Next.js 16 server component data fetching and hydration techniques.

  • Server-Side Prefetching: Complex relational data (profiles, help centers, and hundreds of articles) is fetched concurrently on the edge server, injecting the initial state into a `DashboardSPAClient` to achieve an imperceptible zero-millisecond load time.
  • Optimistic UI Updates: Utilized React 19's `useOptimistic` hook architecture within the client to make article creation, deletion, and edits feel instantaneous, hiding all database latency from the end user.

Supabase & Multi-Tenant Infrastructure

99% Gross Margins

Built a highly optimized, infinitely scalable content delivery network and backend using Next.js App Router and PostgreSQL.

  • Dynamic Slug Routing: Architected a dynamic, highly-cached routing system to seamlessly host public, beautifully rendered, and SEO-optimized help centers on custom `/[startup-name]` endpoints.
  • Strict Multi-Tenant Isolation: Designed an efficient, normalized PostgreSQL schema with impenetrable Row-Level Security (RLS) policies to ensure absolute data privacy between competing organizations.
  • LemonSqueezy Billing Engine: Integrated seamless, atomic webhook fulfillment for Pro-tier subscription upgrades, automatically unlocking premium features like custom branding removal.

Mastery & Skills Acquired

Advanced LLM JSON Schema PromptingNext.js 16 Edge Routing & HydrationZero-ms Dashboard Performance OptimizationEnterprise Multi-Tenant Database Architecture

Post-Mortem: What I Learned

SupportGenie proved that a product's true value lies in its underlying infrastructure. By engineering a robust Content Management System (CMS) and a highly performant hosting environment alongside the core AI generation capabilities, I learned how to architect comprehensive platforms that command premium valuations and provide massive, tangible ROI for enterprise users.

Notes for Technical Recruiters

This project serves as a definitive showcase of my ability to architect complex, multi-tenant AI platforms from the ground up. It highlights my relentless focus on absolute performance (achieving 0ms dashboard loads), bulletproof database security (RLS), and seamless integration of third-party payment gateways (LemonSqueezy).

Let's Make It Happen

always open to new opportunities, collaborations, and creative challenges. Let's work together to bring your ideas to life

Get In Touch
© 2026 M M Afraz. All rights reserved.

M M AFRAZ

SupportGenie AI — AI Help Center Builder | Muhammed Mufinuddin Afraz