3rd Place
VibeCheck
**VibeCheck** — a UI/UX research agent that automatically audits any product's onboarding experience.
Core trick
Playwright follows the primary CTA through each signup step, and Gemini 3.1 Pro analyzes the screenshot sequence.
Description
**VibeCheck** — a UI/UX research agent that automatically audits any product's onboarding experience.
You paste a URL. The agent uses Playwright to navigate the signup flow step by step — landing page → primary CTA click → auth/sign-up screen — capturing a full-page screenshot at each step. It then sends those screenshots to Gemini 3.1 Pro, which returns a structured design analysis: the product's design language (colors, typography, UI components, animation vibe), a mapped user flow with decision points, inferred design decisions, and vibe keywords.
The result is a visual storyboard of the onboarding journey — each captured screen shown in sequence with Gemini's analysis — so designers can instantly see how a product presents itself to new users, without manually clicking through dozens of flows themselves.
**Stack:** Next.js 15 (App Router) · Playwright · Gemini 3.1 Pro Preview (`@google/genai`) · TypeScript · Tailwind CSS 4
README excerpt
# paris-gemini3-hackathon ## Dev ```bash npm install npm run dev ``` Open `http://localhost:3000`. ## AI Rules See `AGENTS.md`.