Learn Prototyping

Bring your designs to life with interactive prototypes that allow you to test and refine your design ideas. These tutorials teach you everything you need to know.
  1. Learn to Prototype With Framer X in Our New Course

    Learn to Prototype With Framer X in Our New Course

    Tutorial Beginner

    In our new short course, Learn to Prototype With Framer X, you’ll learn how to work with Framer, a popular new design tool that focuses heavily on prototyping.

  2. A Guide to Prototyping in Figma

    A Guide to Prototyping in Figma

    Course Beginner

    Figma is a great tool for UI design, and among its greatest strengths are its prototyping features. In this short course, you’ll learn how to prototype with...

  3. Go Beyond the Basics of UI Design in Our New Figma Course

    Go Beyond the Basics of UI Design in Our New Figma Course

    Tutorial Beginner

    Figma is quickly becoming a favorite tool for UI and UX designers. Learn some advanced tricks and techniques in our new short course, Beyond the Basics: Figma.

  4. Beyond the Basics: Figma

    Beyond the Basics: Figma

    Course Intermediate

    Figma is quickly becoming a favorite tool for UI and UX designers worldwide, many of them coming over from Sketch and Adobe XD. Figma is a super powerful and...

  5. Prototyping in Design Thinking: Fail Fast, Fail Often

    Prototyping in Design Thinking: Fail Fast, Fail Often

    Tutorial Beginner

    In this article we’ll take a look at the prototyping stage of design thinking. Failing is mandatory.

  6. Your First eCommerce Website Prototype With Adobe XD

    Your First eCommerce Website Prototype With Adobe XD

    Tutorial Beginner

    A step-by-step tutorial for designing and prototyping an online store using Adobe Experience Design’s new features like overlay and repeat grid.

  7. A Walkthrough of the Prototyping Tools in Sketch

    A Walkthrough of the Prototyping Tools in Sketch

    Tutorial Beginner

    In this walkthrough, I will go over everything you need to know about prototyping in Sketch, from must-know shortcuts, all the way through to getting...

  8. How to Quickly Add Microinteractions to Your Website

    How to Quickly Add Microinteractions to Your Website

    Tutorial Beginner

    In today’s quick tip I’m going to show you how to add microinteractions to your website using a JavaScript library called micron.js.

  9. 15 Time-Saving Shortcuts for Adobe XD

    15 Time-Saving Shortcuts for Adobe XD

    Course Beginner

    In this course, we’re going to cover 15 time-saving shortcuts and tips to help improve your workflow in Adobe XD. We’ll look at things such as floating...

  10. CSS Scroll Snap: What Is It? Do We Need It?

    CSS Scroll Snap: What Is It? Do We Need It?

    Tutorial Intermediate

    It can be difficult for web developers to guarantee a well-controlled scrolling experience, but luckily a CSS module titled Scroll Snap will help to enforce...

  11. Spirit App: Easy Realtime Animation For the Web

    Spirit App: Easy Realtime Animation For the Web

    Tutorial Beginner

    In this article we’ll take a look at the newest tool available for web animators called “Spirit” by Patrick Brouwer. We’ll learn how it can change the way...

  12. 3 Meaningful Motion Design Goals (With Examples)

    3 Meaningful Motion Design Goals (With Examples)

    Tutorial Beginner

    Pairing motion with key user goals can make sure your designs are meaningful and don’t just add cognitive load for your users. Here are a few goals, with...