What’s New in the 2018 Edition of User Experience Design in Sketch
We’re excited to announce the 2018 edition of User Experience Design in Sketch—a comprehensive rewrite and rerecording of the original course.
The new course includes exciting new workflows that harness Sketch’s newest features—including Data, Libraries, and Prototyping. We’ve made hundreds of improvements based on student feedback, covered both iOS and Android solutions, and added even more design tips and tricks. The new course is 70% longer—almost 3.5 hours!
All students who previously purchased this course have already received the update for free. To those students, we especially recommend watching the new videos about Sketch 52’s Data feature and Prototyping in Sketch.
Below are the most notable improvements in the 2018 edition of User Experience Design in Sketch:
Sketch’s Symbols, overrides, and Libraries features have inspired an overhaul in the course’s design workflow. We go in depth about using nested Symbols, pulling from pre-made Libraries with tons of overrides, and integrating UI templates from different sources.
Sketch 52 (released October 2, 2018) introduced a new feature called Data, for quickly filling image, text, and Symbol layers with randomized content. We’ve got a whole section on how to integrate the Data feature into your design workflow. Check it out (it’s our free preview video)!
The prototyping part of the course—which previously relied on Flinto—is now accomplished entirely using Sketch’s latest prototyping features.
We’ve got Android designers covered now too. The updated curriculum includes projects, tools, workflows, and resources for both Android and iOS.
Separate iOS and Android project files (for every section in the course).
Separate iOS and Android versions of the Visual Design section video, so students only need to learn about the templates and resources for the platform they’re designing for.
Equivalent Android workflows and tips. When workflows are different between Android and iOS, the videos cover both.
Resource sections include numerous links that are relevant to Android and Google’s Material Design.
Many videos now explain more about design principles and how to make key design decisions. For example, the UI Typography section now includes an in-depth visualization about typesetting techniques and the differences between display and text typefaces.
All videos now include chapter markers on the video player’s timeline. These chapter markers make it easy to skip to a specific part of a video—perfect for the longer, more advanced sections!
The visual design portion of the course has gone from 4 sections to 8, by adding far more thorough explanations (and multiple workflows) of UI templates and Symbol Libraries, and by creating discreet sections for both iOS and Android visual design.
Added a short animation to assist with visualizing spatial awareness while wireframing (Section 5).
To organize Symbols from different parts of the design project, we now rename them so as to create groups in the Symbols list (Section 7).
Carefully examined how to change the dimensions of a Symbol master Artboard and update its Symbol instances to use the new dimensions (Section 9B). The same workflow is used for swapping entire Symbols with other Symbols of different sizes (Section 9A).
Detailed how to make changes to (or swap) a nested symbol within a Library, by first directing the Library’s symbol to discover the dimensions of its nested components (Section 14).
Integrated Google’s Material Design Color Tool into the visual design workflow for Android (Section 9B).
Revised the workflow for integrating images into mockups, to almost exclusively use image fills instead of masking. We still cover masking in detail, however, and use it sparingly (Section 10).
Updated the background-blur legibility workflow for Sketch 52’s different controls, including using the Saturation slider instead of blend modes to intensify colors below the layer (Section 12).
Added Android-friendly legibility techniques that reference Material Design standards (Section 12).
Added a visualization animation to assist with the explanation of how gray and semitransparent black colors behave differently in an interface (Section 12).
Focused the typography and legibility workflows into their own discreet sections, and added detailed animations introducing each section’s design principles and techniques (Sections 12 & 13).
Demonstrated the practical differences between Apple’s San Francisco and Google’s Roboto typefaces, and what to be aware of when typesetting with them (Section 13).
Spent additional time discussing Shared Styles and Text Styles, including when not to use them, and how to keep them organized (Sections 12 & 13).
Added a short overview of 3rd party prototyping tools, their benefits, and a comparison of their power and learnability (Section 14).
Export section goes deeper about export settings and how to create custom export presets to speed up your workflow (Section 15).
Export section now covers how to save assets into folders, how this impacts Symbol names, how to use this with export setting prefixes, and how to avoid saving to folders if it impedes your workflow (Section 15).
Added a short overview of ImageOptim—a popular tool for optimizing and compressing image files—to both the Data and Export sections (Section 15).
Added a short overview of Zeplin, which—in the last couple years—has clearly become an essential tool to help designers collaborate with developers (Section 15). We’re also partnering with Zeplin to provide Sketch Master students with 3 months of the tool for free!
Improved speed and pacing throughout all videos—slowing down in complicated parts, and speeding up in repetitive, obvious parts.
The videos now show an animated preview of important resources, rather than simply referring to them in speech.
Plus over a hundred other small improvements to the curriculum, videos, projects, cheat sheets and resources—much of it based on student feedback. Thank you, students!