When starting to build a design, it's important to work out the overall experience in wireframes. In this video, we discuss how to create responsive wireframes in Sketch.
- [Instructor] In this video, we'll cover wire framing.…While Sketch has been around since 2008,…it's only been within the last couple of years…that it's really gained steam with designers everywhere,…especially those of us who like to work fast…and do both the wire framing and visual design.…Keep in mind that you could use a plethora of templates…out there that are available for you at Sketch App Sources…and elsewhere on the web.…However, for the purposes of putting Sketch to the test…and learning how to create our own wire frames,…we're gonna build everything right here in Sketch ourselves.…
Per a best practice, let's go ahead and start…with the mobile version for this responsive site.…So you press space bar down and see how you get the hand…and that'll move us over to the mobile version.…Now that we're looking at mobile,…let's go ahead and start adding our elements.…Go to Insert, Shape, Rectangle.…We're gonna have a big banner image up at the top,…much like their splash, so let's go ahead…and create a nice big, almost square here at the top…
- Extending Sketch
- Building a style guide
- Using styles and symbols
- Working with artboards
- Making responsive wireframes
- Using responsive design plugins: Artboard Zoom, Sketch Focus, Craft, and more
- Exporting your design
- Building a mobile app for iOS, Android, or watchOS
- Integrating other tools in your Sketch workflow
Skill Level Intermediate
Q: This course was updated on 05/15/2018. What changed?
A: We updated a new number of videos about third-party resources, such as the Sketch App Sources website and plugins like Marketch and Craft, to reflect the most recent changes to those resources.
User Experience for Web Designerswith Chris Nodder1h 49m Beginner
1. Using Outside Resources
2. Beyond the Basics
3. Responsive Design
4. Mobile Design
5. Extending beyond Sketch
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.