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.
Read moreRead less
All content
Courses
Tutorials

All Prototyping content:

  1. How to Create a UI Prototype Using Adobe XD

    How to Create a UI Prototype Using Adobe XD

    Tutorial • Beginner

    Historically, Adobe Creative Cloud hasn’t had a tool for designers to quickly and efficiently prototype layouts, or get team feedback before creating the...

  2. Working With Data, Assets, and Templates in Middleman

    Working With Data, Assets, and Templates in Middleman

    Tutorial • Beginner

    This second tutorial about building static websites with Middleman dives a little deeper into the framework. By the end, you should know enough to build your...

  3. How to Set Up a Static Website With Middleman

    How to Set Up a Static Website With Middleman

    Tutorial • Beginner

    This is part one of a small series about Middleman, “a static site generator using all the shortcuts and tools in modern web development”. The first two...

  4. Quick Tip: How to Run a Guerrilla Testing Session

    Quick Tip: How to Run a Guerrilla Testing Session

    Tutorial • Beginner

    Guerrilla testing is an informal type of user testing, often run during the initial stages of a project to help inform the designs going forward. These tests...

  5. Prototyping a Fitness Application with Pixate

    Prototyping a Fitness Application with Pixate

    Tutorial • Intermediate

    In this tutorial, I’ll teach you how to create an animated prototype of your mobile application design. The prototype will look and feel like a real...

  6. Prototyping Layouts With Velositey for Photoshop

    Prototyping Layouts With Velositey for Photoshop

    Tutorial • Beginner

    In this tutorial we are going to walk through a free Photoshop extension called Velositey. Velositey (currently at version 2) provides common layout patterns...

  7. Rapid Prototyping Using Sketch Symbols and Templates

    Rapid Prototyping Using Sketch Symbols and Templates

    Tutorial • Beginner

    Starting from scratch every time you mock up a design is a waste of time, especially when building on top of an existing product. On Envato Market we already...

  8. How to Create an Interactive Prototype With Marvel

    How to Create an Interactive Prototype With Marvel

    Tutorial • Beginner

    Marvel is an excellent online tool which allow designers to create prototypes of mobile applications and web projects. In this tutorial we'll see how we can...

  9. Prototyping an Interactive iOS Product Tour With Framer.js

    Prototyping an Interactive iOS Product Tour With Framer.js

    Tutorial • Intermediate

    Framer.js and its accompanying ecosystem Framer Studio are great tools for composing, presenting and iterating upon interaction design. In this post, you'll...

  10. Stop Putting User Personas in Your Desk Drawer

    Stop Putting User Personas in Your Desk Drawer

    Tutorial • Beginner

    Personas are something we have lifted from the advertising industry. Unfortunately too often they don’t fit the web design process. Now is the time to change...

  11. How to Demo an iOS Prototype in Keynote

    How to Demo an iOS Prototype in Keynote

    Tutorial • Intermediate

    Modeling an up-and-coming app can be a very difficult task if you’re unfamiliar with professional animation software and techniques. Fortunately, Keynote...

  12. 3 Ways to Get Feedback From Clients With InVision

    3 Ways to Get Feedback From Clients With InVision

    Tutorial • Beginner

    In this tutorial we're going to use InVision's commenting and LiveShare options to maximize feedback from your clients and teams.

Related Categories

CSS
HTML/CSS
UI Design
Sketch
Unlimited Downloads
From $16.50/month
Get access to over one million creative assets on Envato.
Over 9 Million Digital Assets
Everything you need for your next creative project.
Create Beautiful Logos, Designs
& Mockups in Seconds
Design like a professional without Photoshop.
Join the Community
Share ideas. Host meetups. Lead discussions. Collaborate.