CHAPTERS
Thanksgiving party hub: the “farm-to-table software” idea
Claire introduces the episode’s goal: vibe-code a personalized Thanksgiving party hub in Lovable to manage guests, potluck dishes, recipes, and photos. She frames it as both a practical holiday tool and a vehicle for learning design and AI workflows.
- •Goal: build a dinner-party hub for invites, dishes, recipes, and photos
- •Why this is a good prototype project for vibe coding
- •Promise: design upleveling tips (fonts + images) and a recipe AI trick
- •Desired vibe: cozy, personalized, host-specific experience
Sponsor break: Why enterprise apps use WorkOS
A short sponsor segment explains why AI tools need deep access to company systems and therefore must meet enterprise security expectations. WorkOS is positioned as a “Stripe for enterprise features,” providing authentication and admin capabilities via APIs.
- •AI apps face IT scrutiny due to access to internal systems
- •Enterprise requirements: auth, access controls, audit logs
- •WorkOS provides drop-in APIs for enterprise readiness
- •Examples of adopters and call to action
Bootstrapping in Lovable: first prompt and V1 feature set
Claire starts the project with a simple Lovable prompt and reviews what the tool generates. The initial app includes core modules (dashboard, guest list, dish coordination, recipe sharing, photo gallery) with a warm autumn palette, but the design doesn’t fully land.
- •Prompt: hub for invites, shared dishes, recipes, photos
- •Lovable chosen for generally stronger “human” design defaults
- •Generated modules: dashboard, guest list, dishes, recipes, gallery
- •Initial critique: readable-but-bland, layout and hero-image issues
Design uplevel strategy: iterate incrementally instead of rewriting everything
She explains her approach to improving vibe-coded apps: make focused, step-by-step refinements rather than dumping a long list of complaints into the model. This keeps changes controlled and avoids losing the plot in regeneration.
- •Identify the biggest visual issues first (hero image, typography, spacing)
- •Avoid huge “fix everything” prompts that lead to noisy results
- •Treat vibe coding as an iterative design process
- •Use the tool to learn by inspecting the files it edits
Typography upgrade with Google Font pairings (Homemade Apple + Raleway)
Claire demonstrates a quick way to dramatically change the app’s feel by swapping fonts. She finds a Google Fonts pairing (via Canva’s combinations list) and prompts Lovable to apply it across headings and body text, then checks the implementation details.
- •Tip: search for curated Google Font combinations to build taste fast
- •Chosen pairing: Homemade Apple (headlines) + Raleway (body)
- •Lovable integrates fonts and updates Tailwind/CSS defaults
- •Bonus: inspecting config files teaches how to set fonts in Tailwind
Custom hero imagery with Midjourney style references
To replace the weak header image, Claire turns to Midjourney and uses a style reference found on X to get a textured, storybook “paper cut-out” aesthetic. She adapts the prompt to generate an autumn harvest-table scene that matches the cozy brand.
- •Use style references/parameter strings to reliably hit an aesthetic
- •Source inspiration: creators sharing Midjourney style codes on X
- •Prompt adapted to “geometric paper, autumnal harvest table”
- •Goal: move from generic stock feel to distinctive, handmade visuals
Fixing aspect ratio and generating a wide hero banner
The first Midjourney output is square, so Claire reuses the prompt and changes parameters to produce a wide banner suitable for a website hero. She highlights this as a practical technique: tune aspect ratio and metadata to fit specific UI placements.
- •Problem: great image, wrong shape for a hero header
- •Midjourney trick: “Use prompt,” remove old AR, set new (e.g., 2:1)
- •Midjourney speed and iteration workflow
- •Select and save the best wide image for the app header
Personalizing the app and dealing with imperfect vibe-coded layout fixes
Back in Lovable, Claire uploads the new hero image, renames the event to “Claire’s Thanksgiving Feast,” and requests more personalized copy. She then tries to fix clipping and navbar spacing via screenshots and prompts—showing both wins and limitations of automated styling fixes.
- •Upload Midjourney image as header background; update title and copy
- •Screenshot-based feedback to point out clipped text and spacing issues
- •Emoji/icon tweak attempt (pumpkin/leaf) and unexpected results
- •Reality check: sometimes you must accept imperfections or edit code manually
Adding guest dietary restrictions via a multi-select field
Claire extends functionality by adding dietary preferences to the guest list, emphasizing the importance of UX-specific language in prompts. Specifying “multi-select” yields a better form design and a useful default list without manual enumeration.
- •Feature: dietary restrictions for guests (vegan, gluten-free, dairy-free, etc.)
- •Prompting tip: be explicit about UI components (e.g., multi-select)
- •Let the tool propose the default options list
- •Improves real-world usefulness for holiday hosting
Mapping dietary tags to potluck dishes (allergens and safe options)
She connects the guest preference model to the dish coordinator by adding allergen/dietary tags to dishes. This enables quick scanning for compatibility and hints at future enhancements like coverage reports or matching guests to safe dishes.
- •Extend data model: propagate diet tags from guests to dishes
- •One-to-one mapping for clarity (vegan, gluten-free, dairy-free, etc.)
- •Example: tag mashed potatoes as vegetarian + gluten-free
- •Future ideas: reports for dietary coverage and menu balance
Recipe pain point: ingredients and instructions split (bad for cooking with kids)
Claire explains why many online recipes are hard to follow: measurements live in a separate ingredients list while steps reference ingredients ambiguously. She sets up her favorite AI remedy—reformatting recipes so each step includes exact quantities.
- •Common frustration: scrolling between ingredients and instructions
- •Kid-friendly cooking needs step-by-step with explicit measurements
- •Target output: steps that embed ingredient quantities inline
- •Use case: faster, cleaner cooking workflow for big holiday meals
ChatGPT 5.1 thoughts + the “bail and restart” prompting tactic
Before reformatting a stuffing recipe, Claire shares impressions of ChatGPT 5.1: improved personality but sometimes too “cute/sassy,” and it may jump straight into execution without clarifying questions. When it feels slow or stuck, she recommends stopping and restarting with a faster mode.
- •5.1 vibe: better personality than 5, but can be overly styled
- •Tool-calling/fast execution can reduce interactive clarification loops
- •Performance: may be slower due to longer thinking
- •Practical trick: stop, switch modes (e.g., Instant), retry the same prompt
Final build: AI-reformatted recipe added to the hub + sharing and wrap-up
Claire pastes the reformatted polenta-and-sausage stuffing recipe into the app, creating a shareable, structured entry with embedded measurements per step. She briefly plugs her kid-friendly recipe site and closes with lessons learned about design iteration, customization, and the limits of vibe coding.
- •Outcome: recipe structured with title/description/times/servings and step-by-step instructions
- •Benefit: easier cooking and sharing among guests; clearer for dietary needs
- •Optional evolution: custom GPT or app-integrated OpenAI calls for auto-formatting
- •Wrap-up: uplevel design with fonts/images, add bespoke features, expect some debugging friction
