Design Systems FAQ: CVI and Styleguides
The first piece of a FAQ series aiming to answer the most asked questions we hear often at Hello Group, when working with design systems.
In this article I will provide explanations and examples to clarify the relationship that Corporate Visual Identity (CVI) and Styleguides have, inside a design system. To do so, I will answer one by one the following questions:
How is a design system different from a CVI?
How is a design system different from a Styleguide?
We currently have a CVI, do we need to start from the scratch?
At Hello my team and I study and implement design systems for enterprises. We specialise in the field, researching trends and testing workflows, it is a journey that has been going for more than 2 years now. Despite this, we feel we have only scratched the surface of this enormous topic, we believe in sharing our discoveries in exchange for your attention. If any of this stuff rings a bell, please do not hesitate to reach out, we are constantly listening 📡
Do we really know what CVI stands for?
The term CVI is normally used by a wide range of people working in an organisation: from marketing and IT directly to board level, it is often the strong leverage teams use to terminate endless debates. You heard me right: there, where numbers and opinions fail, the word CVI manages to win stakeholders. How come? The truth is that nobody really knows what CVI really stands for, let me tell you how it goes:
People hear it the first time in meeting rooms, then, if humble enough, ask to the person sitting aside “what does CVI mean?”, the answer, coming probably from somebody who asked the same question times ahead, is always “corporate visual identity”. That’s where the magic happens, those 3 words together make enough sense for us to nod initially, but the truth is, they don’t really mean anything.
So, when an intense debate breaks the room in 2 parties, the ones with a stronger confidence about what CVI is has extra points to win the matter. We’ve seen this, it makes sense, and it’s nobody’s fault.
In some people’s mind “CVI” stands for the collection of basic branding assets of their company: logotype, fonts and colour palettes; in some other minds it consists also in the way branding is executed to produce merchandise and offline/online products.
In short, there is a very poor chance that you and the person who is asking you this question is referring to the same thing when talking about CVI. I found myself confused the first time I tried to look for “the perfect CVI definition”, simply, there isn’t one.
Coherence in terminology is key, and that’s why my team and I decided to address as CVI “the minimum amount of visual assets necessary to define the corporate image of a brand”
DO NOT GET FOOLED: The amount of visual assets necessary to define a brand, grows accordingly to the popularity of the brand they represent. Nike can afford to display the “Swoosh” only to be recognised, whereas a smaller local brand might need more details for people to connect with it.
So…How is a design system different from a CVI?
Differently from a CVI, it is much easier to outline what the content of a design system should be. In fact, a design system is meant to be a recipient for ALL the existing design knowledge of a company belonging to the past, the present and the future. The CVI is therefore part of design system: it represents the foundational brand knowledge that design teams would need to take new design decisions.
The CVI as we intend it, represents the actual coordinates that design teams need to use to navigate the unknown parts of development that usually come with future products or services.
All companies should have a clear and accessible CVI to serve as foundational knowledge for the rest of content that will populate their design system.
2.How is a design system different from a styleguide?
The way the CVI assets behave and adapt to different environments determines specific set of rules, which we like to call “styleguides”. It is mandatory and necessary to distinguish different styleguides for different fields of application, for example:
The way we would use icons in a dashboard will probably differ from the way we would compose icons to create a web banner or even a poster. Factors like user experience, interactions, readability, responsiveness, etc. will come into play and inevitably affect the final output.
Nathan Curtis in one of his articles defines a styleguide as an artefact of the design process. And I couldn’t agree more, as for the CVI, a styleguide is just a part of the bigger design system. There are living styleguides, which are representing the code implemented into the client’s products — we call them “living” because they are subject of constant change from development teams. There are also static styleguides, indicating for example how to design offline stationery.
3.We currently have a CVI. Do we have to start from the scratch?
According to what I wrote above, the answer is “no”. If a company already has a CVI, what we normally recommend is to:
- Research what assets the current CVI contains. To ensure nothing is missing.
- Understand how people use it. In what format is it available? Web? Paper? do people find it helpful?
- Document the behaviours that CVI assets have in different fields of applications; collecting patterns and writing styleguides to clarify their usage.
Research -> Understand -> Document
These three activities represent actionable projects that can be executed all at once or separately, in the specified order; their results build on each other and no matter how far a company dares to push this matter, these are health checks I would recommend to any business owner.
Conclusion
There is more, and it’s more complicated, but these answers should at least set the conversation in the right direction. There will be following more articles answering other questions, in the meantime, I am attaching few resources from our design system team at Hello Group.
You can read more about design systems in general here: http://www.hellogroup.com/design-systems/
For any other general question, this is my company site http://www.hellogroup.com/
We have also a publication on Medium full of rich content!
