How I AIHow to use Cursor for interactive prototypes, sound design, and data visualization
CHAPTERS
- 0:00 – 1:04
Designers using Cursor as a creativity engine (and how to “teach taste”)
Elizabeth frames Cursor as a creative partner for designers, not just a coding assistant. She explains that “good taste” often comes from feeding the model broader, unexpected inspiration and iterating repeatedly to discover surprising outcomes.
- •Cursor can be a creativity tool for designers, not only engineers
- •“Teach taste” by broadening reference inputs (art, music videos, unusual sources)
- •Reusing the same prompt can yield wildly different visual results
- •Idea: have Cursor generate reusable “notes/rules” that describe what worked visually
- 1:04 – 2:45
Show context + sponsor: what this episode will cover
Claire introduces Elizabeth as a designer who uses Cursor for aesthetic exploration, interactive prototypes, and improving ugly dashboards. A brief sponsor segment highlights Lovable as a way to build functional apps via chat.
- •Episode promise: aesthetics exploration, interactivity + sound, dashboard makeover
- •Elizabeth is positioned as a Cursor “power user” for designers
- •Sponsor mention: Lovable for quickly building and deploying apps
- •Theme: prototyping speed and accessibility
- 2:45 – 4:35
From Neopets energy to modern prototypes: visual play and style exploration
Elizabeth shows examples of playful, chaotic prototypes—sparkly cursors, animated cards, and cyberpunk-inspired 3D layouts. She contrasts experimental “chaos modes” with safer, modern design examples to show range.
- •Playful web aesthetics (GIFs, sparkly cursor, animated cards) are easy to prototype
- •Using a K-pop screenshot as inspiration to drive cyberpunk palettes and mood
- •Iterating from an unappealing first draft into something exciting
- •Demonstrates both experimental and “safe/modern” design directions
- 4:35 – 7:02
Demo setup: starting from a blank homepage and asking Cursor for aesthetics
Elizabeth begins with a plain page (no CSS) and uses a meta-prompt to ask Cursor which design movements it can implement. The goal is to generate vocabulary and options before choosing a direction.
- •Start with a boring baseline to make transformation visible
- •Prompt: ask Cursor what aesthetics/movements it can implement and describe them
- •Cursor tends to be strongest on popular internet styles (e.g., vaporwave)
- •Using the model to learn descriptive language for styles (e.g., cyberpunk traits)
- 7:02 – 10:17
Brutalist + Y2K redesign: letting the model surprise you
Claire picks two contrasting styles (brutalist and Y2K) and Elizabeth prompts Cursor to redesign the page. The result includes unexpected UI flourishes—typing animations, extra glow, and hover effects—sparking new directions.
- •Prompting for multiple styles at once can generate bold, hybrid outcomes
- •AI introduces implementation details (typing animation, glow/hover behaviors)
- •Workflow mindset: start broad, then refine based on what’s interesting
- •AI-generated “extra” effects can be toned down or repurposed
- 10:17 – 12:36
Iteration workflow: restore checkpoints, rerun prompts, and compare versions
They rerun the exact same prompt and get a different result, underscoring non-determinism. Elizabeth emphasizes restoring checkpoints early and often, and saving screenshots to preserve good iterations.
- •Same prompt ≠ same result; variability is part of the process
- •Use “Restore Checkpoint” to avoid getting stuck in bad branches
- •Take screenshots to preserve ideas you might want back later
- •Re-prompt vs. designer-led iteration: both are valid next steps
- 12:36 – 14:21
Interactive + sound prototype: a working digital piano in one prompt
Elizabeth demos a functional piano prototype that plays sound and supports different waveforms, illustrating why “real code” prototypes outperform traditional design tools for sound and interaction. Claire highlights how sound and motion can add joy and brand to products.
- •A working piano (sound + interaction) is hard in Figma but easy with code
- •Single-prompt generation can produce functional interactive prototypes
- •Sound controls (waveform changes) show rapid experimentation potential
- •Design value: sound, motion, and interactivity can create delight and branding
- 14:21 – 18:24
Behind the scenes: Cursor Rules for fast, repeatable prototyping
Elizabeth starts a fresh chat and prompts a new piano in an old Mac OS style, powered by simple Cursor Rules that scaffold new prototypes. The rule copies a template folder and auto-links the new prototype from the homepage.
- •Start new chats to avoid unintended context bleed
- •Prompt: create a new prototype (digital piano, old Mac OS style)
- •Cursor Rules automate boilerplate: copy template folder + update homepage
- •Result: a functional Mac-styled piano generated and wired up quickly
- 18:24 – 20:59
Applying Cursor in real teams: design systems and component foundations
Elizabeth explains the shift from playful demos to practical team use: integrating design systems and reusable components. She compares it to migrating from Sketch to Figma—upfront component work enables faster prototyping for everyone.
- •To use Cursor at work, you need design-system-aligned components in code
- •Upfront investment makes designer-friendly prototyping scalable
- •Analogy: migrating libraries/components (Sketch → Figma style transition)
- •Teams can prototype faster once a component subset is prepared
- 20:59 – 29:32
Taste as prompting: turning an ugly finance dashboard into something polished
Elizabeth walks through improving a messy finance dashboard via short, targeted prompts and strong references (e.g., Robinhood/Cash App/Stripe, Edward Tufte, “Apple-level” approval). She shows an iterative approach: remove obvious issues, then refine layout and color discipline.
- •Start with critique: chaotic colors, heavy shadows, weak typography, awkward layout
- •Use short prompts focused on 1–2 changes (avoid “laundry lists”)
- •Reference admired products to shortcut explanation (Stripe/Robinhood/Cash App)
- •Iterate: remove shadows → fix background coverage → simplify palette (Tufte) → improve grid/layout (Apple-level)
- 29:32 – 31:12
Data-driven prototypes with real data: Notion-powered apps (Goodreads for yourself)
Elizabeth shares building prototypes powered by Notion databases, like a personal bookshelf that could evolve into a custom Goodreads. The point: Cursor shines when prototypes need real data and dynamic UI, beyond static mockups.
- •Cursor is especially useful for prototyping with real, changing data
- •Integrating with Notion DB enables quick personal apps (bookshelf example)
- •UI layer can be customized while Notion remains the source of truth
- •Opens analysis possibilities (ratings patterns, favorite authors, reading stats)
- 31:12 – 34:16
Lightning round: what stays handmade, how to stay creative, and when to restart
In quick Q&A, Elizabeth shares what she still loves doing manually (playful graphic edits), how to avoid AI sameness (broaden inspiration), and her tactic when AI won’t listen (restart). Claire adds a practical tip for getting subtle animations: exaggerate the instruction.
- •Some creative processes are fun specifically because they’re manual (posters, Photoshop antics)
- •To create new styles, feed unconventional inspiration; avoid default “same dataset” outputs
- •AI often overdoes animations; repeat “more subtle” or restart entirely
- •Tip: use extreme phrasing like “1,000x more subtle” to steer behavior
- 34:16 – 35:07
Where to find Elizabeth + closing outro
Elizabeth shares where to follow her and her Cursor prototyping course. Claire closes with subscription, comments, and podcast links.
- •Elizabeth: online handle “lalizlabeth”
- •Course: “Prototyping with Cursor” at designisaparty.com
- •Call to action: like/subscribe/comment, listen on podcast platforms
- •Show info: howiaipod.com
