Overview
The article 'Speaking the Same Language' discusses the evolution of LinkedIn's design language and pattern library, focusing on the collaboration between designers and engineers. It highlights the creation of the Art Deco design language and the associated DaVinci pattern library, aiming to improve consistency and efficiency in user interface development.
What You'll Learn
1
How to implement a design language in a software development environment
2
Why a unified design language improves collaboration between designers and engineers
3
How to leverage a pattern library for faster UI development
Prerequisites & Requirements
- Understanding of design principles and user interface development
- Familiarity with CSS and JavaScript frameworks(optional)
Key Questions Answered
What is the purpose of the Art Deco design language at LinkedIn?
The Art Deco design language aims to create consistency in user experience and empower designers to make faster decisions. It provides a single library of building blocks that ensures a uniform look and feel across various products, improving accessibility and interaction best practices.
How does the DaVinci pattern library facilitate collaboration?
The DaVinci pattern library allows developers to communicate in the same language as designers, enabling quicker software development. It serves as a browsable collection of components with usage descriptions, fostering a shared understanding of design and implementation.
What are the key features of the Art Deco library?
The Art Deco library includes pattern styles, reusable assets, and core JavaScript modules that support UI development. It uses modern tools like npm for distribution, allowing easy integration into various projects and ensuring consistent design across platforms.
Technologies & Tools
Some links below are affiliate links. We may earn a commission if you make a purchase.
Frontend
CSS
Used for styling components in the pattern library.
Frontend
Javascript
Utilized in core modules for UI interactions and animations.
Tools
Npm
Used for distributing the Art Deco library across projects.
Key Actionable Insights
1Implementing a design language like Art Deco can significantly streamline your UI development process.By using a unified set of design principles and components, teams can reduce inconsistencies and improve the overall user experience.
2Encouraging contributions from the wider engineering team can enhance the quality and breadth of your pattern library.Establishing clear contribution guidelines helps onboard new contributors, leading to a more robust and versatile library.
Common Pitfalls
1
Failing to establish a clear design language can lead to inconsistencies in user interfaces.
Without a unified approach, different teams may implement varying styles and components, resulting in a disjointed user experience.
Related Concepts
Design Languages
Pattern Libraries
User Interface Design
Collaboration Between Design And Engineering