Web Components
.
Role
Brand Identity Design
Motion Design
Art Direction
Agency
Google Developer Studio
Brand Identity Design
Motion Design
Art Direction
Agency
Google Developer Studio
.
.
Background
Web components are a set of web platform APIs that allow you to create new custom, reusable, encapsulated HTML tags to use in web pages and web apps. It creates a framework-agnostic way of composing and repurposing code.
Web components provide a standards-based solution to problems like reusability, interoperability, and encapsulation. Using a custom element is as simple as importing it, and using the new tags in an HTML document.
Web components provide a standards-based solution to problems like reusability, interoperability, and encapsulation. Using a custom element is as simple as importing it, and using the new tags in an HTML document.
.
Opportunity
We saw an opportunity to increase knowledge of and awareness about web components in the greater digital ecosystem. There was a gap in the discovery of web components by developers and so a new Web Components brand was required to help this.
By bridging this gap and enabling easy discovery of publicly available web components for use in websites and apps, we can increase the adoption of web components for long-term strategies.
This in return promotes a healthier web ecosystem — one in which standards-based interoperability makes it easier and less costly for web developers inside and outside Google to build and maintain excellent user experiences.
By bridging this gap and enabling easy discovery of publicly available web components for use in websites and apps, we can increase the adoption of web components for long-term strategies.
This in return promotes a healthier web ecosystem — one in which standards-based interoperability makes it easier and less costly for web developers inside and outside Google to build and maintain excellent user experiences.
.
The solution
Web Components provide a solution to encapsulating data and functions into one component. Boxes and cubes are a great illustrative metaphor for this concept, allowing an easy understanding of how web components work.
They are also open source and free, so we opted to create a brand toolkit that optimizes this idea.
An open source, flexible typeface, and a flexible color palette are being used, as giving choice in type style and color adds to the idea of independence, customization, and being open source.
They are also open source and free, so we opted to create a brand toolkit that optimizes this idea.
An open source, flexible typeface, and a flexible color palette are being used, as giving choice in type style and color adds to the idea of independence, customization, and being open source.
.
Client
Web Components
Creative Direction
Rick Murphy
Brand Design / Motion Design
Andy Lawrence-Levy