Skip to content

Repository files navigation

🛋️ Moodboard AI — Landing Page

The marketing site for Moodboard AI, a SaaS platform that helps interior designers turn product URLs into client-ready moodboard presentations in minutes, not hours.

Next.js TypeScript Tailwind CSS Supabase Polarsh n8n


📖 About

Most interior designers spend 3–4 hours manually building moodboards for clients — scraping product pages, organizing images, and formatting a presentation by hand. Moodboard AI automates that entire workflow, cutting creation time down to under 30 minutes.

This repo is the landing page: the public-facing site where designers discover the product, see it in action, and sign up.

🔗 Live site: moodboard creator

✨ What the product does

(Shown on the landing page — the actual app lives in a separate repo.)

  • URL-to-moodboard automation — paste product URLs, get a client-ready moodboard presentation
  • AI room inpainting — designers upload a photo of an empty room, mask the area they want to furnish, and AI generates realistic 3D furniture placed directly into that space
  • Drag-and-drop editing — designers can rearrange and customize moodboards visually
  • Pricing automation — product pricing pulled and synced via Google Sheets
  • Client-ready output — polished presentations designers can send directly

🎯 Landing Page Sections

  • Hero with product demo
  • Problem/solution walkthrough (before vs. after: 3-4 hours → 30 minutes)
  • Feature highlights (AI visualization, drag-and-drop, pricing sync)
  • Social proof / testimonials
  • Pricing plans (Stripe-powered checkout)
  • FAQ
  • Sign-up / CTA

🎥 Demo

▶️ Watch the YouTube Demo

📸 Screenshots

Image

Image

Image

Image

Image

🛠️ Tech Stack

Layer Technology
Framework Next.js
Styling Tailwind CSS
Auth Supabase Auth
Payments Stripe (checkout + billing)
Analytics (add your provider, e.g. Vercel Analytics, PostHog)
Hosting Vercel

🚀 Getting Started

Prerequisites

  • Node.js 18+
  • A Supabase project (for auth-gated CTAs, if applicable)
  • Polarsh account (for pricing/checkout integration)

Setup

# clone the repo
git clone https://github.com/<your-username>/moodboard-landing.git
cd moodboard-landing
 
# install dependencies
npm install
 
# set environment variables
cp .env.example .env.local
# fill in: NEXT_PUBLIC_SUPABASE_URL, NEXT_PUBLIC_SUPABASE_ANON_KEY, STRIPE_PUBLISHABLE_KEY
 
# run the dev server
npm run dev

The site will be running at http://localhost:3000.

Build for production

npm run build
npm start

📁 Project Structure

├── app/                 # Next.js app router pages
├── components/          # Reusable UI components
├── public/              # Static assets (images, demo GIF/video)
├── styles/              # Global styles
└── .env.example         # Environment variable template

(Adjust to match your actual folder layout.)

📈 Results

  • Reduced moodboard creation time by 80% (3-4 hours → under 30 minutes)
  • First paying client acquired

📄 License

This project is proprietary — all rights reserved. (Change this if you intend to open-source parts of it.)

👤 Author

Ahmed Afli AI Engineer & Full-Stack Developer Portfolio

About

AI SaaS that turns product URLs into client-ready moodboards for interior designers — including AI room inpainting to visualize 3D furniture in empty spaces.

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages