Clutch

Inspiration

We've all been there: it's 7 PM, you're starving, and you're stuck in the "scroll of doom", endlessly browsing reviews, checking wait times, and debating with friends. Analysis paralysis takes over, and 30 minutes later, you still haven't eaten.

We built Clutch to be the antidote to indecision. We wanted to create an "Emergency Finder" that takes the cognitive load off the user. Instead of "searching," we wanted a tool that "decides."

What it does

Clutch is a high-agency concierge for emergencies.

• The Panic Button: With one click, it uses your location and Yelp's AI to find the single best spot nearby that is open right now. No lists, no filters, just a high-confidence recommendation.
• AI Concierge: If the first pick isn't perfect, users can chat with the AI (e.g., "Actually, I want sushi") to get tailored "Concierge Picks."
• Smart Booking Intent: The system detects natural language cues like "Let's do 7pm" or "Book a table for 2" and automatically triggers the reservation flow, bridging the gap between chat and action.

Impact: Clutch reduces decision time from 20+ minutes to under 2 minutes, helping users overcome choice paralysis while increasing restaurant discovery and conversion to bookings.

How we built it

• Frontend: Built with Next.js 14 (App Router) for a fast, responsive experience.
• Styling: We used Tailwind CSS to create a custom "Glassmorphism" design system, featuring frosted glass cards, dynamic gradients, and smooth Framer Motion animations to make the app feel premium and alive.
• AI Integration: We leveraged the Yelp Fusion AI API (/ai/chat/v2). We built a custom parser to intercept the AI's natural language responses and render them as structured UI components ("Concierge Picks") instead of just blocks of text.
• Logic: We implemented regex-based intent detection to identify when a user wants to book a table, creating a seamless handoff from conversation to conversion.

Technical Highlights

• Custom AI Parser: Built a sentence-level regex parser that detects restaurant names in natural language (e.g., "Sushi Kuni is known for...") and extracts them into structured { title, body } objects for rendering as interactive cards.
• Intent Detection Engine: Regex-based system that recognizes booking phrases like "let's do 7pm", "party of 4", and "book a table" to automatically trigger the reservation modal.
• Performance Optimization: Optimized glassmorphism effects (backdrop-blur) with hardware-accelerated CSS to maintain 60fps on mobile devices.
• Code Quality: TypeScript throughout, Server Actions for API calls, clean component architecture with proper state management.

Challenges we ran into

• Unstructured AI Responses: The Yelp AI returns natural language, which is great for chat but hard for UI. We had to build a robust parser to detect when the AI was listing restaurants so we could render them as interactive cards with "Book" buttons.
• Handling "Booking" without Write Access: The Yelp API doesn't currently allow creating reservations programmatically. We solved this by building a "Simulation Mode"—detecting the intent and opening a realistic reservation modal that acknowledges the limitation while demonstrating the ideal user flow.
• Glassmorphism Performance: Creating heavy blur effects (backdrop-filter) can be performance-intensive. We had to carefully optimize our CSS layers and use hardware-accelerated animations to keep the app buttery smooth on mobile.

Accomplishments that we're proud of

• The "Concierge Picks" UI: We're really proud of how we transform raw text from the AI into a beautiful, structured list of recommendations. It feels like magic.
• Natural Language Booking: Getting the app to understand "Lets do the sushi place at 7" and immediately opening the booking modal feels incredibly high-agency and futuristic.
• The Aesthetic: We moved away from the standard "directory" look and created something that feels like a premium, dark-mode app you'd use on a night out. The glassmorphism design, smooth animations, and mobile-first approach create a cohesive, polished experience.
• Solving a Real Problem: We validated the "decision paralysis" problem with friends and saw immediate "aha!" moments when they used the Panic Button.

What we learned

• Prompt Engineering vs. Parsing: We learned that sometimes you can't just prompt the AI to give JSON; you have to build resilient frontend parsers to handle the variability of natural language responses.
• The Power of "Less": By removing filters, sorting, and endless lists, we actually added value. Constraining choice is a feature, not a bug.
• Differentiation Through UX: While Yelp, Google Maps, and OpenTable optimize for search, we learned there's a huge opportunity in optimizing for decision. The "I'm Feeling Lucky" approach for dining doesn't exist yet, and users crave it.

What's next for Clutch

• Real Booking Integration: Once APIs allow, we want to close the loop and actually book the table, turning Clutch into a true end-to-end solution.
• Social Mode: "Clutch for Groups"—where friends can hit the panic button together, and the AI finds the optimal intersection of their tastes and locations.
• Voice Mode: We experimented with voice input (and have the code for it!) but want to refine the latency to make it feel like a real-time conversation with a concierge.
• Broader Impact: Expand beyond dining to other high-paralysis decisions: "Emergency Movie Night", "Emergency Date Spot", etc. The core insight—reducing choice to increase action—applies to many domains.

Built With

• framer
• next.js
• tailwind
• yelpfusionaiapi