Basic UX/UI Design Wireframes and Prototyping Tutorial

Sarah Bannister, UX/UI Designer | Dog Enthusiast

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
10 Lessons (14m)
    • 1. Introduction

      1:01
    • 2. What's a Wireframe?

      1:21
    • 3. What's a Prototype?

      1:03
    • 4. The Design Process

      3:46
    • 5. What's a User Task Flow?

      1:44
    • 6. Wireframing Tools

      0:44
    • 7. Wireframing

      1:59
    • 8. Scanning and Uploading Your Wireframes

      0:19
    • 9. Prototyping in InVision (Invisionapp.com)

      1:19
    • 10. Conclusion

      0:41
37 students are watching this class

About This Class

Learn the modern-day process of UX/UI design and how to draw wireframes for a mobile app. We’ll start out simple, going over the foundations of early stage app design and move on to creating detailed low-fidelity wireframes that we can then move into a free InVision account to create a clickable prototype.

What you can expect to learn:

  • UX/UI design process fundamentals
  • How to determine task  and user flows for an app concept
  • How to draw low-fidelity wireframes for an app concept
  • How to create a clickable prototype in InVision

What you will create:

  • A low-fidelity design for an app
  • A clickable InVision prototype

This class is geared towards those who have very little to no experience in UX/UI design, but have an interest in learning.