Skip to content

By playing, you agree to uListen's Terms and Privacy Policy and YouTube's Terms of Service.

How I AIHow I AI

A designer’s guide to AI: Why this designer switched to Cursor | Joel Unger

Joel Unger, design director at Atlassian, shares how AI is transforming the way he designs Trello and other products.

Claire VohostJoel Ungerguest
May 11, 202520mWatch on YouTube ↗

Summaries, chapters, transcripts, and FAQs on this page are made by uListen, not YouTube.

At a glance

WHAT IT’S REALLY ABOUT

Designer uses Cursor and Midjourney to prototype, animate, explore

  1. Design director Joel Unger (Atlassian/Trello) shares how AI shifted his workflow from static specs toward interactive prototypes and rapid asset iteration.
  2. He demonstrates using Cursor to turn Figma concepts into working UI prototypes (e.g., resizable, draggable multi-panel layouts) that enable clearer engineering conversations.
  3. He also shows a time-sensitive brand update: recreating an animated logo by converting an old animated GIF into an animated SVG with AI-assisted code.
  4. Finally, he uses Midjourney as an exploratory “mood board” generator to help a team converge on a consistent illustration style for Trello’s mascot, reinforcing that AI accelerates thinking and iteration rather than replacing design judgment.

IDEAS WORTH REMEMBERING

5 ideas

AI makes interaction design testable earlier than static mockups.

Unger found Figma insufficient for exploring real drag/resize behaviors; Cursor-enabled prototypes let him stress-test edge cases (min widths, breakpoints, collapsed states) quickly and concretely.

Designers can use code prototypes as “interactive specs,” not production code.

He emphasizes engineers still need enterprise-quality code (tests, scalability), but prototypes accelerate shared understanding and unblock decisions about behavior and constraints.

The biggest time savings is reclaiming time for problem-solving.

Unger frames Figma as “maybe 10% of the job,” with most value in thinking; AI speeds the “get ideas out of your head” phase so designers can focus on gnarlier problems sooner.

AI-assisted asset work can rescue last-minute deadlines.

When a logo swap revealed an old animated GIF, he used Cursor plus an SVG source to recreate the motion as an animated SVG, avoiding a manual After Effects rebuild.

Midjourney is strongest as exploration input, not final brand output.

For Trello’s mascot Taco, he used image prompting to generate variations that serve as a mood board, helping the team decide on concrete style-guide attributes (fur, brows, paws) before final illustration.

WORDS WORTH SAVING

5 quotes

Figma is maybe ten percent of the job, and a lot of the rest of it is just thinking about the problems.

— Joel Unger

With AI, you can get right into the gnarly parts of the problems right away.

— Joel Unger

I knew that they couldn't actually use this code... [but] it got the conversation started.

— Joel Unger

All I had to do was describe it, say, 'Dance the little animation up and down.'

— Joel Unger

It’s more like a mood board... take it the next step, actually get out your tablet pen and draw it for real.

— Joel Unger

Read the available transcript
Trello pivot: inbox + planner + boards surfacesLimits of Figma for complex interactionsCursor workflow: image-to-prototype codingResponsive edge cases and breakpointsPrototype-to-engineering handoff via Loom/spec behaviorsAnimated SVG logo recreation from GIFMidjourney for style exploration/mood boards

High quality AI-generated summary created from speaker-labeled transcript.

Get more out of YouTube videos.

Read along on your phone, search it beside the video, or ask your favorite AI app what was said.