• 

  Landing - VardiyaTakas AI Booking Assistant. Natural language entry: "Find barber slot tomorrow"

• 

  2. Service Categories - 4+ services (Barber, Football, Beauty Salon, Gym) with real-time availability powered by WebMCP

• 

  WebMCP Tool Panel - 3 callable tools: uygun_saatleri_bul() - Find Slots, randevu_al() - Book, randevularim_listele() - List Bookings

• 

  Live Agent Execution - Console showing window.mcp calls.

• 

  My Bookings Dashboard - User can reschedule/cancel with green confirmation. Same data used by both human UI and AI agent

Inspiration

Booking a barber or football field in Turkey means 10 sites and WhatsApp. We wanted to fix it.

What it does

VardiyaTakas - AI-first booking. User says "find barber slot tomorrow 14:00-18:00 for Ali" - Agent calls WebMCP uygun_saatleri_bul() to get ALL slots in one call, then randevu_al() to book. My Bookings: reschedule/cancel with green confirmation. Live: https://vardiyatakas-final.vercel.app

How we built it

Next.js 14 + WebMCP tools on window.mcp. Video flow 2:13: 0:00 menus, 0:24 prompt, 1:08 console, 1:34 agent results, 1:44 reschedule, 2:07 cards.

Challenges we ran into

Silent video - solved with SRT captions. Turning booking logic into callable WebMCP tools. Fitting demo in <3min.

Accomplishments that we're proud of

Real WebMCP booking works with ChatGPT. Human-agent collaboration on same data. Proved 10x faster.

What we learned

Build tools for AI, not pages. WebMCP is future.

What's next for Vardiya Takas

Add salons/gyms/clinics, add payment tool odeme_yap(), WhatsApp notifications, launch in Çerkezköy.

Built With

• ai-agent
• automation
• booking-system
• chatgpt
• context
• full-stack
• lucide
• mcp
• next.js
• nextjs
• openai
• react
• tailwindcss
• typescript
• vercel
• vercel-ai-sdk
• webmcp