Claude Design = Premium Portfolio Websites In Minutes
38.1K views · 2026-05-21
UI DesignProduct Design
▎LINKS & RESOURCES
Using some of the links below, I may receive a small commission at no extra cost to you. This is the easiest way to support me and helps me continue making content like this for you. Appreciate you!
Launch your portfolio in days, not months:
Explore my Framer template Lofi: https://temploton.com/
Get started with Framer: https://framer.link/devantaebison
My go-to site for design inspiration: https://mobbin.com/?via=taeonlinehd
Prompt used in the video:
"Generate a high-fidelity design portfolio website for Tae, a Senior Product Designer. Use the attached moodboard as the primary visual direction — pay attention to the yellow sticky-note annotations.
Dark overall aesthetic with modern, editorial layout and strong typographic treatments.
Peak work above the fold. Include a work section featuring 2-3 projects and an about section covering years of experience, design philosophy, and reviews from previous teammates
Ask clarifying questions before starting. Don't make assumptions."
▎VIDEO OVERVIEW
Claude Design can build a portfolio in minutes, but you can tell it's AI and they all look the same. I'm a senior product designer, and I'll show you how to build a portfolio website with Claude Design that actually looks human, then take it live.
We'll cover the reference workflow that nails the look on the first pass, the prompt line that gets Claude to interview you, Draw/Edit/Comment modes, motion that makes it feel alive, and going live with Claude Code, GitHub and Vercel.
▎CHAPTERS
0:00: Intro
0:20: Why every portfolio looks the same
1:29: Getting started with Claude Design
3:40: Claude Design tools
3:54: Refining the first version
13:21: Why it's still not there
13:49: Adding animations
15:31: Getting it live
19:15 Outro
Using some of the links below, I may receive a small commission at no extra cost to you. This is the easiest way to support me and helps me continue making content like this for you. Appreciate you!
Launch your portfolio in days, not months:
Explore my Framer template Lofi: https://temploton.com/
Get started with Framer: https://framer.link/devantaebison
My go-to site for design inspiration: https://mobbin.com/?via=taeonlinehd
Prompt used in the video:
"Generate a high-fidelity design portfolio website for Tae, a Senior Product Designer. Use the attached moodboard as the primary visual direction — pay attention to the yellow sticky-note annotations.
Dark overall aesthetic with modern, editorial layout and strong typographic treatments.
Peak work above the fold. Include a work section featuring 2-3 projects and an about section covering years of experience, design philosophy, and reviews from previous teammates
Ask clarifying questions before starting. Don't make assumptions."
▎VIDEO OVERVIEW
Claude Design can build a portfolio in minutes, but you can tell it's AI and they all look the same. I'm a senior product designer, and I'll show you how to build a portfolio website with Claude Design that actually looks human, then take it live.
We'll cover the reference workflow that nails the look on the first pass, the prompt line that gets Claude to interview you, Draw/Edit/Comment modes, motion that makes it feel alive, and going live with Claude Code, GitHub and Vercel.
▎CHAPTERS
0:00: Intro
0:20: Why every portfolio looks the same
1:29: Getting started with Claude Design
3:40: Claude Design tools
3:54: Refining the first version
13:21: Why it's still not there
13:49: Adding animations
15:31: Getting it live
19:15 Outro