Transform your ideas into professional ad images and videos in minutes, powered by AI.
Features • Core Formula • Use Cases • Quick Start • Architecture • Contributing
- What is AdStudio?
- Core Formula
- Generation Pipeline
- Features
- Output Format Matrix
- Use Cases
- AI Engine
- Competitive Position
- Quick Start
- Project Structure
- Technology Stack
- Key Libraries & Their Usage
- REST API
- Configuration
- Development
- Deployment
- Troubleshooting
- Contributing
- Roadmap
- Support & Resources
- License
- Maintainer
- Acknowledgments
AdStudio is an AI-powered ad creation platform that turns three simple inputs — a text prompt, a model image, and a product image — into a polished ad image or short video in minutes(currently under build).
Prompt + Model Image + Product Image → AI Ad Image / Short Ad Video
No design skills. No photoshoot. No video editor. Just describe your idea and AdStudio handles:
- 📝 Script — AI-written copy and voiceover narration tailored to your concept
- 🎭 Visual Composition — Model + product placed into a fully generated scene
- 🔊 Voiceover — Natural-sounding narration with music
- 🎬 Final Edit — Ready-to-publish image or video in every platform format
AdStudio is built around three core inputs that drive everything:
Describe your ad in plain language. AdStudio's LLM parses the prompt to extract:
- Product category and key benefit
- Tone of voice (luxury, playful, urgent, minimal, etc.)
- Target audience and demographic
- Desired call-to-action (CTA)
- Scene mood, setting, and visual style
- Brand colour or aesthetic hints
Example prompt:
"Premium skincare serum for women aged 25–40, dewy glowing skin, soft morning light, pastel tones, CTA: Shop Now"
Upload any photo of a person, character, or avatar. AdStudio:
- Segments and extracts the subject from the background
- Adapts pose and lighting to match the generated scene
- Optionally applies clothing/style transfer to match the ad aesthetic
- Falls back to a curated stock model library if no image is provided
Upload your product photo (raw, packaged, or on white). AdStudio:
- Removes the background automatically
- Infers 3D surface geometry for realistic shadow/reflection synthesis
- Preserves labels, logos, and textures exactly as uploaded
- Places the product naturally into the composed scene with correct perspective
| Output Type | Format | Resolution | Duration |
|---|---|---|---|
| Static Ad Image | PNG / JPEG / WebP | Up to 4K | — |
| Layered Source File | PSD | Up to 4K | — |
| Short Ad Video | MP4 / MOV | Up to 1080p | 5–30 seconds |
Every run generates 3–5 visual variants for you to choose from.
AdStudio processes your three inputs through a 5-stage AI pipeline:
The text prompt is processed by a large language model to produce a structured creative brief — a JSON object defining tone, audience, scene description, copy angle, and CTA. This brief drives all downstream generation.
- Model image: subject segmentation, pose normalisation, lighting estimation
- Product image: background removal, surface normal extraction, label/logo preservation
- Both assets are encoded and passed as conditioning inputs to the visual model
A conditioned image diffusion model (Hugging Face Stable Diffusion) generates the full ad scene — background environment, lighting, depth of field, shadows, and reflections — with the model and product composited in naturally. Multiple variants are generated in parallel.
For video output, an LLM generates a short ad script (hook → body → CTA). Text-to-speech produces a natural voiceover. Captions are auto-timed and styled. Background music is selected or generated to match the mood.
Final assets are transcoded into all requested aspect ratios and resolutions. Exports include source files, platform-spec video files, and a copy bundle (headline + caption + hashtags) for each platform.
Converts natural language into a structured creative brief — no forms or dropdowns required.
- Multi-language prompt support (20+ languages)
- Brand tone detection and scene mood inference
- Target audience and demographic parsing
- Auto-CTA generation with platform-appropriate copy length
Accepts any uploaded photo and adapts it to the ad scene.
- Automatic background removal (SAM 2 / REMBG)
- Pose and lighting adaptation to match scene
- Clothing and styling transfer to match aesthetic
- Stock model library as fallback (50+ diverse models)
Extracts and places products with physical realism.
- Auto background removal with edge refinement
- Shadow and reflection synthesis using inferred surface geometry
- Perspective correction to match scene camera angle
- Full label and logo fidelity — no distortion
Generates complete ad backgrounds and environments.
- Indoor, outdoor, lifestyle, studio, and abstract scene types
- Scene mood presets (golden hour, minimal studio, urban, nature, luxury)
- Seasonal and time-of-day control
- Brand-theme and colour-matched environments
- 3–5 visual variants per generation run
Produces all the text you need for every platform.
- Hook, body copy, headline, subheadline, and CTA
- Platform-specific character length compliance
- A/B headline variants (up to 3 per run)
- Hashtag sets for Instagram, TikTok, and LinkedIn
- Manual edit before export with live preview
Professional AI narration with music for video ads.
- 10+ voice profiles with gender, accent, and emotion controls
- Pace and pause control for sync with visual cuts
- Beat-matched royalty-free background music library
- Volume ducking (voice auto-lowers music during speech)
Stitches all generated assets into a complete short-form ad video.
- Ken Burns / parallax motion on static images
- Animated product reveal sequence
- Auto-timed caption overlays with brand font support
- Transition library (cut, fade, slide, zoom)
- 5–30 second output duration control
Define your brand once and apply it everywhere.
- Logo upload with placement and sizing rules
- Hex colour palette enforcement across all outputs
- Custom font upload (TTF / OTF)
- Multi-brand workspace support for agencies
Edit any element without restarting.
- Element-level regeneration (swap background, change model, re-caption)
- Version history with up to 20 saved states
- Side-by-side variant comparison view
- One-click upscale to 4K
Export in every spec your campaign needs — in one click.
- Batch export: all formats downloaded as a ZIP in one action
- Direct publish to Meta Ads Manager, Google Ads, TikTok Ads Manager
- Canva import via direct link
- Platform spec validator built into export flow
Pre-export checklist to catch common creative mistakes.
- Contrast and text readability checker
- Platform spec violation alerts (text area %, file size limits)
- CTA prominence and placement scorer
- One-click auto-fix suggestions
Built for agencies and marketing teams.
- Shared workspaces with role-based access
- Guest review links (no login required for client review)
- Inline comments on generated assets
- Approval status tracking (Draft → In Review → Approved)
- Shared brand kit and asset libraries
| Aspect Ratio | Name | Primary Use |
|---|---|---|
| 1:1 | Square | Instagram Feed, Facebook Feed |
| 4:5 | Portrait | Instagram Portrait, Pinterest |
| 9:16 | Vertical | Reels, TikTok, Stories, Shorts |
| 16:9 | Landscape | YouTube, Twitter, LinkedIn |
| 1.91:1 | Wide | Google Display, Meta Link Ads |
| 2:3 | Story Portrait | Pinterest, Print |
| A4 | Flyers, Posters, Magazine | |
| Custom | User-defined | Any pixel dimensions |
A skincare brand launches a new serum. They upload the bottle, a lifestyle model photo, and type:
"Luxury skincare, dewy skin, morning routine feel, women 25–40, CTA: Shop Now"
AdStudio generates 5 image ad variants and a 15-second Reel — all ready to push to Meta Ads within minutes. No agency. No photoshoot. No designer.
Key benefits: Launch-day speed, multi-SKU at scale, zero creative team dependency.
An agency managing 30 brand clients uses AdStudio to generate first-draft creatives instantly. Each client has a saved brand kit. A brief becomes 20 ad variants (image + video) in under an hour — reducing creative production time by over 80%. Designers focus only on edge-case refinements.
Key benefits: Brand kit per client, bulk generation, approval workflow, shareable review links.
A performance marketer running paid social needs 10 fresh creative variants weekly to combat ad fatigue. AdStudio lets them swap hooks, change model expressions, and test different CTAs without waiting on design resources — keeping CPMs low and CTR healthy.
Key benefits: Weekly creative refresh, zero design dependency, hook A/B testing at speed.
A beauty influencer creates sponsored content for a cosmetics brand. They upload a selfie as the model image, add the product, write a casual brief, and get a UGC-style ad that looks authentic — without a full production shoot.
Key benefits: Self-image as model, UGC aesthetic output, brand collab deliverables in hours.
A solo founder building a food product has no marketing budget for a photoshoot or agency. They photograph their product with a phone, pick a stock model, write a quick brief, and launch a polished Instagram campaign the same day.
Key benefits: Zero photoshoot cost, same-day launch capability, stock model fallback library.
A Meesho or Amazon seller with 100+ products needs lifestyle images for every SKU. AdStudio auto-generates a lifestyle scene for each product upload in bulk — dramatically improving listing conversion rates without a single studio booking.
Key benefits: Bulk product processing, listing-ready images, regional scene presets.
A mobile app team needs short demo videos for user acquisition campaigns. They use AdStudio to create screen-based ads with a model interacting with the app, a value-prop voiceover, and platform-spec video exports for Google UAC, Apple Search Ads, and Meta.
Key benefits: App screenshot integration, UAC / ASA format export, demo-style video ads.
A FMCG brand running campaigns across India, UAE, and UK needs the same ad localised with different model faces, backgrounds, languages, and cultural cues. AdStudio generates locale-specific variants from a single master prompt by swapping the model image and adjusting the scene brief per region.
Key benefits: Locale-specific scene presets, copy in 20+ languages, model swap per region.
| Capability | Model / Service |
|---|---|
| Image generation and scene composition | Hugging Face (Stable Diffusion XL) |
| Prompt parsing, copy generation (fallback) | LLM |
| Background removal and subject segmentation | Cloudinary / SAM 2 |
| Voiceover synthesis | ElevenLabs / TTS |
| Media hosting and CDN delivery | Cloudinary |
| Capability | AdStudio | Canva AI | Adobe Firefly | Manual Agency |
|---|---|---|---|---|
| Prompt → full ad in < 5 min | ✅ | Partial | Partial | Days |
| Model image + product image fusion | ✅ | ❌ | ❌ | ✅ |
| AI video generation included | ✅ | Limited | ❌ | ✅ |
| Voiceover + script auto-generated | ✅ | ❌ | ❌ | ✅ |
| Platform-spec multi-format export | ✅ | ✅ | Partial | Manual |
| Zero design skills required | ✅ | Partial | ❌ | ✅ |
| Brand kit persistence | ✅ | ✅ | ✅ | ✅ |
| Affordable for solo founders | ✅ | ✅ | ❌ | ❌ |
- Node.js 18+ (Next.js 16 requirement)
- npm 9+ or yarn
- Modern web browser (Chrome, Firefox, Safari, Edge)
- API keys for:
- Hugging Face (Image Generation)
- Cloudinary (media hosting)
- Clerk (authentication)
-
Clone the repository
git clone https://github.com/Vineetpandey0/AdStudio.git cd AdStudio -
Install dependencies
npm install
-
Set up environment variables
cp .env.example .env.local
Configure the following in
.env.local:# Next.js NEXT_PUBLIC_API_URL=http://localhost:3000 # Hugging Face HUGGINGFACE_API_KEY=your_hf_access_token # Cloudinary NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=your_cloud_name CLOUDINARY_API_KEY=your_cloudinary_api_key CLOUDINARY_API_SECRET=your_cloudinary_secret # Clerk Authentication NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key CLERK_SECRET_KEY=your_clerk_secret_key CLERK_SIGN_IN_URL=/sign-in CLERK_SIGN_UP_URL=/sign-up CLERK_AFTER_SIGN_IN_URL=/dashboard CLERK_AFTER_SIGN_UP_URL=/dashboard
-
Run the development server
npm run dev
-
Open in browser Navigate to
http://localhost:3000and start creating ads!
-
Sign Up / Login
- Create an account or log in with existing credentials
- Access your personalized dashboard
-
Create a New Project
- Click "New Project" on the dashboard
- Upload your model image and product image
- Write a detailed prompt describing your ad idea
- Example: "Create a 30-second ad for a fitness app showing people working out, upbeat music, modern visuals"
-
Generate Content
- Submit your inputs
- AdStudio generates script, visuals, and voiceover
- Review and choose from 3–5 generated variants
-
Download & Share
- Export your final video or image in all required formats
- Share directly or download for later use
📦 AdStudio
├── 📂 app/ # Next.js app directory
│ ├── 📂 (auth)/ # Authentication routes
│ ├── 📂 (public-pages)/ # Public-facing pages
│ │ ├── layout.js
│ │ └── page.jsx
│ ├── 📂 agents/ # AI agent implementations
│ ├── 📂 api/ # API routes
│ │ ├── 📂 generate/ # Video generation endpoint
│ │ │ └── route.js
│ │ └── 📂 upload/ # Asset upload endpoint
│ │ └── route.js
│ ├── 📂 dashboard/ # Dashboard pages
│ │ ├── 📂 (dashboard)/ # Main dashboard view
│ │ │ └── page.jsx
│ │ ├── 📂 assets/ # Asset management page
│ │ │ └── page.jsx
│ │ ├── 📂 settings/ # User settings page
│ │ │ └── page.jsx
│ │ ├── 📂 templates/ # Template selection page
│ │ │ └── page.jsx
│ │ └── layout.js
│ ├── 📂 sign-in/ # Sign-in page
│ │ └── 📂 [[...sign-in]]/
│ │ ├── layout.js
│ │ └── page.jsx
│ ├── 📂 sign-up/ # Sign-up page
│ │ └── 📂 [[...sign-up]]/
│ │ ├── layout.js
│ │ └── page.jsx
│ ├── globals.css # Global styles
│ ├── layout.js # Root layout
│ └── manifest.json # Web app manifest
├── 📂 components/ # Reusable React components
│ ├── dashNavbar.jsx # Dashboard navigation
│ ├── dashSidebar.jsx # Dashboard sidebar
│ ├── footer.jsx # Footer component
│ ├── lenis-scroll.jsx # Smooth scroll library
│ ├── navbar.jsx # Main navigation
│ └── section-title.jsx # Section title component
├── 📂 lib/ # Utility libraries
│ ├── cloudinary.js # Image/video hosting integration
│ └── imageService.js # Hugging Face Inference API service
├── 📂 sections/ # Page section components
│ ├── call-to-action.jsx # CTA section
│ ├── features.jsx # Features showcase
│ ├── hero-section.jsx # Landing page hero
│ ├── pricing-plans.jsx # Pricing tiers
│ ├── testimonials.jsx # User testimonials
│ └── workflow-steps.jsx # Workflow demonstration
├── 📂 public/ # Static assets
│ └── 📂 assets/ # Images, icons, etc.
├── .env.local # Environment variables (not in repo)
├── .gitignore # Git ignore rules
├── eslint.config.mjs # ESLint configuration
├── jsconfig.json # JavaScript path aliases
├── next.config.mjs # Next.js configuration
├── package.json # Dependencies and scripts
├── package-lock.json # Dependency lock file
├── postcss.config.mjs # PostCSS configuration
├── proxy.js # CORS proxy configuration
├── tsconfig.json # TypeScript configuration
└── README.md # This file
app/— Next.js 13+ app router pages and API routescomponents/— Reusable UI componentssections/— Self-contained page sections (hero, features, pricing, etc.)lib/— External API integrations and utilitiespublic/— Static assets served directly
- Next.js 16 — React framework with App Router and Turbopack
- React 19 — Modern UI library with latest features
- Tailwind CSS 4 — Utility-first styling framework
- Framer Motion 12 — Advanced animation library
- Lenis 1.3 — Smooth scrolling library
- Lucide React — Beautiful icon library
- Next.js API Routes — Serverless functions for image generation and uploads
- Hugging Face Inference API — Stable Diffusion XL for high-quality ad visuals
- Cloudinary 2.9 — Media hosting, optimisation, and transformations
- Axios — HTTP client for API requests
- Clerk (v7) — Modern authentication and user management
- Zustand 5 — Lightweight state management library
- React Hot Toast 2.6 — Toast notifications
- ESLint 9 — Code quality and linting
- Prettier 3.6 — Code formatting with Tailwind CSS plugin
- PostCSS 4 (Tailwind) — CSS transformation
- TypeScript — Type safety and better DX
- Node.js 16+ — Runtime environment
Zustand manages global application state for user preferences, project data, and UI state with minimal boilerplate.
Hugging Face Stable Diffusion powers the core visual ad generation — producing scenes, compositing model and product images, and generating multiple creative variants from structured prompts via the Hugging Face Inference API.
Cloudinary handles image and video uploads, optimisation, and CDN distribution for fast media delivery.
Framer Motion creates smooth animations and transitions throughout the dashboard. Lenis provides smooth scrolling on the landing page. React Hot Toast delivers real-time notifications. Lucide React provides consistent, scalable icons across the interface.
Clerk handles secure user authentication, sign-up flows, and session management with industry-standard security.
POST /api/generate
Generate an ad image or video from a text prompt and uploaded assets.
// Request
const response = await fetch('/api/generate', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
prompt: 'Create a 30-second fitness app ad',
templateId: 'modern-dynamic',
duration: 30
})
});
// Response
{
"videoId": "v_abc123",
"script": "...",
"status": "generating",
"estimatedTime": "2-3 minutes"
}POST /api/upload
Upload custom model images or product images for use in projects.
const formData = new FormData();
formData.append('file', fileInput.files[0]);
const response = await fetch('/api/upload', {
method: 'POST',
body: formData
});
// Response
{
"assetId": "asset_xyz789",
"url": "https://cdn.example.com/asset_xyz789",
"type": "image"
}Create a .env.local file in the root directory:
# Next.js
NEXT_PUBLIC_API_URL=http://localhost:3000
# Hugging Face (Inference API)
HUGGINGFACE_API_KEY=your_hf_access_token_here
# Cloudinary (Media Hosting)
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=your_cloudinary_name
CLOUDINARY_API_KEY=your_cloudinary_api_key
CLOUDINARY_API_SECRET=your_cloudinary_secret
# Clerk (Authentication)
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=your_clerk_publishable_key
CLERK_SECRET_KEY=your_clerk_secret_key
CLERK_SIGN_IN_URL=/sign-in
CLERK_SIGN_UP_URL=/sign-up
CLERK_AFTER_SIGN_IN_URL=/dashboard
CLERK_AFTER_SIGN_UP_URL=/dashboardHugging Face:
- Visit Hugging Face
- Sign up or log in to your account
- Go to Settings → Access Tokens
- Create a new token with
read(orwrite) permissions - Add to
.env.local— use models likestabilityai/stable-diffusion-xl-base-1.0orrunwayml/stable-diffusion-v1-5via the Inference API
Cloudinary:
- Sign up at Cloudinary
- Get credentials from Account Settings
- Add to
.env.local
Clerk:
- Create account at Clerk
- Create a new application
- Copy publishable and secret keys
- Add to
.env.local
Edit next.config.mjs to customise:
- Image optimisation via Cloudinary
- API rewrites and middleware
- Environment-specific settings
- Webpack plugins and build optimisation
# Install dependencies
npm install
# Start development server with Turbopack (faster builds)
npm run dev
# Build for production with Turbopack optimisation
npm run build
# Start production server
npm start
# Run linter
npm run lintThis project uses Turbopack, Next.js's Rust-based bundler, for significantly faster builds and development experience.
- Create new components in
/components - Add new page sections in
/sections - Store utilities in
/lib - API routes go in
/app/api
This project uses ESLint for code quality. Run npm run lint to check for issues.
- Push your code to GitHub
- Import repository in Vercel Dashboard
- Set environment variables
- Deploy with one click
vercel deployDocker:
FROM node:18-alpine
WORKDIR /app
COPY . .
RUN npm install
RUN npm run build
EXPOSE 3000
CMD ["npm", "start"]Manual Deployment:
npm run build
npm start# Kill process on port 3000
lsof -i :3000 | grep LISTEN | awk '{print $2}' | xargs kill -9
# Or use a different port
npm run dev -- -p 3001- Verify all API keys in
.env.localare correct - Check Hugging Face token permissions and rate limits
- Ensure your Hugging Face account has access to the selected models (some require accepting model terms)
- Check Cloudinary and Clerk quotas and billing status
# Clear cache and reinstall
rm -rf node_modules package-lock.json
npm install
npm run buildFor more help, see Next.js Documentation
We welcome contributions from the community! Here's how to get started:
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Make your changes
- Commit with clear messages (
git commit -m 'Add amazing feature') - Push to your branch (
git push origin feature/amazing-feature) - Open a Pull Request
- Follow existing code style (ESLint)
- Write meaningful commit messages
- Update documentation for new features
- Test changes locally before submitting PR
For detailed guidelines, see CONTRIBUTING.md
- Multi-language support
- Advanced editing tools
- Collaboration features
- Mobile app
- AI model fine-tuning
- Batch video generation
- Model image + product image → ad image (core formula v1)
- Regional scene presets for India, MENA, SEA
- Direct publish to Meta Ads, Google Ads, TikTok Ads Manager
- 📖 Documentation — See
/docsfor detailed guides - 🐛 Report Issues — GitHub Issues
- 💬 Discussions — GitHub Discussions
- 📧 Contact — Reach out to the maintainer
This project is licensed under the MIT License — see LICENSE file for details.
Vineet Pandey
GitHub: @Vineetpandey0
- Built with Next.js 16 and Turbopack
- AI powered by Hugging Face (Stable Diffusion XL)
- Authentication by Clerk
- Media hosting by Cloudinary
- Styling with Tailwind CSS 4
- Animations with Framer Motion
- State management with Zustand
- Icons by Lucide React
⭐ If you find this project helpful, please consider giving it a star!