BIM 360 STYLE GUIDE
CASE STUDY #3
INTRODUCTION
A design system should not simply be a collection of user interface components along with some design theory. Collaboration between designers is essential to the success of a project, and it’s a measure of a team’s success.
MY ROLE IN THIS PROJECT
RESEARCH
MANAGING
IMPLEMENTING
THE PROBLEM
BIM 360 teams are located at Autodesk offices around the world. Communication is not always easy and comprehensive.
In addition, BIM 360 products need to align with the general Autodesk style guide, use the same color pallet, fonts, etc.
MY GOAL
Creating one collaboration resource file for designers and front end developers.
Help the team with the design hand-off
Create a design system that will help the design teams stay consistent
Creating a “single source of truth” - so team members will always see the latest resource
RESEARCH
I started with an online research, looking for existing researches on building a design system. I found a detailed guide on creating a Design System, that emphasizes the benefits to the company and gives a lot of examples of design systems.
This research answered some of my questions, but I needed more information.
The next step was to find out what are the existing solutions for building a style guide.
I found that there were a variety of solutions for this challenge, and decided to focus on one well-known method that aimed to tackle this issue - the Atomic Design.
Here are some questions that guided me in this stage:
What is the best platform for building our design guide?
What is the best way of sharing it with BIM 360 design teams?
How to create the UI Inventory for the Design System?
How to maintain it?
AUDIT
I took an inventory to see what assets are currently in use. I was looking in our Sketch files, collecting components, interactions, and styles.
CREATE
In order to get our team to think about the design across all products we needed a central document with all of the answers, so I built our UI Framework in Sketch as a resource for designers.
MAINTAIN
A style guide that is out of date is almost as useless as not having style guide at all.
The challenge for the coming months was to update the system over time, keep adding new components, styles and interactions while keep on syncing with the other design teams.
Style guide highlights
Insights & takeaways
GATEKEEPER
One of the best ways to make sure our style guide is up-to-date is to assign someone on the team to coordinate and review all communications to ensure that new patterns are always added and that everyone stays the course.
LIVE TALKS
No matter how good our style guide is - it cannot replace talking to the rest of the team. This is not just something that we’re going to build, hand over - and that’s it. Building and creating new assets sometime has to come with a proper conversation.
SHARING IS CARING
A good design system doesn’t just benefit design teams; it also a powerful resource for everyone who is involved in the product life-cycle, from development teams to QAs.
By creating our single source of truth all teams were able to make smart decisions and the hand-off process was improved.
