Material Design for Enterprise apps
Google's design system is starting to gain the traction. It is being recognised and widely adopted across different applications and services. However, there are not that many publicly available resources and examples of professional or enterprise apps using the design system.
As a part of recent CA Technologies hackathon, I did a small exploration design project to evaluate how Google Material Design can apply to existing APM Product line. As an obvious inspiration, I used Google's Analytics portfolio with apps like Firebase, Google Analytics or Tag Manager.
Objectives
At the beginning of the project, I defined project goals and objectives. I cannot make them public, but one of the project goals was to use existing and already released product features. I wanted to avoid confusion of considering alternate design system evaluation to be a product re-design attempt.
Re-design of the existing product with no user research involved is a controversial activity. But hey, this is a hackathon and everything is possible.
Scope
One of the core concepts that I was aiming to explore was, how the design system scale to multiple separated UIs. Historically, APM product line is distributed across different product UIs lacking common consistency. The biggest consistency gap is not in a common colour palette, icon set or component library. The biggest gap is the common navigation pattern between independent product bundles.
Simple Navigation
Concept navigation is 4 level deep. The main top level acts as a Product bundle master switch. Primary navigation is represented in a form of Horizontal tabs that relate to the secondary Sidebar. Contextual navigation is very specific to the selected page and can have a completely different appearance and function — from Searchbox to Timeline control.
Responsive Design
One of the key aspects of Material Design is the underlying metaphor that enables designers to understand how the canvas adapts to different devices and screen-sizes. The initial evaluation is not perfect, but it serves as a solid proof that even complex Enterprise apps can be used on a tablet. Kind of.
Prototype
Conclusions
It is refreshing for any designer working in the enterprise environment to take moment and work outside existing constraints to push the boundaries. I am not a big supporter of parallel design or vision project that never gets shipped. But one of the purposes of the hackathon is learning by doing, and I was able to achieve this goal.
As a part of the project, I studied Google Developers Material Design guidelines, and just that activity alone is leaving me with ton of inspiration that I will apply to my regular work stream.
Google Material Design proved to be very scalable design system that exceeds a simple pattern library. It is a viable and scalable system for product lines of any size and complexity.