I've been using an 8pt baseline grid for the framework I've been creating for our web applications. This is super helpful, thanks!
Are there points where you have to stray from the grid? I've encountered a few scenarios where straying seem better than shoe-horning just because. I deal with a lot of meta-data rich content where the varying of content can lead to some headaches. Sometimes I wonder if it's better to think through these problems and use the grid to solve that, or if it's "good enough" since it's seldom an issue.
Also thanks for the sketch file. much appreciated.
Hey Trevor. I try and keep to the grid, but there always times to break the rules. For me, it more about having a structure in place for sizing to eliminate the amount of decisions you have to make in the design process.
So rad. I've been trying to get others in my teams to design like this. I think people feel very restricted, generally, when giving such a tight grid framework.
I haven't done it for Sketch but you can also set your nudge to be 1 and 8 or 8 and 16. Could be really helpful when designing quickly. https://www.sketchapp.com/learn/documentation/preferences/
Interesting that you don't use a traditional 12-column grid—certainly makes it easier to align your columns to your 8 pt grid. Does your 4/8/16-column grid carry over to code as well?
12 works as well. Even with my current column, I need to deviate a bit to hit those other keylines. In most cases I'm not executing most of the code, so I always discuss how we decide to implements. Currently we utilize FlexBot and a set of grid layouts.
Hm, that makes sense. Been trying to figure out a way to make the 8 pt grid work with the 12-column grid, and it sounds like not being too strict about the rules is the best way forward.
Really helpful Joel! Great insight.
Thanks man :-)