To be frank, your developers aren’t following your brand standards and style guides for the same reason I eat healthier when the apples are pre-sliced in the fridge…
Busy days, tight deadlines… a quick look at what needs to get done and off we go ticking away at our tasks with the little time we have before we hit the next deadline.
Trust me when I say I’m not trying to pick a fight with this topic. I by no means am implying that developers are lazy or can’t read a document stating how things should be created. My argument is that in a fast-paced environment, we often are not setting up our developers for success.
Be Clear With Your Team on How You Plan to Communicate New Styles and Updates. It’s becoming more commonplace to be developing a website before all designs and brand standards are fully established. It isn’t best-case scenario, but it is often real life scenario due to tight deadlines and changing business goals.
Consider Creating a Digital Version of Your Style Guide. If you find yourself in this situation, consider creating a digital version of your style guide. Here are some of the benefits of establishing one:
1) Having a Digital Style Guide that is consistently maintained allows the developers to always know they are looking at the most up to date version. When sharing out style guide PDF documents it takes more time to dig through to locate what they might be looking for (these documents can often be hundreds of pages long), and you take the risk of them not knowing when the version they are referencing is out of date. Style guides are often “living, breathing” materials that are going through constant changes. It makes sense to make the form you keep it in and reference easily changed and always “breathing” as well.
2) The digital version can showcase how something looks visually and also how something is developed: Not only can you have examples of how the style will look (for example, a “Buy Now” button) but you can also feature a snippet of how it should be coded. This creates more consistency in how the code is being created.
3) It saves time. When you no longer need to go searching for how something looks and have to think about the best way to code it, you save some time. Having one link that your developers always know is updated means they can work more smoothly and with confidence that they aren’t just guessing.
The most common elements that make sense to feature in your UI Design Library are consistent elements that will be repurposed in many areas. Examples like data tables, font styles, buttons, icons, date pickers, sliders and error messages are a good example of this.
Here’s an example of Starbucks putting the Digital Style Guide into practice: http://www.starbucks.com/static/reference/styleguide/