Learn UX/UI

Try these UX and UI tutorials to learn the principles of user-centered design, prototyping, and wireframing. Learn to craft beautiful and intuitive user interfaces.

Getting started with UX/UI

  • 8 Usability Heuristics (Explained With Toasters)

    8 Usability Heuristics (Explained With Toasters)

    Maddy Beard
  • What is Information Architecture? (UX Tips and Examples)

    What is Information Architecture? (UX Tips and Examples)

    Andrea Eppy
  • All UX/UI content:

    1. New Course: Using Figma for SVG Design

      New Course: Using Figma for SVG Design

      Tutorial Beginner

      In our new short course, Using Figma for SVG Design, you’ll learn how to use Figma for vector editing with SVG in mind, and how to generate SVGs that...

    2. Figma Component Tips

      Figma Component Tips

      Tutorial Beginner

      Figma allows us to design with components; repeatable objects which behave according to sets of rules which we define. Let’s run through some tips and tricks...

    3. Figma Vector Tips

      Figma Vector Tips

      Tutorial Beginner

      Vectors are an important part of any UI or prototyping design application, and Figma has its own powerful set of vector tools. Here are some quick tips and...

    4. Figma Image Tips

      Figma Image Tips

      Tutorial Beginner

      Figma offers a range of shortcuts and controls for importing images, placing them on the canvas, and modifying them once they’re in position. Let’s take a look!

    5. Figma Properties Tips

      Figma Properties Tips

      Tutorial Beginner

      Objects in Figma can have a range of properties applied to them. In this part of our Figma tips and tricks series we’ll look at ways to work with properties,...

    6. Best-Selling UX and UI Kits for Sketch, Photoshop, Illustrator, XD, and Figma

      Best-Selling UX and UI Kits for Sketch, Photoshop, Illustrator, XD, and Figma

      Tutorial Beginner

      UX and UI Kits help designers in all kinds of ways, and at different stages in the design process. In this roundup I’ll show you some of the best-selling UX...

    7. Learn CSS by Creating These 5 Image Hover Effects

      Learn CSS by Creating These 5 Image Hover Effects

      Tutorial Beginner

      Want to improve your CSS skills and create some amazing image hover effects at the same time? Try our new short course, 5 CSS Projects: Image Hover Effects.

    8. Figma Project, Page & Artboard Tips

      Figma Project, Page & Artboard Tips

      Tutorial Beginner

      Welcome to the next in our series of Figma tips and tricks! This time we’ll be improving the way you work with Figma projects, pages, and artboards.

    9. How to Create Responsive SVG Images

      How to Create Responsive SVG Images

      Tutorial Beginner

      In this tutorial I’ll explain how to create responsive SVG images; more specifically, I’ll explain how to create SVG logos, icons, and images, which change...

    10. Figma Frame Tips

      Figma Frame Tips

      Tutorial Beginner

      Frames allow you to combine layers together under a single parent. Unlike groups, frames in Figma have explicitly set dimensions (much like an HTML iframe)....

    11. Figma On Canvas Tips

      Figma On Canvas Tips

      Tutorial Beginner

      Welcome to more Figma tips and tricks! This time we’ll be looking at five things to help you when you’re working directly on Figma’s canvas.

    12. New Course: Essential JS Libraries for UI

      New Course: Essential JS Libraries for UI

      Tutorial Beginner

      Learn how to use JavaScript libraries for UI design in our new course, Essential JS Libraries for User Interfaces (UI).