Courses / AI & tools

Figma basics for UX and product roles

A hands-on course for people switching into UX or product. Learn the Figma tool on the free Starter plan: files and frames, shapes and text, auto layout, a component with variants, a clickable prototype, FigJam, comments, handing designs to a developer without Dev Mode, and the AI features with their credits and data settings. You end with a portfolio project for your CV.

25 min · 10 pages · practice task · quiz · part of Product manager

Sponsor this course

What you will be able to do

Skills you add to your Herizon profile when you finish: Figma, Prototyping in Figma, UI Design.

  • A clickable 3-screen prototype in Figma, shared by a link
  • One component and one auto layout container you built yourself
  • A FigJam map of the old flow you redesigned
  • A handoff package for a developer, built without Dev Mode
  • A short case study you can link from your CV

Who it is for

Time per page: 15 to 25 minutes Whole course: 3 to 4 hours (10 pages, at your own speed) This is for you if you are: - Switching into UX, product or design - A jobseeker whose ads say "Figma" - A product, marketing or project person who needs to open and comment on designs You need a free Figma account and no design experience. Figma Starter is enough for everything here. The free education plan is for students at a school or approved bootcamp, and it is not for self-study. ---

The situation you work through

Amira, a made-up former teacher in Espoo switching into UX, redesigns one sign-up screen of Polkuvuoro, a made-up bike-share service in Helsinki: a FigJam map of the old flow, three connected screens with auto layout and one component, a shared link and a developer handoff.

Your practice task

Redesign one sign-up or booking screen of a Finnish service as a clickable 3-screen prototype in Figma, with real Finnish content, auto layout on at least one container and one component with a default and a disabled variant. Share it with the access your Share dialog offers, add comment access if it is available, and test the link in a private window. Submit the prototype link, a picture or link of your FigJam map of the old flow, and a short case-study note: the problem, the old flow, your three screens, one design decision with the reason, and what you would test next.

Illustration from the course Figma basics for UX and product roles

What is inside

  1. What Figma is and what the free plan gives you
  2. Files, pages and frames
  3. Shapes and text: build the Details screen
  4. Auto layout: let the screen arrange itself
  5. Components and variants: one button, two states
  6. A clickable prototype of three screens

and 4 more pages

Finish with a short quiz to earn your certificate.

More in Product manager

Figma basics for UX and product roles - Herizon