Creating Graphics with Sketch: Learn by Video

Creating Graphics with Sketch: Learn by Video

Released August 2014
Publisher(s): Pearson
ISBN: 0133993213

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Video description

Learn to use Bohemian Coding’s Sketch 3 for all of your interface design work with this 3-hour comprehensive beginner’s guide to the app that more and more interface designers are choosing as an alternative to Photoshop. In this 3-hour video tutorial, you get a complete introduction to using this lean, yet powerful new program. Amar Sagoo, a senior interaction designer at Google and avid Sketch user, starts by walking you through the Sketch interface and explaining the tools and what they do. He goes on to show you how to set up and organize your projects; position, size, and style your graphics; create shapes; import work; edit bitmaps; export graphics; and extend the power of Sketch with templates, stencils, and plug-ins. You can download project files to follow along with the exercises and reinforce what you’ve learned. Even if you have no prior experience designing with Sketch, after working through this step-by-step video tutorial, you will have the skills and confidence you need to use Sketch 3 for creating all of your online graphics. User Level: Beginning/Intermediate Closed-Captioning in English

Table of contents

  1. Sketch Basics
    1. Welcome 00:01:26
    2. How Sketch works: vectors versus bitmaps 00:01:05
    3. The Sketch user interface (UI) 00:02:26
    4. Creating content 00:03:23
    5. Selecting content 00:03:05
    6. Moving, resizing, reordering, duplicating, and deleting layers 00:01:08
    7. Zooming and panning 00:02:36
    8. Styling basics 00:01:25
    9. Viewing pixels and using a Retina display 00:01:21
  2. Organizing Your Drawing
    1. Artboards 00:03:16
    2. Groups 00:02:51
    3. Naming objects 00:01:56
    4. Locking and hiding content 00:02:04
    5. Tips for selecting content 00:02:47
    6. Pages 00:01:45
  3. More on positioning and sizing
    1. Rulers 00:01:36
    2. Moving and resizing using the keyboard 00:00:57
    3. Tips for changing values in the inspector 00:02:07
    4. Scaling proportionately 00:01:20
    5. Smart guides and measuring 00:01:50
    6. Alignment and distribution 00:01:36
    7. Making grids of objects 00:02:03
    8. Ensuring sharp edges by fitting to pixels 00:01:16
    9. Manual alignment guides 00:01:04
    10. Grids and layouts 00:02:18
  4. Styling
    1. More on using the Color panel 00:02:50
    2. Opacity and blending 00:01:11
    3. Gradients and advanced fills 00:02:43
    4. More on borders and lines 00:02:26
    5. Shadows 00:02:27
    6. Text styling 00:01:58
    7. Blurring and reflections 00:01:51
    8. Replicating styling 00:02:36
  5. Reusing styling and content
    1. Reusable styles for shapes 00:01:41
    2. Reusable text styling 00:01:23
    3. Reusing content with symbols 00:02:36
  6. Creating your own shapes
    1. Creating your own shapes using paths 00:02:41
    2. Advanced options and shortcuts for drawing paths 00:01:55
    3. Joining paths, editing segments, and varying stroke width 00:02:04
    4. Rotating, flipping, skewing, and perspective distortion 00:02:12
    5. Combining shapes 00:03:24
    6. Vectorizing stroke and text 00:01:36
    7. Creating rotated copies 00:01:02
    8. Text on a path 00:01:59
  7. Working with bitmaps
    1. Adding bitmaps 00:00:58
    2. Editing bitmap content 00:02:14
    3. Styling and adjusting bitmaps 00:01:28
    4. Masks 00:03:26
    5. Masking bitmaps with flexible proportions 00:02:42
    6. Converting between vectors and bitmaps 00:01:33
    7. Nine-slice images 00:01:21
  8. Exporting
    1. Exporting artboards 00:01:53
    2. Exporting layers and groups 00:01:33
    3. Exporting arbitrary regions with slices 00:02:15
    4. Export options 00:01:21
    5. More export options 00:01:45
    6. Drag & drop export 00:00:38
    7. Copying CSS attributes 00:00:47

Product information

  • Title: Creating Graphics with Sketch: Learn by Video
  • Author(s):
  • Release date: August 2014
  • Publisher(s): Pearson
  • ISBN: 0133993213