Inspiration
The "Drop Culture" is massive, but the tools to support it are stuck in 2010. We noticed a huge gap in the creator economy: The Friction of "The Drop." If a creator wants to sell 50 limited-edition hoodies today, they have two bad options:
High Effort: Build a custom Shopify store, hire a designer for the "vibe," and spend days coding just to sell out in 10 minutes. Low Vibe: Send a boring, generic checkout link (Gumroad/Stripe) that feels cheap and kills the hype. We asked: "What if an AI could act as your Creative Director?" What if you could trade friction for a "vibe"—turning a single product image into a high-end, immersive launch event in 30 seconds? That question led us to build Ceres.
What it does
Ceres is an AI-Powered Launchpad for Instant Commerce. It transforms a simple intent to sell into a full brand experience in three steps:
The Studio (Seller): The seller uploads one image and types a "Vibe" (e.g., "Cyberpunk Tokyo Rain" or "90s Retro VHS"). They don't drag widgets or pick colors. The Vibe Engine (AI): Our AI analyzes the prompt and instantly generates a bespoke, high-conversion storefront. It architecturally constructs the React layout, selects the color palettes from scratch, writes "hype-inducing" copy (headers, CTAs), and configures the Flowglad checkout—all tailored to that specific aesthetic. The Alive Dashboard (Reactive): This is where we break the mold. Once the drop is live, the seller gets a dashboard that reacts to real-time sales. It’s not a static spreadsheet. Hype State: If sales are flying, the dashboard glows gold, adds particle effects, and the AI agent celebrates with you. Quiet State: If traffic is high but conversion is low, the UI shifts to orange, and the AI offers optimization tips (e.g., "Run a flash sale"). Ghost State: If it's dead, the AI offers social sharing strategies.
How we built it
We prioritized a bleeding-edge stack to ensure speed and modularity:
The Brain (AI): We used Anthropic Claude 3.5 Sonnet as our "Creative Director." We engineered a complex system prompt that forces the LLM to output strict JSON configurations that map perfectly to our UI component library. The Core: Next.js 16 (App Router) provided the backbone, allowing us to use Server Actions for seamless mutations. Styling: We used Tailwind CSS v4 and Shadcn/UI to build a design system that is flexible enough to be "themed" dynamically by the AI. Payments: We leveraged Flowglad to abstract away the complexity of payments. We use the Flowglad SDK to programmatically create products and generate checkout sessions on the fly. Backend: PostgreSQL (via Neon) coupled with Drizzle ORM gave us type-safe database interactions. Infrastructure: Clerk handles our secure authentication, and Uploadthing manages the media assets. Real-Time: We implemented Webhooks to listen for Flowglad payment events, which instantly trigger state changes in our "Alive Dashboard" (inventory decrementing + UI mutation).
Challenges we ran into
Taming the LLM: Getting an AI to "design" a website is hard. Early versions would output invalid hex codes or broken layouts. We had to build a robust "VibeConfig" schema and iterate on the prompt engineering until the AI understood how to map abstract concepts (like "gloomy") to concrete Tailwind utility classes (bg-slate-900, text-emerald-400). The Async Dance: Orchestrating the "Create Drop" flow was complex. In a single request, we have to: upload an image, ask Anthropic for a design, save to Postgres, and register a product with Flowglad. Making this feel "instant" (under 30s) required careful optimization of our Server Actions. Reactive State: Designing the "Alive Dashboard" meant mapping abstract metrics to UI states. We had to define thresholds for "Hype" vs. "Quiet" and ensure the frontend updated immediately via webhooks without requiring a refresh.
Accomplishments that we're proud of
The "Vibe" Effect: Seeing the AI take a weird prompt like "Matrix Glitch" and actually generating a green-terminal-themed store with "Jack In" buttons felt like magic. It proved Generative UI works. Zero-Config Commerce: We successfully abstracted away all payment setup. A user just types a price, and we handle the backend connection to Flowglad instantly. The Dashboard UI: We're really proud of the "Alive" concept. Making a dashboard that feels like a video game HUD rather than an Excel sheet was a huge UX win.
What we learned
Generative UI is the future: You don't need drag-and-drop builders if the AI truly understands your intent. Flowglad is fast: Integrating payments used to take days of compliance and setup. With the SDK, we treated payments as just another function call. Vibes are Currency: In the creator economy, the aesthetic is the product. Tools need to respect that and help creators amplify it, not flatten it.
What's next for Ceres
Real-time Multiplayer: Letting thousands of buyers see each other "waiting in line" on the drop page (creating digital FOMO). Physical Merch Integration: Connecting directly to print-on-demand services so sellers don't even need to touch inventory. iOS Command Center: A mobile app for sellers to watch their drops explode from their pocket with haptic feedback for every sale.
Built With
- anthropic
- clerk
- drizzle-orm
- flowglad
- next.js
- postgresql
- shadcn-ui
- tailwind-css
- typescript
- uploadthing
Log in or sign up for Devpost to join the conversation.