Sketch is an application which has already won the hearts of UI and UX designers around the world, even though just about anybody can learn how to use it. Among all the advantages, too numerous to list here, Sketch has a big disadvantage – it is only available for Mac OS. If you are one of the lucky owners of a Mac, though – it would be a waste not to make use of the potential of Sketch. Let me assure you that designing interfaces has never been so fast, and most of all – pleasant!
Who is this course for?
Sketch is a tool which can (and should;) be learned by all Mac users. It is a simple application you can use to work with vector graphics, or edit bitmaps. More experienced users may ask why they should learn how to work with such a simple tool. As it turns out, the potential of this fantastic app is immense! Every technique you discover makes you exclaim: “So it can be done!” The materials collected here will satisfy beginners, and experienced designers, and even those of you who already use Sketch!
Why Sketch?
Because this app was created for one thing only – efficient vector graphics design for the purpose of User Interface. Sketch has already gained a distinct advantage over less efficient applications overloaded with various functions, such as Photoshop and Illustrator, simply by its amazing performance. Just like a surgeon who uses a Swiss knife with a confusing assortment of tools instead of a single and precise scalpel – best tool at his disposal. **Faster operations, smaller files, better efficiency, dedicated UI tools and hundreds of useful, community created plug-ins** will make you entirely depend on Sketch!
Get the most out of Sketch
The course has been designed to show you full functionality of Sketch, to teach you how to best make use of its potential. Some of the topics are best presented over the course of a few, theoretical lessons, for example exporting graphics. Others, such as preparation of resources for a new project are better explained in practice. That is why I decided to divide the course into two parts. **The first one is a greatly compressed compendium of hundreds of important techniques, key shortcuts, tips and tricks.** Because of how vast the knowledge condensed in the video is, it was recorded with an extremely fast narration, so if you need to… don’t hesitate to stop the video and go back to any of the lessons, even the basic ones. **The other half of the course is entirely practical.** We focus on the use of learned techniques to design a few screens of an intelligent home app. Studying both parts of the course will teach you all the necessary theoretical concepts and equip you with practical skills needed in your everyday work on projects.
Compressed Theory
The theoretical part serves as a compendium of almost all tools, shortcuts, tips and tricks for Sketch. Just like the blue pill in Matrix, it will fill your head with creative ideas and make you become familiar with all functions of Sketch. Come back here often, because all of the techniques presented in the lessons, and some shared in secret, will serve you well in your future projects. **It might be theory, but it is far from boring!**
Sketch Interface & Tools
You will learn how to efficiently move around the interface, organize your files in Pages or Artboards, how to maximize layer, group, and symbol organization functionality. You will also learn about the tools discussed further in the course.
Exporting graphics
You are going to learn various means of exporting graphics, whether in the form of ready files suitable for modern devices, or a pure SVG/CSS code. **You will see how to prepare components for exporting properly**, so the file size and required format gets exported automatically.
Vector tools
Working with Sketch is based on vectors. Creating icons and working with shapes are simple, fast, and pleasant. One of the most noticeable advantages of such a solution is the possibility to export a project to any device or scale. You will learn good habits for working with vectors, and the most essential techniques and shortcuts.
Colors, Icons, Typography
You will see how to create a Style Guide with colors and typography, in practice. You will also learn how to make icons reusable in the project, so it stays consistent. This is very important for professional interface design.
Working with Symbols plus Libraries
Symbols in Sketch consist of reusable components, which can be used to form complex, coherent applications in extremely fast. This is one of the most powerful functions of the new versions of Sketch. Nested Symbols and their advanced settings, such as Overrides, will be used in our practical project. **Because of Symbols, making use of Atomic Design – namely creating atoms, molecules, and organisms – becomes viable and incredibly convenient.** Exporting the files to CSS or SVG is no longer out of reach, as well.
Practical UI Project
The second half of the course is focused on designing a complete project in Mobile First scheme. It will serve as a testing ground for particular combinations of techniques you must learn and use in the real projects. First, we configure the Grid and Artboard settings, then we move on to designing the icons and Symbols, and finally we create final application boards. Testing all the functions of Sketch you have learned about in theory, will showcase their practical usage and teach you good designing habits.
Working prototype
In the end, thanks to a simple method (so–called Rapid Prototyping) and a free Marvel App, we are going to design a working prototype, which can be sent, e.g. via a text message, to a phone and launched. We are going to plan board transitions and animations, and do it all in record time!
