Visual Designer,  Educator & AI expert

Maxime Rabot

Visual Designer, Design System Expert, Educator & AI passionate

How to build consistent and scalable designs

Independant visual designer & founder of House of Maestro

Manage your typography, colors, spacing and avoid any guesswork when building your design templates.

Learn best Figma features and design system best practices

Understand the logic of design systems and use atomic design methodology to build digital products.

Design and build with design system thinking in mind

Prepare your work for development handoff and learn how to set a common language.

Prepare for development

The technical vocabulary and depth designers need to build functional prototypes with agentic coding tools. No coding experience required.

Product design leader turned AI educator

Payoneer

Anna Arteeva

Anna Arteeva is a product design leader and a product builder

Principal Product Designer at Github

GitHub

Jan Six

Principle Designer at Github, co-founder of Tokens Studio

Principal Interaction Designer at frog

frog

Briana (Mazzio) May

Principal Interaction Designer and Discipline Lead at frog

Design at Qonto  • Founder

Qonto

Stan Reimgen

Design @Qonto • Founder • Hands-on Product Design Leader

Cohort April

June

Coding Designers used to be called Design Unicorns. Now it's a baseline expectation — and AI is what makes it accessible.Coding isn't just a way into frontend territory. It's how you get sharper insights from usability tests and stakeholder reviews, and how you push design beyond static visuals into interactive, data-driven experiences. Working code lets you prototype with real APIs, voice, vision, and user context — dimensions unavailble in Figma. This intensive course is built for product designers. You'll learn technical concepts through designer use cases, with hands-on exercises and personal feedback on every project. Topics covered:<ul><li>AI coding tools: when to use what</li><li>Frontend foundations</li><li>Design systems and prototyping environments </li><li>Interaction and motion </li><li>Figma ↔ code workflows </li><li>Building with databases and APIs </li><li>AI-powered features </li></ul>Tool-agnostic by design: we use Claude Code throughout, but the workflows transfer to Codex, Cursor, Antigravity, and Copilot. Tools like Lovable, v0, Figma Make are covered briefly, but not the focus of the course. <pre><code class="language-markdown"></code></pre>

From designer to AI-powered prototype builder.

The mindset and the tools

Visual exploration before code

Frontend foundations for designers

Prototype with your brand and design system

App architecture and real data

Beyond the prototype

User flows, design systems, variables and design tokens

Understanding of product design fundamentals

No previous coding experience required

Clear problem, user, and outcome definitions

Basic product thinking

Senior and lead Product, UX, and Interaction Designers, looking to future-proof their workflow and increase scope, deliverables, and impact

Design leaders, looking to make their teams more effective and impactful

Product managers, who want to become product builders, ideate, validate, and ship faster

Master Figma, learn app design from zero to 100. Deliver designs faster & with more confidence.

Design products you're proud to share

Apple

Amazon

LinkedIn

Microsoft

Nima Tahami

Product Designer (15 years), Instructor (18K+ students), Founder @CueClip.app

Cohort 10

Cohort 11

As a product designer, your process and skills define the speed &amp; quality of designs you deliver. Designing the "easy" way in Figma takes away precious time. This course helps you gain all the necessary skills and tools it offers to build an efficient design process and deliver high-quality designs that "Wow" your product team and end users while leveraging AI.Here's what you'll walk away with by the end of this course:💎 Putting together a design system from scratch💎 Turning concepts into wireframes💎 Structuring your designs using Components, Auto-layout, and Variables💎 Creating responsive designs for web &amp; mobile💎 Leveraging AI (both inside Figma and out) to get more done faster💎 Creating an advanced prototype using Animations and Variables💎 A complete mobile &amp; web app design that you can add to your portfolio What our cohorts look like:✅ A community of like-minded designers✅ Up to 6 months of Figma Professional Features Included ($90 value)✅ Lifetime access to 160+ lectures that you can watch at your own pace✅ 6 Live Zoom sessions for group learning and Q&amp;A as we design together✅ Direct feedback from me in your Figma file

Learn how to craft beautiful product designs faster

Learning how to design apps from scratch

A stunning project for the portfolio

Putting together a design system

You're a designer looking to improve your process!Level up and get quick in using components, auto-layout, variables, and more.

You're looking to switch into product design.You've done some design work or dabbled with UI/UX and now looking to get serious with it.

You're an entrepreneur looking to make a killer app!You have an idea on paper and want to turn it into prototypes to "Wow" investors.

Working with code as the raw material of software will change how you see design and what you can do with it.

Design Teacher

General Assembly

Ironhack

Edenspiekermann

BuzzFeed

Cantilever Web Design & Development

Nevan Scott

Designer/developer since before it was uncool

Cohort 2

Cohort 3

Making software is supposed to be fun! And this six weeks is packed with the most fun I’ve had in my 15-year teaching career.LLM-assisted coding tools can put you in the driver’s seat, working with the real materials of your craft. I’m seeing designers do things I didn’t think I’d ever get to see designers do.For as long as I can remember, product designers have been pushed away from code. Most designers settled this question for themselves long ago—code is not for me. Now is a great time to reconsider that decision. You can have a relationship with what feels like real work without spending years mastering syntactical minutiae.Working on a design with code is an act of shaping: you’re shaping something out of the raw materials yourself. And as you shape it, you can actually interact with it, get the feel of it. This means you can work on a user interface the way it really works.As designers, we enjoy making things. Working with code is a fantastic opportunity to feel connected to the thing you’re making.Read on to find out more about the course, but keep in mind that the most important things that happen in my classroom <a target="_blank" rel="noopener noreferrer nofollow" href="https://buttonschool.com/classroom/">have nothing to do with the syllabus</a>.

Learn how to use AI coding tools to build your own designs

Take the driver’s seat when working with LLM coding tools

Read code to understand the shape of what you’re making

Form a strong mental model of the architecture of what you’re building

Any amount of knowledge will work in your favor, but the course is made for designers with little-to-no coding skills.

No previous coding experience is required

The course leans into understanding—not just generating—so a desire to go beyond surface-level outputs will help you get the most out of it.

Curiosity about how things work under the hood

You should be comfortable making product decisions and thinking beyond individual screens.

Experience designing real-world products

Product designers with solid design experience but little (or zero) coding knowledge who want to build working apps of their own creation.

Product designers comfortable in tools like Figma who want to understand how web apps work and are ready to learn new tools and thinking.

Product designers who want to cut through the noise by learning how to use AI coding tools with structure, intention and control.

Turn Your UI Into a Working App in One Day Using AI

Build products you're proud to share

Cohort 4

Most designers can create great UI, but struggle to turn it into a real, working app.At the same time, AI tools promise speed, yet often produce messy results without the right approach.This workshop bridges that gap.You’ll learn how to go from a clean UI to a functional app in a single day, by using AI the right way:<ul><li>Structuring your Figma designs for build (using Auto-layout, setting up MCP, etc)</li><li>Getting started with a Cursor app</li><li>Making a real working app from designs</li><li>Launching it on the web for others to use</li></ul>By the end, you’ll have a working app and a repeatable system to bring future ideas to life, without relying on developers.

<h3>Designers Who Want to Build</h3>You design in Figma but can’t turn ideas into real apps. Learn to build and ship without relying on developers.

Indie Builders &amp; Early FoundersYou have ideas but move slow or lack polish. Learn to design, build, and ship faster using AI.

Product Managers &amp; CreatorsYou think in flows but can’t prototype real apps. Learn to quickly build and share functional products.

Agentic AI

Coding with AI

AI Workflows

Claude Code

OpenClaw

Vibe Coding

AI Evals

AI Transformation

RAG & Search

AI for PMs

AI for Engineers

AI for Designers

AI for Marketers

AI for Founders

Product Sense

Product Discovery

User Research

Prototyping

Growth

Analytics

Tech Foundations

Strategy

Influence

Leadership

Career Growth

Machine Learning

LLM Ops

Context Eng

Security

System Design

Figma

Design Systems

Visual Design

Design Strategy

Automation

Content Marketing

Demand Gen

Go-to-Market

Product Marketing

Positioning

Social Media

Brand

B2B Marketing

SEO & AEO

AI for Leaders

AI Governance

Communication

Management

People Operations

Exec Presence

Storytelling

Goal-setting

Personal Brand

Fundraising

Everyone

Operators

Data Scientists

Business Analysts

User Researchers

Customer Success

Project Managers

HR Professionals

Sales People

Lawyers

Finance

Investors

Real Estate

Educators

Creators

Introduction and Agenda

Speaker's Background and Experience

The Core Principles of Design System Thinking

Understanding Atomic Design Methodology

Introduction to the Figma Workflow

Sharing the Figma Playground File

Defining Foundations with Variables and Text Styles

Building Components, Sections, and Templates

Documenting Your Design System in Figma

Preparing for Development Handoff

Q&A and Closing Remarks

Designers who craft user experiences, interfaces, and visual design.

User researchers conducting interviews, usability studies, and customer research to inform product decisions.

Building and maintaining scalable design systems — tokens, components, patterns, and documentation.

Mastering Figma for design workflows — components, auto-layout, prototyping, and collaboration features.

How to build consistent and scalable designs

What you'll learn

Why this topic matters

You'll learn from

Maxime Rabot