New blog | Build With Masud | Build With Masud

Project Overviews

A production-ready Full-Stack AI SaaS built specifically for the real estate industry, designed to make generative AI tools accessible and practical for property marketing teams. The platform delivers a suite of creative automation tools — including text-to-image generation and image-to-video transitions — purpose-built around real estate aesthetics and workflows.

Key Features

Multi-Modal AI Engines: Integrated advanced generative models via OpenAI and Anthropic APIs to power high-quality property image generation and fluid image-to-video transitions, enabling realtors to produce polished marketing visuals without creative overhead.

Niche-Specific Prompt Engineering: Built custom prompt orchestration logic using LangChain to enforce real estate-specific visual consistency — staging styles, lighting, architectural framing — ensuring outputs meet professional listing standards.

Subscription & Credit System: Designed a flexible billing infrastructure in Supabase and PostgreSQL supporting monthly/yearly subscriptions alongside pay-as-you-go credit top-ups, modeled around generation quotas per user tier.

Secure Payment Gateway: Integrated Stripe with webhook-driven provisioning to handle encrypted transactions, automated credit allocation, subscription lifecycle management, and a self-serve customer billing portal.

User Workspace & Gallery: Built a personalized dashboard in React and Next.js where users can manage generation history, organize assets, and export in multiple formats — backed by Supabase for real-time state and Cloudinary for optimized media delivery.

Technical Stack

Frontend: Next.js (App Router) with React, Tailwind CSS, and shadcn/ui — focused on responsive design, fast asset rendering, and smooth UX under async generation states.
Backend: Node.js API layer (Next.js API routes / standalone service) handling orchestration between the UI, AI model endpoints, and third-party services.
Database: PostgreSQL via Supabase for structured tracking of user credits, subscription status, generation metadata, and audit history.
Infrastructure: Cloudinary for heavy media asset storage and transformation, with edge-caching for fast delivery; Supabase Edge Functions for serverless background logic.

The Challenge & Solution

The core challenge was managing latency between AI generation jobs and a responsive frontend. I solved this by architecting an asynchronous processing system using webhook callbacks and a polling layer — keeping the UI fully reactive while compute-heavy generation tasks run in the background. This pattern ensured users received real-time progress feedback without blocking interactions or degrading perceived performance.