How To Create Your First Wireframe (A UX Tutorial) 2021

What exactly is a wireframe, and why are they so important to the UX design process? This video will give you an introduction to wireframing and equip you with the mindset and skills to create your own paper or digital wireframes, from scratch!

In this video, Dee Scarano—a UX designer with over a decade’s worth of experience in the UX industry—will give you a complete introduction to wireframing, and show you step by step how to create your first wireframes, both with pen and paper, and with a free online tool, Wireframe.cc!

What questions do you have around wireframing? Do you have any tips or advice to share with our audience? Let us know in the comments!

For an in-depth article on wireframing, you can check out this article on the CareerFoundry blog:

Interested in making a career change into UX design? Get started by signing up for our free, 6 day short course: http://bit.ly/BecomeAUXDesigner

You can find a range of great tools for wireframing with a quick Google search, many of which are free to use and often browser-based!

Some of our favorite Wireframing tools include:

Wireframe.cc (featured in the video) - https://wireframe.cc/

Adobe XD - https://www.adobe.com/products/xd.html

Balsamiq - https://balsamiq.com/

Figma - https://www.figma.com/

Marvel - https://marvelapp.com/

Video chapters / Timestamps:

(00:00) Intro
(00:29) What exactly is a wireframe?
(01:15) Different types of wireframes
(02:46) Let's build your first wireframe
(06:21) Digitizing your first wireframe
(11:46) Outro

Thanks for watching!

#UXDesign #Wireframe #WireframingTutorial

Want more from CareerFoundry?

Check out our other social media channels and blog here:
Web design
Be the first to comment