Design Tips for Developers — Syntax Podcast 068

A Tasty Treats Podcast for Web Developers.

Ask a Potluck Question →
Wes Bos

Wes Bos

Full Stack JavaScript Developer. Creator of really good web development courses. BBQ enthusiast.

Scott Tolinski

Scott Tolinski

Web Developer, Creator of Level Up Tuts, Bboy, Robotops Crew and Youtuber

Playing: 068: Design Tips for Developers

0:00

LOUDNESS

Aug 22nd, 2018

Design Tips for Developers

👇 Download Show✏️ Edit Show Notes

In this episode Wes and Scott dive into designing for developers - tips and tricks for improving your designs, and how to up your game in small ways that will have a big impact on your projects.

Sanity.io - Sponsor

Sanity.io is a real-time headless CMS with a fully customizable Content Studio built in React. Get up and running by typing npm i -g @sanity/cli && sanity init in your command line. Get an awesome supercharged free developer plan on sanity.io/syntax.

Mlab - Sponsor

mLab is the leading Database-as-a-Service for MongoDB, powering over half a million deployments worldwide. Wes and Scott use mLab to host their own databases as well as take care of backups, security, scaling and performance. Try out a sandbox database on your next mongoDB project → https://mlab.com.

Show Notes

6:18 - General Design Tips

  • Spacing is important
  • Using patterns and textures

  • Use subtle gradients

  • Use subtle drop shadows

    • Multiple shadows on one element can have a nice effect
  • Don't use true black and white (e.g. #000 or #fff) - use softer variation of black and white

    • Use CSS Variables for custom blacks and whites
    • CSS default colors are almost always too harsh
  • Default browser UI is almost never the best UI

    • Select elements, radio buttons, checkboxes, etc. can all be styled - it's no fun, but way better than it’s ever been

40:22 - UX Design & Animation

51:30 - How To Get Better

××× SIIIIICK ××× PIIIICKS ×××

Shameless Plugs

Tweet us your tasty treats!