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 tutorials:

    1. 18 Top Bootstrap UI Kits for 2025

      18 Top Bootstrap UI Kits for 2025

      Tutorial Beginner

      Are you in the process of designing a website or an app? Save yourself some time and effort with a Bootstrap UI kit from Envato Elements.

    2. 8 Usability Heuristics (Explained With Toasters)

      8 Usability Heuristics (Explained With Toasters)

      Tutorial Beginner

      Today we’re going to use the toaster in my kitchen to demonstrate 8 usability heuristics (in other words principles or rules) that are at the centre of good...

    3. 10 Best Mega Menu Examples in WordPress Themes

      10 Best Mega Menu Examples in WordPress Themes

      Tutorial Beginner

      Mega menus can add an extended level of navigation to your WordPress site. Here, we've put together 10 different examples of mega menus in action from...

    4. How to Create a Sticky Toolbar With CSS and a Bit of JavaScript

      How to Create a Sticky Toolbar With CSS and a Bit of JavaScript

      Tutorial Beginner

      In this new tutorial we’ll learn how to create a sticky (or fixed) toolbar, using CSS and a bit of JavaScript, with animated tooltips, that you can use on...

    5. How to Customize Contact Form 7 for WordPress: Enhanced Email Template

      How to Customize Contact Form 7 for WordPress: Enhanced Email Template

      Tutorial Beginner

      In this short tutorial, I’ll show you a straightforward approach for customizing the email template sent from WordPress Contact Form 7 (CF7) plugin, making...

    6. 3 Ways to Enhance UX With Motion Design

      3 Ways to Enhance UX With Motion Design

      Tutorial Beginner

      Communication, feedback, and wayfinding are just a few impactful ways motion design can be used to improve UX. Let’s look at some examples!

    7. What is Information Architecture? (UX Tips and Examples)

      What is Information Architecture? (UX Tips and Examples)

      Tutorial Beginner

      Information Architecture (or “IA”) is an important part of UX. Let me explain what Information Architecture is, how it’s like the organisation of your house,...

    8. 9 Top Email Wireframe UI Kits (for Email and Newsletter Prototypes)

      9 Top Email Wireframe UI Kits (for Email and Newsletter Prototypes)

      Tutorial Beginner

      There’s no need to conjure an email or newsletter design from scratch when we have some of the best email wireframe UI kits around collected here for you to...

    9. 15+ UI Kit Examples to Speed Up Your App Design Workflow

      15+ UI Kit Examples to Speed Up Your App Design Workflow

      Tutorial Beginner

      Did you know 21% of millennials open an app 50+ times a day and 70% of all US digital media time comes from mobile apps? Read on for our pick of 15+ UI kits...

    10. How to Create Fluid Typographic Scales for Your Responsive Website

      How to Create Fluid Typographic Scales for Your Responsive Website

      Tutorial Beginner

      In this video you’ll learn how to define the typography sizing for your responsive website using fluid typographic scales.

    11. How to Customize Contact Form 7 for WordPress: Checkboxes and Radio Buttons

      How to Customize Contact Form 7 for WordPress: Checkboxes and Radio Buttons

      Tutorial Beginner

      Learn how to build custom checkboxes and radio buttons with the WordPress Contact Form 7 (CF7) plugin.

    12. How to Create Responsive Mega Menus With UIkit

      How to Create Responsive Mega Menus With UIkit

      Tutorial Intermediate

      Learn how to build responsive mega menus with the UIkit framework, by taking advantage of its Dropdown, Nav, Navbar, and Off-canvas components.