Lessons:17Length:1.6 hours
Open Assignment Available
There's a hands-on Open Assignment associated with this course. Practice everything you've learned in the course, ask questions, and post your designs in the comments section.
Wireframing is something every web designer should do before starting a new project. Whether it’s for a website or a web application, a wireframe allows you to create the proper structure for it in an efficient manner.
In this course you’ll learn what wireframing is all about and then build your own kit using Sketch.
Sketch is an amazing application for digital design, learn everything you need to get started in our course Up and Running With Sketch. Up to speed with Sketch? Learn how to use Craft, a plugin for Sketch, and accelerate your workflow by creating rapidly with real-world content in our course Craft: Designing With Real-World Data.
1.Hello!
1.1Welcome01:18
1.1
Welcome
01:18
2.About Wireframing
2.1Why Should You Use Wireframes?06:34
2.1
Why Should You Use Wireframes?
06:34
2.2Wireframes vs. Prototypes vs. Mockups05:17
2.2
Wireframes vs. Prototypes vs. Mockups
05:17
2.3Existing Wireframing Solutions03:32
2.3
Existing Wireframing Solutions
03:32
2.4Wireframing With Sketch09:37
2.4
Wireframing With Sketch
09:37
3.The Wireframing Kit
3.1The Kit Structure03:22
3.1
The Kit Structure
03:22
3.2The Kit Defaults02:35
3.2
The Kit Defaults
02:35
4.Basic Elements
4.1Shapes07:06
4.1
Shapes
07:06
4.2Buttons and Form Elements08:34
4.2
Buttons and Form Elements
08:34
4.3Text Elements03:19
4.3
Text Elements
03:19
4.4Placeholders07:22
4.4
Placeholders
07:22
5.Advanced Elements
5.1Forms06:14
5.1
Forms
06:14
5.2Header Elements02:23
5.2
Header Elements
02:23
5.3Space-Saving Elements07:10
5.3
Space-Saving Elements
07:10
5.4Media04:18
5.4
Media
04:18
5.5Other Common Elements13:13
5.5
Other Common Elements
13:13
6.Conclusion
6.1Final Words01:29
6.1
Final Words
01:29
