Name: AI Coding for Product and UX (Self-Paced)
Price: 2999.0 USD
Availability: InStock

This course includes

60 hours of project-based training from experts
Answers from real instructors
Retake for free within 1 year
Access to class recordings (30 days)
Verified digital certificate of completion

This is the self-paced course. For live instruction, enroll in AI Coding for Product and UX.

Work at your own pace through the design skills that decide whether an AI-built site actually works. This course covers visual hierarchy, typography, color, spacing, layout, and consistency, then shows you how to use them to direct Claude Design toward a specific result instead of a generic one.

You build one project from start to finish. Choose a fictional business, plan its pages and user flows, explore three separate design directions before settling on one, and capture that direction in a design system of reusable components. An AI coding tool turns the design into a working site, and you take it the rest of the way: the phone version, forms, interface states, a DevTools QA pass, accessibility checks by keyboard, contrast, zoom, and screen reader, and a usability test with a real person.

Course Reviews

From our hands-on training style to world-class instructors and custom-crafted curriculum, we deliver results our alumni are proud of.

Tuition

Full Tuition

$2,999
Due before the class starts

This course includes

60 hours of project-based training from experts
Answers from real instructors
Retake for free within 1 year
Access to class recordings (30 days)
Verified digital certificate of completion

Learn the Skills Guarantee™

Learn the concepts and skills covered in this course or your tuition is on us. See details and terms & conditions.

Hands-on training in small groups

Work on projects proven to boost retention

Time-tested curriculum and supporting materials

Refined over many cohorts for an optimal learning experience

Excellent classes and excellent venue! It has just the right level of personal attention and class participation. I would highly recommend NYIM and look forward to taking future classes there. – Hazel S.

Learn from industry experts with teaching experience

Experienced educators who are driven to help you succeed

Retake the course for free within one year

Refresh the materials and gain additional practice

100% Online. Start Anytime

24/7 access to our premium course videos and projects.
Industry experts are assigned as your course instructor. Message your instructor with any questions.
Participate in NYIM online discussion forums — share ideas and receive additional support.
Hands-on quizzes and mini projects to test and reinforce concepts.

Earn a Certificate of Completion

Upon completion of this course, you’ll receive an official certificate testifying to your mastery of the curriculum. We’ll send you a link where you can download your certificate, share it online with your friends, post it to your professional network on LinkedIn, and view all your earned certificates. Congratulations on your achievement!

Shareable on

Sample credential for completion of AI Coding for Product and UX (Self-Paced)

AI Coding for Product and UX (Self-Paced) Curriculum

What You'll Learn at a Glance

Brief AI with specific references so it stops defaulting to generic layouts
Judge a design using visual hierarchy, typography, color, spacing, and layout
Map a site with a sitemap, user flows, and a heading outline before prompting
Hold a design together across pages with a reusable design system
Get the phone layout, forms, interface states, interface copy, and motion right
Verify your build with DevTools, accessibility checks, and a usability test

Course Syllabus

Download Syllabus PDF

First Design Project

Ways to start a design: a text prompt, screenshots, rough sketches, your own designs, or an existing design system
Creating a first design and judging what AI produced
Asking for distinctly different directions rather than slight variations

Designing with AI

Visual hierarchy: what leads the eye, and primary versus secondary calls to action
Typography: serif, sans-serif, and display typefaces, pairing fonts, and building a type scale
Color: harmonies, building from one base color, giving every color a job, and keeping text legible
Why AI output can look generic, and how to show it references instead of describing in words
Sourcing images that do not look generic, including edited stock and AI-generated images
Getting useful feedback on a design from other people
Planning before you prompt: sitemaps, main navigation, and user flows
Heading outlines, and writing headings that match what people search for
Exploring three distinct directions for your project, then committing to one

Layout & Images

How pages are built from sections, and hero sections with one clear action
Common page layouts, and describing a layout section by section
The 12-column grid, when to break it, and the spacing scales that create rhythm
Wireframing structure before style, and why low fidelity comes first
How photos set the mood, cropping for the layout, and keeping text on photos readable
Where images come from, icon families, labeling icons, and respecting a client's logo

Design Consistency

Spotting where AI has drifted between pages
Keeping design decisions in one place, named by role rather than by value
What belongs in a design system, including shape and corner radius
Components and patterns, and starting from a component library
Navigation on phones, cards, lists, tabs, accordions, and see-more controls

Critique & Build

Getting a fresh-eyes critique before you build
Handing a design to an AI coding tool, with shared tokens and reusable components
Writing an instructions file so every later page reuses the same system
Making one change at a time without losing work that already works

Responsive Design

Breakpoints, reflow, and mobile-first design
Fluid, adaptive, and combination layouts, and type that scales
Mobile navigation, tap target size and spacing, and designing without hover

Forms & Interface States

Visible labels, asking only what you need, and a logical one-column order
Choosing the right control for each kind of choice
Empty, loading, error, success, hover, focus, and disabled states
Keeping states in shared components rather than fixing one page at a time

Words in the Interface

Buttons that say what will happen
Headings and links that make sense on their own
Error messages without blame, empty states that invite action, and confirmations that reassure
Picking one word for a thing and keeping it everywhere

Motion

Giving every animation a job to do
Micro-interactions, and keeping motion short and subtle
Respecting reduced-motion preferences

Test Your Site

Inspecting a problem in browser developer tools before re-prompting
Checking built values against your design system
Comparing the finished build against your design
Stress-testing a layout with real content

Accessibility & Usability Testing

What accessibility means in practice, and what WCAG asks for
Keyboard navigation and visible focus
Contrast ratios, and not relying on color alone to carry meaning
Zoom and text size, and the fixed heights that usually break them
Screen readers, and confirming AI's findings with real tools
Running a usability test: writing tasks rather than instructions, and thinking aloud
Watching without helping, grouping what you saw into themes, and ranking issues by severity

Frequently Asked Questions

Is this course open to beginners?

Yes, this course is open to beginners. Students must be comfortable using a computer. No other prior knowledge is required.

Do you offer payment plans or student financing for this course?

This course does not qualify for payment plans or student financing. See our Payment Plan FAQ to find related programs that qualify.

What is the cancellation and refund policy for this single course?

For this course, you are entitled to a 90% refund (your payment less the nonrefundable 10% registration fee) within 30 days of purchase if you have not accessed the course materials.

What’s included with my tuition?

A hands-on learning experience working on projects and exercises, which is proven to boost comprehension, retention, and engagement
Expert instructors who are industry professionals and experienced educators that are driven to help you succeed
Expert support with answers to your questions from real instructors throughout your learning journey
Top-notch curricula that have been tried and tested over many years and are consistently improved for an optimal learning experience
30-day access to class recordings to review material at your own pace
A certificate of completion to verify your accomplishment

Are there any additional fees or expenses?

There are no extra fees or taxes for our courses. The price you see on this page is the maximum you’ll pay us.

However, you may need to obtain required software. We’ll help you get set up with a free trial of paid software prior to the class. Most of our coding classes utilize freely-available open-source software. For most of our design and motion graphics courses, we will help you get set up with a free trial of Adobe Creative Cloud. If you attend the course in-person, we will have a computer already set up for you with all of the required software for no additional cost.

Do you offer any discounts for this course?

We don’t currently offer discounts as we do our best to affordably price our courses.

Corporate & Onsite AI Training

Purchase group class vouchers at a discount for our regularly-scheduled group classes, or create a custom training program at your offices.

Private Training

Available onsite at your location
Modern computer labs available at our offices
Customize or choose from our existing courses
Free instructor consultations to finalize content

Group Class Vouchers

Send employees to our group classes
Extensive offerings and flexible scheduling
Simple billing and logistics
Computers and training resources provided

This course includes

Course Reviews

Tuition

Full Tuition

This course includes

Learn the Skills Guarantee™

Hands-on training in small groups

Time-tested curriculum and supporting materials

Learn from industry experts with teaching experience

Retake the course for free within one year

100% Online. Start Anytime

Earn a Certificate of Completion

AI Coding for Product and UX (Self-Paced) Curriculum

What You'll Learn at a Glance

Course Syllabus

First Design Project

Designing with AI

Layout & Images

Design Consistency

Critique & Build

Responsive Design

Forms & Interface States

Words in the Interface

Motion

Test Your Site

Accessibility & Usability Testing

Frequently Asked Questions

Is this course open to beginners?

Do you offer payment plans or student financing for this course?

What is the cancellation and refund policy for this single course?

What’s included with my tuition?

Are there any additional fees or expenses?

Do you offer any discounts for this course?

Related Courses: Compare to AI Coding for Product and UX (Self-Paced)

AI Coding for Systems and Architecture (Self-Paced)

How does it compare?

AI Coding for Security (Self-Paced)

How does it compare?

Corporate & Onsite AI Training

Private Training

Group Class Vouchers