CreatorMatch AI

CreatorMatch AI is a TikTok Shop campaign assistant prototype that helps merchants move from product idea to creator outreach faster.

It generates:

• a trend-aware product narrative ("Cultural DNA"),
• a short-form campaign brief,
• ranked creator suggestions,
• direct creator outreach actions,
• and smart-contract-style escrow milestone tracking for campaign confidence.

Live demo

• Production URL: https://creator-match-ai.vercel.app/

Why this project

Creators are one of the highest-leverage growth channels for TikTok Shop, but campaign setup is slow:

• researching creator fit takes time,
• script creation is inconsistent,
• and trust around payout/release flow is often unclear.

CreatorMatch AI packages those steps into one guided workflow to reduce time-to-launch.

End-to-end campaign flow

1. Merchant inputs a product and target persona.
2. AI generates a campaign brief and cultural positioning.
3. Creator Match Engine ranks best-fit creators.
4. Merchant takes direct action:
   • Send Collab Request (direct outreach intent)
   • Initiate Contract (start agreement flow)
5. Smart-contract-style escrow module tracks milestones:
   • Content approval
   • Post verification
   • Auto-release stage

This design demonstrates not just discovery and planning, but also activation and payout-flow confidence in one product experience.

Core features

1) Product analysis input

• Product image upload UI (currently visual-only in this prototype)
• Product name, description, price, persona, category, and region
• "Load example product" for quick demo setup

2) AI-generated campaign outputs

• Cultural DNA: audience fit, tone, and hashtag recommendations
• Smart Brief: hook, body, CTA, and trend note
• Copy-to-clipboard support for quick reuse

3) Creator Match Engine

• Ranked creator list with reasoning and score
• Multiple sort modes:
  • Top Matches
  • Budget Friendly
  • High Reach
• Profile links + action drawers for:
  • Send Collab Request (direct creator reach-out)
  • Initiate Contract (agreement start)

4) Decision support modules

• Product vs market benchmark cards
• Trend velocity chart
• Contract security card with smart-contract-style escrow milestones
• Session activity timeline

5) Smart contract and escrow experience

• A contract security module is shown as part of the results flow
• Includes a contract hash and milestone progression states
• Demonstrates payout confidence design with escrow-like logic:
  • hold phase
  • verification phase
  • release phase
• Connects directly with the creator action flow ("Initiate Contract")

6) Demo reliability

• If live AI analysis is unavailable, the app falls back to deterministic demo data
• This ensures a complete end-to-end walkthrough during interviews and demos

Tech stack

• Framework: Next.js (App Router) + TypeScript
• Styling: Tailwind CSS
• Animation/UI behavior: Framer Motion
• Charts: Recharts
• Validation: Zod
• AI integration: OpenAI API with structured JSON response handling

Architecture overview

• app/page.tsx

  • Main single-page product experience
  • Handles analyze flow, loading steps, and results rendering

• app/api/analyze/route.ts

  • API route for analysis
  • Calls model, normalizes output, and validates response shape

• lib/schema.ts

  • Shared Zod schema for response contracts

• lib/creators.ts

  • Source creator records used for matching display and normalization

• lib/demo-data.ts

  • Deterministic fallback payloads and sample product metadata

• components/ui/

  • Reusable design-system-like UI components

Local development

Prerequisites

• Node.js 18+
• npm

Run locally

npm install
cp .env.local.example .env.local
# Add your key
# OPENAI_API_KEY=your_key_here
npm run dev

Open http://localhost:3000.

Environment variables

• OPENAI_API_KEY (required for live analysis)

When this key is missing or the API call fails, the app switches to demo fallback data.

Deployment (Vercel)

This app is deployed on Vercel.

Typical deployment steps:

1. Push code to GitHub
2. Import repository into Vercel
3. Add OPENAI_API_KEY in project environment variables
4. Deploy

Live URL: https://creator-match-ai.vercel.app/

Data transparency

For demo clarity:

• Creator profile links point to real TikTok profile paths
• Performance metrics and benchmark values are demo/estimated in this prototype
• Smart-contract/escrow states are simulated to represent product flow design
• The project is intended to demonstrate product UX, workflow design, and AI-assisted decision support

Roadmap ideas

• Real image upload and vision-assisted analysis
• TikTok campaign performance API integrations
• Persistent workspaces and campaign history
• Contract workflow integrations (real escrow/payment rails)
• Team collaboration and approval flows

Repository hygiene

• Keep .env.local private and untracked
• Use .env.local.example as the public template