Skip to enroll

Mastering UI/UX Design with Figma

1 Learner
10 Lessons
0.0 (0)
5 hours
Intermediate
Course

Design a small interface in Figma from the first frame to a clickable prototype, a usability pass, and a handoff a developer can follow.

Overview

UI is what a person sees and touches: type, color, spacing, and controls. UX is whether they can finish a job without guessing. Figma is the file where those two jobs meet, as frames, components, and a prototype.

This course assumes you can open Figma and draw a rectangle. You will tidy a file, set type and spacing, build components, use auto layout, connect a flow, and hand the work off without writing a novel.

You will design one small flow, such as signing up, booking, or saving an item. Each lesson adds one layer to that file. Two quizzes check the ideas before you polish pixels.

Features
  • A clear split between the UI on the screen and the UX of the task
  • A tidy file of frames with constraints you can explain
  • Type, color, and spacing choices you can reuse
  • Components and auto layout for screens that survive real text
  • A clickable prototype and a short usability pass
  • Handoff notes and a small system another person can extend

Target audiences
  • Designers who know the Figma basics and want a working method
  • Developers who design the first version of a screen themselves
  • Product people who review Figma files and need better feedback
  • Students building a portfolio piece with a real flow, not a single poster

Requirements
  • A free Figma account and a desktop browser
  • You can create a frame, a text layer, and a rectangle
  • One small product flow you are allowed to redesign
  • No paid Figma plan is required for these lessons

Curriculum

4 sections 12 lectures 5 hours

Seeing the work 2 lectures 36 mins
Build the interface 4 lectures 1h 14m
  • Type, color, and spacing that hold together
    Locked 22 min
  • Components you can reuse
    Locked 20 min
  • Auto layout for real screens
    Locked 22 min
  • Quiz: Figma foundations
    Locked 10 min
Design the experience 3 lectures 54 mins
  • Flows, not isolated screens
    Locked 18 min
  • Prototypes people can click
    Locked 18 min
  • A usability pass before you polish
    Locked 18 min
Share the work 3 lectures 50 mins
  • Handoff notes a developer can use
    Locked 18 min
  • A small design system you can reuse
    Locked 20 min
  • Quiz: UI and UX review
    Locked 12 min

Frequently Asked Questions

01. Do I need to draw illustrations?

No. The course is about interface structure, components, prototype links, and handoff.

02. Is this a full visual-design degree?

No. You will make type, color, and spacing decisions that hold a small product together.

03. Which Figma features are covered?

Frames, constraints, styles, components, auto layout, prototyping, and handoff notes.

04. Can I follow along without a developer?

Yes. The handoff lesson shows what to name and what to write so a future teammate is not guessing.

05. How long is the course?

About 5 hours, including 10 lessons and 2 quizzes.

Instructors

Mason Reed

Frontend Engineering

  • 0.0 Instructor Rating
  • 1 Learner
  • 1 Course

I’m Mason Reed, a frontend engineer who enjoys bringing ideas to life through clean, responsive, and accessible web interfaces. I work with modern web technologies to build experiences that look great and perform well across devices. Through my lessons, I break down complex concepts into practical steps, helping you understand how to write better code, solve common development challenges, and build projects you can proudly add to your portfolio.

Reviews

0.0

No ratings yet

5 0
4 0
3 0
2 0
1 0