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. Web Design for Kids: Welcome to Tuts+ Town!

      Web Design for Kids: Welcome to Tuts+ Town!

      Tutorial Beginner

      Welcome to Tuts+ Town, where everybody loves web design! In this series we will learn all about designing and building a website. To help us, we’ll make a...

    2. WeChat Does Your Laundry: Designing for China’s Biggest Social Platform

      WeChat Does Your Laundry: Designing for China’s Biggest Social Platform

      Tutorial Beginner

      I have a hard time getting western designers to understand why I keep talking about WeChat (Chinese: Weixin 微信) in the context of web design. In the west,...

    3. CodePen Challenge #3: Results!

      CodePen Challenge #3: Results!

      Tutorial Beginner

      Last week we asked you to take part in our third CodePen Challenge: to select your favorite Google font pairs and apply them to some sample content. Over 50...

    4. Design an App Landing Page in Photoshop

      Design an App Landing Page in Photoshop

      Tutorial Beginner

      In this tutorial I will walk you through the design process of a simple and conversion-oriented app landing page. We’ll use the Tuts+ Android app for the...

    5. CodePen Challenge #3: Favorite Google Font Pairs

      CodePen Challenge #3: Favorite Google Font Pairs

      Tutorial Beginner

      Another month, another CodePen Challenge! Last time we asked you to style a signup form and a whopping 68 of you took part. This time we want to see which...

    6. A Designer’s Introduction to “Agile” Methodology

      A Designer’s Introduction to “Agile” Methodology

      Tutorial Beginner

      “Agile” is a peculiar industry term for designers who have never worked in the software space. It’s a phrase which gets used a lot by employers and...

    7. Designing for the WATCH

      Designing for the WATCH

      Tutorial Beginner

      With the upcoming launch of Apple’s newest and shiniest product, the Apple Watch (err, WATCH) there are many designers out there itching to get a feel for...

    8. A Tale of Two Platforms: Designing for Both Android and iOS

      A Tale of Two Platforms: Designing for Both Android and iOS

      Tutorial Beginner

      Android and iOS apps aren't always designed in isolation. Sometimes you need a quick way to design an app for both platforms. If you're new to designing...

    9. Designing an iOS Fitness Application with Apple Watch Compatibility

      Designing an iOS Fitness Application with Apple Watch Compatibility

      Tutorial Beginner

      In this tutorial, I’ll teach you how to design a simple and easy-to-use iOS fitness application for tracking outdoor running and cycling. Besides the iOS...

    10. Creating Color Schemes with LESS Color Functions

      Creating Color Schemes with LESS Color Functions

      Tutorial Intermediate

      LESS provides a handful of functions which make defining and manipulating colors super easy. In this tutorial we are going to walk through a number of them,...

    11. CodePen Challenge #2: Results!

      CodePen Challenge #2: Results!

      Tutorial Beginner

      Last week we asked you to take part in our second CodePen Challenge: styling a mailing list sign up form. More than 60 of you took part, offering some really...

    12. Localizing Your Website or App for the Chinese Market

      Localizing Your Website or App for the Chinese Market

      Tutorial Beginner

      Localization, the process of optimizing a site or app across differing languages and cultures, goes far beyond basic translation. Actually, translation’s...