In this episode of Syntax, Scott and Wes talk about design foundations for developers — tips to follow that will make your designs better!
Sanity - Sponsor
Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get a Sanity powered site up and running in minutes at sanity.io/create. Get an awesome supercharged free developer plan on sanity.io/syntax.
Freshbooks - Sponsor
Get a 30 day free trial of Freshbooks at freshbooks.com/syntax and put SYNTAX in the “How did you hear about us?” section.
Show Notes
6:35 - Our backgrounds in design
12:41 - Foundations
Consistency makes a big difference
Use “training wheel” tools until you are confident
Always work within a system
Less is more - subtle is better
19:39 - Color
Color theory
Complementary colors and shades
Stick to color pallet generators until you are good enough
28:51 - Spacing
More spacing than you think you need
Vertical rhythm
Letter spacing: -1px
Consistent margin and padding
34:47 - Typography
Sans vs serifs
Finding fonts
Use proven combinations until you know your way around
41:49 - Interaction
Design for all states (e.g. standard, visited, active, hover, etc.)
Animations should be quick
Interactions should make sense
45:04 - Concerns beyond visuals
Accessibility via color contrast
Thin fonts and light grey are awful
Think about the poor Windows users
48:47 - Inspiration + Resources
Take inspiration from the best — you’ll find your own voice after enough work
Go easy on trends - blobby characters with purple hair
Podden och tillhörande omslagsbild på den här sidan tillhör
Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers. Innehållet i podden är skapat av Wes Bos & Scott Tolinski - Full Stack JavaScript Web Developers och inte av,
eller tillsammans med, Poddtoppen.