7

Sketch guidelines for a team?

over 3 years ago from , Team Lead Experience Design

When working with multiple designers in a team it can be confusing to work in an other designer’s Sketch file. We believe that it’s key to have some guidelines in place so that every designer works in the same way. By using this approach our designers can collaborate more easily without having to decipher the structure of a Sketch file.

  • artboard naming
  • symbols approach ( what is a symbol, naming )
  • Text styles ( h1, heading-1 heading-1-red heading-1-primary, p-small-left )
  • Colors ( primary, blue, brand1, error, success )

I’m very interested in seeing how other teams define their guidelines. I was wondering if some of you would share those with me so that I could get inspired.

There are not many blogposts about Sketch guidelines out there.

11 comments

  • Artur Eldib, over 3 years ago

    Use Figma instead

    2 points
    • , over 3 years ago

      If you use Figma, what guidelines would you setup for your team? Or do you let every designer have their own way of working.

      2 points
  • Andrew CiobanasiuAndrew Ciobanasiu, over 3 years ago

    November Five has a plugin (and artboard naming convention) which inspired me to create my own to fit our typical project needs. EDIT: You literally work for November Five. My bad haha.

    Regarding symbols, you may have already come across this post by Lloyd Humphreys but it's a pretty good line of thinking for getting a convention in place.

    2 points
    • , over 3 years ago

      Thanks! Glad to hear our plugin has inspired you :)

      Would you care to share those guidelines? Would be great to see how other people are naming their artboards.

      Thanks for sharing the post! Looks like a great write up, added it to my medium bookmarks!

      0 points
  • Ashish BogawatAshish Bogawat, over 3 years ago

    One of the first things I do when anyone joins the team, is to have then disable 'auto-save' in Sketch. With everything residing in Dropbox, having someone casually open a file and mess with it can be very dangerous if it is going to save itself and sync on everyone else's computer.

    1 point
  • Chris CChris C, over 3 years ago

    I've always been a fan of keeping things as interconnected as possible. For instance, when specifying spacing, typography, components, color, etc... I always try and name them what the actual class name would be in CSS or call them what the component is actually named. If you're using symbols, this is pretty easy to keep consistent across the team. The closer each thing is to the real product, the happier your designers and engineers will be because it cuts out SO much communication and guessing.

    Secondly, use Sketch templates so designers can start new projects off on the right foot. Also, Sketch libraries are essential for the consistency you are looking to create.

    I think artboard naming guidelines would take a good bit of time to establish because within flows and experiences, there are tons of different states of the UI, components on a page, and decision trees that can occur so be sure you're baking that kind of stuff in.

    0 points
  • Andrew C, over 3 years ago

    Artboard naming is generally a waste of time to enforce, because Sketch files and screenshots are ultimately artifacts that have a limited shelf life before they become obsolete.

    The others are solved with a design system and style guide. Sketch lets you import other sketch symbols with their Libraries feature. I've had good luck by making sure our Libraries are broken up in to logical groups (Standard controls, Illustration, atoms, molecules, and organisms if you're in to atomic design).

    0 points
    • , over 3 years ago

      A shared library sounds like a great solution!

      We have to create a design system for every project, we don't work on one single project or one single design language.

      Do you start with a generic library and then edit them for the new project?

      0 points
      • Andrew C, over 3 years ago

        Ah no—I haven't worked in an agency-model for awhile so I'm not certain (Reusable Symbol systems didn't exist as they do since Sketch cracked that nut). My team works at a mid-sized tech start-up so our patterns are largely enforceable over time).

        I would stick with the Atomic Design model with your system and catalog standard organisms/web component. You could then modify and re-style the components for each new project relatively quickly.

        0 points