Build UX YouTube Channel

Videos on expert HTML, CSS, accessibility, and designer-developer collaboration

Visit the Website →

Mockup of Build UX homepage
Build UX homepage design (upcoming)

Skills Used

  • Design Systems
  • UX Development
  • Accessibility
  • Figma

Overview

Build UX is a YouTube channel that features video series on HTML, CSS, accessibility, and designer-developer collaboration. Each video series covers a robust product design and UX development process, from static mockups to polished user experiences.

Problem

As a self-taught designer and developer, I relied on online learning resources as the foundation of my early career. Coding courses, YouTube videos, and podcasts provided immense value in forming my product design and development knowledge.

As my career progressed, and my level of expertise grew, I began seeing a huge void in free educational resources that covered realistic projects with in-depth best practices. Particularly, I struggled to find material that properly covered workflows related to design systems, accessibility, pixel-perfect development, or performance. However, I kept seeing designers and developers asking for this level of learning, and I also saw teams and products from the majority of companies with shortcomings in these same areas.

Solution

Build UX is my answer to this need. As an ad-free YouTube channel, I want to provide complete access to professional knowledge and best practices. My hope is to achieve a wide reach with infomation that will improve the process and quality of work within product teams, thereby making websites and web applications more performant, delightful, and accessible for all users.

UI Video Series

Each Build UX video series covers the full process of refining UI designs with a design system and accessibility focus. Then, these designs are prepared for effective designer-developer collaboration with detailed, holistic documentation. Next, development begins with clean, semantic markup, followed by scalable and pixel-perfect styling. Lastly, each video series ends with code review improvements and testing for performance and accessibility.

A series of mockups showing various UI states of a nutrition-focused article page
Refined design mockups in Figma for the Nutrition UI video series
UI components and design system documentation for a light and dark theme web application
Work-in-progress design system files in Figma for the CRM Inbox UI video series

In-Depth How-Tos

In addition to the UI video series, Build UX also offers how-to videos that dive deep into specific techniques and approaches for both product design and UX development. Examples of how-to video topics include advanced component structure in Figma, optimizing and implementing SVGs, and using CSS Grid and Custom Properties at the component level.

Build UX How To video feature on Figma resource community website
Multiple Build UX How To videos have been featured on Figma's Resource website

What's Next

I'm continuing to grow Build UX with frequent new video series and how-tos. My vision for Build UX is to always keep the core content both purchase-free and ad-free to reduce any barriers to access. There is no shortage of HTML, CSS, accessibility, design system, and product design topics to cover, so I'm looking forward to many, many video to come!

← Back to all work