Hands-On Sketch Masterclass - Learn Web & Mobile App Design

Master the sketch inspector to align, distribute, and size shapes with precision, using alignment tools, smart guides, and constraints on the art board. Learn about radius, rotation, and resizing behaviors.

Master crafting web and mobile app shapes in Sketch by using shapes, smart guides, and boolean operations to align, color, and layer elements with gradients, opacity, and rounded corners.

Create a low-fidelity magazine wireframe to outline a web and mobile layout using placeholders, typography, borders, and shapes, then refine it with inspiration and planned text and images.

Design mobile app icons using the Noun Project, license options, and attribution; customize in sketch with color, size, and alignment for login and weather screens.

Create a two-screen weather app with a login screen featuring the Apple logo and home screen showing the city, current weather, and a weekly forecast with at least three icons.

Design a profile screen with a map section, masking, and gradient overlay. Create the profile image with a white border, drop shadow, glare, and a corner element using vector tools.

Create and refine app icons and UI elements in sketch, using vector drawing tools, layers, grouping, masking, and drop shadows to add depth and polish.

Add icons, status bar, and a profile picture to the music profile screen; align elements, apply borders, masking, and subtle drop shadows to create a polished, image-centered header.

Add and style the music profile screen buttons with pill shapes, left-to-right purple gradients, white all caps text, and subtle purple shadows, while refining typography, borders, and alignment in Sketch.

Duplicating the Instagram logo through step-by-step shapes, gradients, and a sunburst effect, using rounded rectangles and circles with subtract operations and a drop shadow.

Learn to recreate the Google Chrome logo in Sketch by constructing overlapping ovals and circles, using vector points, color eyedropper, and inner and drop shadows.

Build the Google Play Books logo by constructing shapes, applying inner shadow, refining radii and opacity, and aligning components with smart guides and precise buffers.

Design attention-grabbing home page with giant photo backgrounds, masking, and export-ready groups for developers. Apply overlays, color choices, and simple shapes to enhance text readability and icons.

Explore mind mapping 2.0 to brainstorm for web design and build mood boards with color palettes, textures, typography, and photos as a main reference for site concepts.

Explore a new course section by watching short videos that teach you how to recreate custom shapes in Sketch, following along to see how it's done.

Learn to recreate a Thor-inspired custom text by converting text to outlines, applying borders and fills, refining spacing, and shaping vector paths for a bold, cut out background.