{"id":266117,"date":"2018-01-30T07:51:24","date_gmt":"2018-01-30T14:51:24","guid":{"rendered":"http:\/\/css-tricks.com\/?p=266117"},"modified":"2018-01-30T08:30:40","modified_gmt":"2018-01-30T15:30:40","slug":"people-writing-style-guides","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/people-writing-style-guides\/","title":{"rendered":"People Writing About Style Guides"},"content":{"rendered":"

Are you thinking about style guides lately? It seems to me it couldn’t be a hotter topic these days. I’m delighted to see it, as someone who was trying to think and build this way when the prevailing wisdom was nice thought, but these never work<\/em>. I suspect it’s threefold why style guides and design systems have taken off:<\/p>\n

    \n
  1. Component-based front-end architectures becoming very popular<\/li>\n
  2. Styling philosophies that scope styles becoming very popular<\/li>\n
  3. A shift in community attitude that style guides work<\/li>\n<\/ol>\n

    That last one feels akin to cryptocurrency to me. If everyone believes in the value, it works. If people stop believing in the value, it dies.<\/p>\n

    Anyway, in my typical Coffee-and-RSS mornings, I’ve come across quite a few recently written articles on style guides, so I figured I’d round them up for your enjoyment.<\/p>\n

    <\/p>\n

    \n

    How to Build a Design System with a Small Team<\/a> by Naema Baskanderi:<\/p>\n

    As a small team working on B2B enterprise software, we were diving into creating a design system with limited time, budget and resources … Where do you start when you don\u2019t have enough resources, time or budget?<\/p><\/blockquote>\n

    Her five tips feel about right to me:<\/p>\n

      \n
    1. Don\u2019t start from scratch<\/li>\n
    2. Know what you\u2019re working with (an audit)<\/li>\n
    3. Build as you go<\/li>\n
    4. Know your limits<\/li>\n
    5. Stay organized<\/li>\n<\/ol>\n
      \n

      Style guide-driven design systems<\/a> by Brad Frost:<\/p>\n

      I\u2019ll often have teams stand up the style guide website on Day 1 of their design system initiative. A style guide serves as the storefront that showcases all of the design system\u2019s ingredients and serves as a tangible center of mass for the whole endeavor.<\/p><\/blockquote>\n

      \n

      This Also published<\/a> their style guide (Here’s 100’s of others<\/a>, if you like peaking at other people’s take on this kind of thing). <\/p>\n

      What is notable about this to me is that it’s the closest to the meaning of style guide<\/em> to me (as opposed to a pattern library<\/em> or design system<\/em> that are more about design instructions for building out parts of the website). They only include the three things that are most important to their brand: typography, writing, and identity. Smart.<\/p>\n

      Everything you write should be easy to understand. Clarity of writing usually follows clarity of thought. Take time to think about what you\u2019re going to say, then say it as simply as possible. Keep these rules in mind whenever you\u2019re writing on behalf of the studio.<\/p><\/blockquote>\n

      \n

      Laying the foundations for system design<\/a> by Andrew Couldwell:<\/p>\n

      \n

      I use the term \u2018foundations\u2019 as part of a hierarchy for design systems and thinking. Think of the foundations as digital brand guidelines. They inspire and dovetail into our design systems, guiding all our digital products.<\/p>\n