A design system is a collection of reusable, consistent components guided by clear standards, which can be assembled to build numerous applications.
As companies grow and diversify, there is a crucial need for a governance framework that unifies best practices across various products. By creating a collection of repeatable components and standards guiding their use, companies can accelerate innovation, streamline design and development workflows, and ensure consistency. This project showcase highlights the creation of the American Airlines (AA) Design System, focusing on visual design and user experience.
The system allows team members the freedom to contribute creatively while adhering to established parameters, ensuring both innovation and consistency.
All components of the system work seamlessly together, providing a cohesive user experience across products.
Comprehensive and up-to-date documentation was crucial. Detailed documentation covered component states and governance, facilitating easy adoption and use.
All components are designed to be highly reusable across various contexts and applications.
The AA design system was built on top of Angular Material to expedite development and demonstrate early ROI.
The system allows team members the freedom to contribute creatively while adhering to established parameters, ensuring both innovation and consistency.
As a partner with Insight Innovations, we collaborated with their cross-functional team to create a design system for American Airlines. We began by evaluating the existing design components and overall design maturity.
We began by evaluating the existing UI components and the maturity of current practices. Collaboration was key, and we drew inspiration from industry leaders like Google Material, Shopify, and IBM.
Through mood boards and mockups, we established the overall visual identity, addressing questions about visual style, such as the use of rounded corners, color schemes, and depth communication through shadows.
The visuals were created using Sketch, and the UI component library was built using Angular Material.
By focusing on visual design and user experience, the American Airlines Design System successfully addresses design debt, enhances collaboration, reduces repetitive work, and ensures consistency across products. This system empowers teams to innovate while maintaining a cohesive and high-quality user experience.
Get the Latest Inspiration & Insights
We specialize in crafting compelling brand narratives and producing impactful video content that drives results and resonates with communities.
