Designing in Sketch
Visual design aims to improve the user experience through the use of layouts, colors, typography and other visual elements. It’s important to start thinking about how to approach this process and the tools we can use. In this class, we will use Sketch as our primary tool for visual design.
Learning Objectives
- Use artboards, layers, and the inspector in Sketch
- Create boxes and text, with alignments
- Use Anima plugin to create stacks (horizontal and vertical)
- Use a few important keyboard shortcuts to speed up your work
- Create an interface mockup at medium fidelity
- Use duplicate liberally to keep track of your work as you go
Today we’ll aim to take a light ramp into getting started working with Sketch to make medium-fidelity prototypes. Familiarity with Sketch on its own will not make you a better visual designer, but facility with Sketch should allow you to more quickly mock up designs and iterate faster so that you can consider more options before landing on a final design.
Our goal for today is to simply start that journey.
See Also
Competencies
- Visual Design Amount of Design Variations
- Visual Design Quality of Design Variations
- Visual Design Presentation Slides Design
- Visual Design Style Tile
- Visual Design Typography
- Visual Design Color Palette
- Visual Design Usage of Color Palette
- Interaction Design Responsive Layout
- Interaction Design Interface layout
Explainers
Lessons
Resources
Tools
- Adobe Color
- ColorBox
- Dribbble Colors
- Google Fonts
- Color Contrast Checker
- Contrast Checker
- Paletton
- SkyFonts
- Stark
Tutorials
Talks
Articles
- A CRAP way to improve usability
- Learning to See
- Lessons From Swiss Style Graphic Design
- Typography for User Interfaces
- UI vs Print
