Sketch from A to Z (2020): Become an app designer
4.7 (7,292 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
25,977 students enrolled

Sketch from A to Z (2020): Become an app designer

Finally a comprehensive guide to using Sketch for designing mobile applications. Learn to design an app from A to Z.
4.7 (7,292 ratings)
Course Ratings are calculated from individual students’ ratings and a variety of other signals, like age of rating and reliability, to ensure that they reflect course quality fairly and accurately.
25,966 students enrolled
Last updated 6/2020
English [Auto], Italian [Auto], 3 more
  • Polish [Auto]
  • Portuguese [Auto]
  • Spanish [Auto]
Current price: $16.51 Original price: $149.99 Discount: 89% off
30-Day Money-Back Guarantee
This course includes
  • 3.5 hours on-demand video
  • 3 articles
  • 39 downloadable resources
  • Full lifetime access
  • Access on mobile and TV
  • Certificate of Completion
Training 5 or more people?

Get your team access to 4,000+ top Udemy courses anytime, anywhere.

Try Udemy for Business
What you'll learn
  • Master Sketch to create a strong mobile app design from start to finish
  • Advanced techniques and shortcuts to design faster than most professionals
  • User interface design best practices to solve problems effectively
  • Know how to simplify visual information to clarify meaning and improve UX
  • Understand how to design for different device viewports
  • How to leverage tools to ensure pixel perfect design work
  • How to save tons of time by using shared styles, symbols, and libraries
  • How to export and hand off the assets developers need to build a real app
  • How a good UI (user interface) influences good UX (user experience)
  • Be a professional designer who creates better apps faster
  • Download Sketch and purchase a license or use the free trial

  Sketch has revolutionized the world of mobile application design by providing the tools to transform yourself into a professional app designer with only a few hours of training. This course will teach you to use the Sketch to design dynamic, development-ready mobile app user interfaces that impress clients and engage users. 

  Learn to Design Beautiful, High-Quality Mobile Application UI with Sketch's Powerful Tools and Smooth Workflow 

  • Master the essential principles and tools of Sketch.

  • Discover design techniques that will enhance your creative potential.

  • Learn and implementUI best practices to ensure quality and usability.

  • Journey from concept to completion by creating a sample mobile application.

  Find Out Why Google, Apple, and Facebook Designers Use Sketch

  Many of Silicon Valley’s most established and fastest growing companies swear by Sketch when designing UIs for mobile applications because it’s fast and intuitive, and produces stunning final products. 

  Sketch isn’t just a tool for designing pretty apps, It’s a tool for composing UI components and design patterns that scale without effort as projects grow more complex.

       When it comes to styling, we’re able to use multiple color and gradient fills, borders, and automatically scaling images on a single layer to keep out layers list clean and organized.

       It gives us the ability to reuse styles and elements throughout a design — so that you never have to waste time making the same change in multiple places. And those reused elements can be nested inside one another and then tweaked or swapped out to create powerful and flexible design systems.

  Contents and Overview 

  Whether you’re a beginner or a veteran designer with experience using Photoshop and Illustrator, you will find this course valuable in the way that it blends step-by-step instruction with hands-on, customizable exercises: 

  • Mobile App Design from A to Z: With 52 lectures and 3.5 hours of content, this course covers everything from layers, shapes, and styling to text editing to exporting finished projects.

  • Test Your Knowledge: Periodic quizzes will review key concepts and ensure that you are mastering the content.

  • Interactive Design Project: Together with the instructor, you will build a sample UI for an iPhone music player app. Included Sketch documents allow you to pick up at any point in the project.

  After completing this course, you will understand how to design high-quality mobile application UI using Sketch and you will be better prepared to meet the demands of your clients and developers. 

Who this course is for:
  • This course is perfect for web and print designers
  • This course is perfect for Photoshop or Illustrator users
  • This course requires practically no prior design experience
  • Some graphic design experience will be helpful
  • This course is not to learn to develop a functioning app
Course content
Expand all 57 lectures 03:39:07
+ Introduction
6 lectures 17:04

Let's take a moment to get to know one another and talk about why we are here.

Preview 01:35

Where does Sketch fit into the world as a design application? Let's talk about what makes Sketch such a strong application for user interface design (UI design) and what makes it a better choice for this type of design work than Photoshop.

Preview 01:27

Let's get the included fonts installed into your computer's Font Book before we get started.

Installing the included fonts

Let's discuss the difference between vector graphics in Sketch vs raster or pixel based graphics like images and photographs.

Raster vs Vector

Time to get familiar with Sketch by learning where our tools are. Here we cover the toolbar, layers list, inspector, and touch on the canvas.

Preview 04:15

Every Sketch document is made up of simple parts. Pages, canvas, and artboards. Let's learn how the pieces come together.

The Anatomy of a Sketch Document
+ Starting Your Project Right
2 lectures 06:25

Getting the size of your artboards right before you begin designing sets you up for success. Artboard sizes may look strange at first glance because they appear to be super "low res". Let's find out why.

Artboard Sizes for iOS Apps

Let's get into best practices for staying out of trouble with save, save as, and autosave. Autosave can be an extremely useful feature when it is properly understood and properly taken advantage of.

Preview 03:21

Let's make sure we are on the same page

Intro Quiz
4 questions
+ Layer Basics
7 lectures 29:29

Let's get familiar with the design elements which will combine to form anything and everything you build in Sketch.

Types of Layers

Time to get hands on. Let's master making selections and positioning things on our canvas. We will be learning some shortcuts that make even simple navigation much faster and easier.

Interacting with Objects

Sketch gives us a number of tool to stay pixel perfect. Eyeballing things works for most artwork, but in software design there is a lot to be said for visual organization and precision.

Preview 07:06

Sometimes the best way to align things is to design on a grid. Using grids and guides, spacing and aligning objects can be effortless.

Guides, Grids, and Measuring

As your design becomes more complex, layers will begin to get in the way of other layers. Let's look at how keep things from getting in our way.

Hiding, Locking, and Grouping Layers

Are you a pro at navigating around Sketch documents?

Layer Basics Quiz
6 questions

Here is the often requested cheat sheet of Sketch shortcuts. It's a giant JPG that makes for a nice desktop background :)

Sketch shortcuts cheat sheet
+ Shapes
13 lectures 54:01

Its about time we begin adding content to our canvas. Let's take a close look at the different vector shapes we have to choose from.

Adding Shapes

Now that we know how to add shapes to our canvas, let's begin assembling the basic shapes that will form our app.

Activity - Building the Blockframe

Before we continue, let's put a little bit of polish on the elements of our blockframe to help differentiate them from one another.

Activity - Finishing the Blockframe
Editing Shapes

Sketch wouldn't be a true vector drawing application without the ability to draw your own custom shapes. 

Here we look at the two tools within Sketch to draw our own shapes from scratch.

Drawing Vector Shapes

Let's take a moment to practice drawing with the Vector Tool.

Activity - Drawing Vector Shapes

Boolean Operations are an incredible tool within Sketch which allow us to combine basic shapes to create more complex ones. You'll be impressed with how much you can accomplish with simple shapes and Boolean Operations.

Preview 03:05

Let's take a few minutes to put Boolean Operations into practice and see how quickly basic shapes become something much more interesting.

Activity - Boolean Operations

Masking in Sketch can be very, very easy and very, very useful. On the other hand, it can be a bit confusing to figure out on your own. In this lesson I show you how to keep making simple and get your masks under control.

Images and Masking

In Sketch, it is easy and intuitive to grab the handles around an object and drag them to scale the object up or down. The problem with this becomes clear when borders or rounded corners are involved. Dragging the handles scales the path, but does not scale the effects in proportion. This lesson demonstrates how to scale an object or group of objects along with its effects.

Resizing vs Scaling

It's not unusual to need things to be lined up with one another and spaced even from one another. While it might be less common, you may want things lined up and spaced both vertically, as well as horizontally. In this tutorial I show you how easy it is in Sketch 3 to organize and align objects on such a grid. Also how to duplicate an object into rows and columns.

Make Grid

While Adobe Illustrator and Sketch are both vector drawing applications, they aren't exactly joined in holy matrimony. If you're a designer using Illustrator, these tips will make your life a lot easier when bringing artwork over.

Pasting from Illustrator

Let's finish populating our app with graphics before we style them.

Pasting in the graphics

Make sure you are not geometrically challenged in Sketch

Shapes Quiz
8 questions
+ Styling
9 lectures 43:28

We are ready to beginning styling our app. Let's start with our different types of shape fills. Colors, gradients, and patterns; its all here.


Let's dig into some details about one of the most important "primitives" we use for design. Colors.


Borders, or "strokes", can be used in a number of ways to style objects or paths. Let's see how width, color, joints, miters, and end caps make borders useful.


Shadows are a simple and elegant way to add depth and dimensionality to your design. Let's go over some tips for incorporating shadows.

Preview 03:39

Blending Modes and opacity allow us to get one layer to have transparency or blending with layers below. Beautiful and complex effects can be created with little effort.

Blending Modes and Opacity

There are several different types of blur effects that can be applied in Sketch. Let's compare them and review one of the more misunderstood blur types: the Background Blur.


As we style more and more objects in our design, the more we may find ourselves doing the same tasks over and over again. One of the recurring themes throughout this course is how to avoid doing repetitive tasks. Let's learn how to avoid repetitive styling.

Borrowing Style

Now that we know how to copy and paste style from one object to another, let's look at an amazing feature in Sketch that allows us to share styles between similar objects so that they always remain in sync with one another.

Shared Styles

Time to take what we've learned and apply it to some finishing touches to our design.

Finishing Touches

Style is subjective. Knowing your tools is not.

Styling Quiz
6 questions
+ Text
4 lectures 16:32

Time to add text to our design and get familiar with the text tools available to us.

Basics of Text Editing

Area text allows us to insert paragraphs of text that remain within a bounding box. Let's look at the ins and outs of text boxes and styling the text within those boxes.

Text and Styles

When we Sketch open documents on computers that don't have the necessary fonts installed, Sketch gives us a chance to make it right. Let's look at how.

Missing Fonts

We still have some text layers to add before our content is complete. Let's wrap that up before we continue.

Adding the remaining text

Type is a beautiful group of letters, not a group of beautiful letters.

Text Quiz
3 questions

A brief validation of the few image editing tools

Images Quiz
2 questions
+ Symbols
7 lectures 23:48

Symbols are a feature that truly set Sketch apart from other design applications. Using symbols, we can reuse design elements rapidly and keep the content of these design elements completely synchronized throughout our document. Making global design changes could not be easier thanks to Symbols.

Organizing Symbols
Smart Layout
Nesting Symbols
More about Smart Layout
Sketch Libraries

Make sure you understand one of Sketch's greatest tools

Symbols Quiz
2 questions
+ Images
3 lectures 07:46

While image editing is certainly better suited to raster image editing applications like Photoshop, there are still a few tools within Sketch for making simple adjustments.

Color Adjustments
Bitmap Editing
Applying Styles to Images
+ Exporting
3 lectures 13:18

When you click the Export button in the toolbar, Sketch will pop down a sheet listing all exportable layers in the canvas; artboards, slices and regular layers. You can export some or all of these from there. Let's start by focusing on Artboards.

Exporting Artboards
Export Presets

Exporting a layer by itself means that no other elements on the canvas will be exported with it. If there's a layer on top or a background below it, neither of those will be included in the export. This is how we break our design apart into individual assets to export for developers to build our actual app.

Exporting Layers and Slices

Last and most definitely not least, will you be able to get your design turned into something functional?

Exporting Quiz
3 questions
+ Congratulations!
1 lecture 00:55

You made it to the end of the course! Take a moment to celebrate.