How to Use ChatGPT (Codex) + Figma MCP for UX/UI & Product Design!
Learn how to use ChatGPT for product design in a real AI design workflow using ChatGPT Desktop, Codex, GitHub, and Figma MCP.
In this tutorial, I show how I transformed an old portfolio into a more creative, interactive product experience with ChatGPT.
You’ll see how to set up a local project, connect GitHub, create a safe branch, ask ChatGPT to critique your current design, generate multiple portfolio directions, refine the result, commit your progress, and bring Figma back into the workflow when you need precise visual control.
This is a practical workflow for product designers, UX designers, design leaders, and creative technologists who want to use AI for real design work, not just generic prompts or quick mockups.
You’ll learn:
- How to use ChatGPT Desktop for product design work
- How ChatGPT Work, Codex, plugins, and skills fit together
- How to connect ChatGPT with GitHub
- How to use branches and commits safely as a designer
- How to use ChatGPT to critique and redesign a portfolio
- How to explore multiple AI-generated design directions
- How to refine a product design with prompts and annotations
- How to use Figma MCP when you need more design control
- How ChatGPT and Figma can work together in an AI product design workflow
This video is especially useful if you’re exploring ChatGPT for designers, AI product design, Figma MCP, GitHub portfolio workflows, or how AI can support the product design process from concept to refinement.
⏱️Chapters:
00:00 How ChatGPT changes product design
00:42 Set up ChatGPT Desktop for design work
04:52 Create a local portfolio project
06:14 Connect GitHub and clone your portfolio
10:10 Generate three design directions with Figma context
13:10 Refine the strongest direction
13:55 Commit and push your progress to GitHub
16:43 Continue after hitting ChatGPT usage limits
17:19 Create an interactive portfolio experience
20:18 Bring the design back into Figma
20:50 Apply Figma changes through ChatGPT
#ChatGPT #ProductDesign #AIProductDesign
-------------------------------------------------------------------------------
🎥 Watch Next ⬇️
Build a design system with codex: https://youtu.be/gNOiMNgpAdI
‼️ MUST WATCH: https://youtu.be/GNsVHcJEf38
🌸 FREE Complete Courses 🌸
❣️ https://youtube.com/playlist?list=PLXdRMPwB8CHm6XJwPZMZwUfDTUipxGMPK&si=_i93W3tacRpPuoPc
🎨 https://www.youtube.com/playlist?list=PLXdRMPwB8CHmbSLEKimjJMuvlAQgi09I_
🤖 https://www.youtube.com/playlist?list=PLXdRMPwB8CHnCai2ohL6e9HA4mcq-ZEn0
☸️ https://www.youtube.com/playlist?list=PLXdRMPwB8CHk4F76vsOWHehnz8pcKYP6T
🌈 https://www.youtube.com/playlist?list=PLXdRMPwB8CHkdA9Sch2ArrgmViCbHyaRN
🧘🏻♀️ https://www.youtube.com/playlist?list=PLXdRMPwB8CHmky4DDULgzeU-u4XyHNU7y
-------------------------------------------------------------------------------
👩🏻💻 I'm Nehmat — Design Leader, Professor, and your guide for navigating the AI era.
I help designers master tools like Claude Design, Figma MCP, and AI design workflows with clarity and real-world application.
🎯 New videos as soon as you need to know: Figma Updates, Industry changes, AI tools & career evolution
💕 Subscribe to get the latest releases & changes in our industry
👉 Join my community to get First Access, more direct guidance & live consultation on your work
🔔 Turn on ALL notifications so you don't miss the latest releases and tutorials
🔥 Hype this video to help it reach the people searching for it
➡️ LinkedIn: https://linkedin.com/in/nehmatgereige
❎ X: https://x.com/33Nehmat
Ⓜ️ Medium: https://medium.com/@nehmat.gereige
🌈 Figma Creations: https://www.figma.com/@nehmatgereige
In this tutorial, I show how I transformed an old portfolio into a more creative, interactive product experience with ChatGPT.
You’ll see how to set up a local project, connect GitHub, create a safe branch, ask ChatGPT to critique your current design, generate multiple portfolio directions, refine the result, commit your progress, and bring Figma back into the workflow when you need precise visual control.
This is a practical workflow for product designers, UX designers, design leaders, and creative technologists who want to use AI for real design work, not just generic prompts or quick mockups.
You’ll learn:
- How to use ChatGPT Desktop for product design work
- How ChatGPT Work, Codex, plugins, and skills fit together
- How to connect ChatGPT with GitHub
- How to use branches and commits safely as a designer
- How to use ChatGPT to critique and redesign a portfolio
- How to explore multiple AI-generated design directions
- How to refine a product design with prompts and annotations
- How to use Figma MCP when you need more design control
- How ChatGPT and Figma can work together in an AI product design workflow
This video is especially useful if you’re exploring ChatGPT for designers, AI product design, Figma MCP, GitHub portfolio workflows, or how AI can support the product design process from concept to refinement.
⏱️Chapters:
00:00 How ChatGPT changes product design
00:42 Set up ChatGPT Desktop for design work
04:52 Create a local portfolio project
06:14 Connect GitHub and clone your portfolio
10:10 Generate three design directions with Figma context
13:10 Refine the strongest direction
13:55 Commit and push your progress to GitHub
16:43 Continue after hitting ChatGPT usage limits
17:19 Create an interactive portfolio experience
20:18 Bring the design back into Figma
20:50 Apply Figma changes through ChatGPT
#ChatGPT #ProductDesign #AIProductDesign
-------------------------------------------------------------------------------
🎥 Watch Next ⬇️
Build a design system with codex: https://youtu.be/gNOiMNgpAdI
‼️ MUST WATCH: https://youtu.be/GNsVHcJEf38
🌸 FREE Complete Courses 🌸
❣️ https://youtube.com/playlist?list=PLXdRMPwB8CHm6XJwPZMZwUfDTUipxGMPK&si=_i93W3tacRpPuoPc
🎨 https://www.youtube.com/playlist?list=PLXdRMPwB8CHmbSLEKimjJMuvlAQgi09I_
🤖 https://www.youtube.com/playlist?list=PLXdRMPwB8CHnCai2ohL6e9HA4mcq-ZEn0
☸️ https://www.youtube.com/playlist?list=PLXdRMPwB8CHk4F76vsOWHehnz8pcKYP6T
🌈 https://www.youtube.com/playlist?list=PLXdRMPwB8CHkdA9Sch2ArrgmViCbHyaRN
🧘🏻♀️ https://www.youtube.com/playlist?list=PLXdRMPwB8CHmky4DDULgzeU-u4XyHNU7y
-------------------------------------------------------------------------------
👩🏻💻 I'm Nehmat — Design Leader, Professor, and your guide for navigating the AI era.
I help designers master tools like Claude Design, Figma MCP, and AI design workflows with clarity and real-world application.
🎯 New videos as soon as you need to know: Figma Updates, Industry changes, AI tools & career evolution
💕 Subscribe to get the latest releases & changes in our industry
👉 Join my community to get First Access, more direct guidance & live consultation on your work
🔔 Turn on ALL notifications so you don't miss the latest releases and tutorials
🔥 Hype this video to help it reach the people searching for it
➡️ LinkedIn: https://linkedin.com/in/nehmatgereige
❎ X: https://x.com/33Nehmat
Ⓜ️ Medium: https://medium.com/@nehmat.gereige
🌈 Figma Creations: https://www.figma.com/@nehmatgereige