386: Designing with Grid Systems

386: Designing with Grid Systems

Author: Brian Lovin, Marshall Bock February 24, 2021 Duration: 24:52

This week, we talk about designing with grid systems. In particular: when grid systems break, and what to do when they don’t align with our hardware screens perfectly. In The Sidebar, we talk all about design debt: how to work with it, pay it down, and eventually learn to accept it.


Golden Ratio Supporter:

A huge shoutout to Copilot, the best app for budgeting and tracking your personal finances. It’s our favorite tool for categorizing our spending, having our net worth available at a glance, and getting monthly (and yearly!) digests of all your spending.

Get the app at copilot.money.

Latest VIP Patrons:

  • Leigh LaMon
  • Edyta Niemyjska
  • Jaime
  • Brandon Hills
  • Jonathan De Wet
  • Guilherme Kaiser
  • Lillian Lin
  • Aris Acoba
  • Kyle Stuart
  • Hugo Tunius
  • Kish Patel
  • Michael Otto
  • Denis Zastanceanu
  • Kelvin O'Shea
  • Scott Underwood
  • Lachlan Campbell
  • Lucas VanGombos
  • Sam xia
  • Ravi Aujla
  • Brian Nelson

The Sidebar:

The Sidebar is an exclusive weekly segment for our Patreon supporters. You can subscribe starting at $1 per month for access to full episodes going forward! Sign up at https://patreon.com/designdetails.

In this week's Sidebar, we answer a listener question that can be ultimately paraphrased as: How do you deal with design debt?


Main Topic:

Joey Jungle asks on GitHub: Designing with grid systems? – and continues with many words asking why grid systems are often unintuitive, and don’t align neatly with our hardware screens. Great question!


Cool Things:

  • Brian shared the iA Quattro typeface, one of three beautiful (and free, open source!) typefaces from the iA team. It seems to be striking a happy middle ground between a sans and a mono, making it useful for adding a computer-y tone to an interface while staying readable.
  • Marshall shared Little Nightmares II, a beautiful (and scary) indie side-scroller. It looks gorgeous, and the sound design is incredible.

Design Details on the Web:


Byeee!


Every week, Brian Lovin and Marshall Bock settle in for a thoughtful, often meandering chat that pulls back the curtain on how things are made. Their Design Details podcast lives in the rich space where technology and the arts intersect, focusing less on polished case studies and more on the real, sometimes messy, work of design. You’ll hear them dissect the nuances of product decisions, debate the evolving culture of creative teams, and share personal stories from their own experiences in the industry. It feels less like a lecture and more like eavesdropping on a conversation between two deeply knowledgeable friends. The discussions regularly venture into the philosophical side of craft, examining why certain choices resonate and how design shapes our daily interactions with the world. For anyone curious about the thinking behind the pixels and interfaces, this show offers a consistent, grounded perspective. Tuning in provides a sense of community and a candid look at the process, making it a staple for designers and creators who appreciate substance over flash.
Author: Language: English Episodes: 100

Design Details
Podcast Episodes
414: Memorable Software Moments [not-audio_url] [/not-audio_url]

Duration: 25:30
This week, we recall our most recent “wow” moments with the products in our lives. What are yours? In The Sidebar, we talk about different loading state strategies and their impact on the user experience.Golden Ratio Sup…
413: Design Mentorship [not-audio_url] [/not-audio_url]

Duration: 31:27
This week, we talk about design mentorship: what does an effective mentor do, how to find a mentor, how to avoid giving bad career advice, and more. In The Sidebar, we talk about obsessing over the pixels, wasting time o…
412: Side Project Perfectionism [not-audio_url] [/not-audio_url]

Duration: 35:19
This week, we talk about how we combat perfectionism in our side projects, the value of shipping, and why sharing a project too early can backfire. In the Sidebar, we recap Apple’s September event with our hot takes and…
411: Follow-upisode [not-audio_url] [/not-audio_url]

Duration: 32:31
This week, we follow up on last week’s conversation about designing at agencies, hiring contractors, Yelp’s app icons, and Bock’s Constant. In the Sidebar, we talk about designing with your mind’s eye and how learning to…
410: Agency vs In-House Design [not-audio_url] [/not-audio_url]

Duration: 26:46
This week, we compare agency vs. in-house design work, dissect the tradeoffs, and share interview tips for anyone moving from an agency to a product company. In The Sidebar, we share our favorite Keynote tips and tricks…
409: Twitter’s Follow Button [not-audio_url] [/not-audio_url]

Duration: 21:33
This week, we talk about Twitter’s new follow buttons. Are they a mistake? Or a fix for something broken that we’d all become used to? Our opinions on buttons emerge! In The Sidebar, we talk about what to do with time of…
408: News Desk, Vol. 2 [not-audio_url] [/not-audio_url]

Duration: 32:34
This week, we talk about Yelp’s new logo and app icons, Apple’s new child safety initiatives, and the miniature masterpieces of the Olympic pictograms. In the Sidebar, we curate practical negotiation tips, strategies, an…
407: Pixel 6 [not-audio_url] [/not-audio_url]

Duration: 27:46
This week, we talk about the new Pixel 6 announcement, how it stacks up against the competition, and what we’re most excited about. In The Sidebar, we share our design regrets: things we shipped that ended up being mista…
406: Who Leads UI Design? [not-audio_url] [/not-audio_url]

Duration: 24:55
This week, we dig into questions like: who should design a team’s visual style guide? And: who should break a tie in subjective aesthetic arguments? In The Sidebar, we share our tips and strategies for succeeding as a ne…
405: News Desk, Vol. 1 [not-audio_url] [/not-audio_url]

Duration: 32:43
This week, we talk about the new Microsoft emoji, a cool Android 12 feature, the joy of watching Apple iterate in public, and the new “King of Buttons” aka the Steam Deck. In The Sidebar, we talk about the challenge of h…