Nova Design System
A cohesive product experience

Story

How we improved usability, productivity and deployed a cohesive experience across all Apttus products

Apttus has two core products and 8 other add-on products. All of them had different interactions for the same functions. All of them had different visual design for the same functions. All of them had the same code written in multiple different ways for the same interface. With the amount of features in the roadmap, the usability complaints by customers and the development time, we decided to create a design system to unify our product experience and speed up development time.

Our director lead the initiative with a handful of components and I took over to create interactions and apply a common visual asthetic to a majority of the components. I handled the deployment, master Sketch file and documentation on how the system is to be consumed. I also started the first iteration of the code framework—HTML and SASS/CSS. When we hired a UX Technologist, he took over the code repository. A few months in, we also hired a Sr. Visual Designer who I currently work with directly to add and modify components on a weekly basis. We have a full time team on the system currently and just announced it at our fiscal year kickoff to rave reviews. Brown-bag sessions are scheduled to teach product management, professional services and sales engineers how to use Sketch and Craft to design with Nova. We are currently in the process of implementing the system across all products in time for our Accelerate conference in May 2017.

 
 
 
 

Team

A cross-functional team was assembled

Sr. Director of UX / Executive Sponsor Todd Zaki Warfel
Product Designer Alan Weibel
Visual Designer Chris P
UX Technologist Chad S

 

Problem

Our applications were a mess

Some interfaces lived in a CRM, some lived in our own cloud environment. There was a ton of front-end code bloat and technical debt. The same interactions were designed differently from app to app. We were getting a lot of complaints about our interface, usability and application speed. Our developers were overwhelmed with tasks and overworked.

 
 
 

Solution

A design system to the rescue

With a standardized style guide, interactive components and an easy to deploy codebase our idea sketches to product release has decreased immensely. Designers can use a component library in Sketch, using Craft, to quickly iterate on designs. Developers can easily deploy a design that is given to them by copy/pasting from the design system library or by using defined element classes. Product managers can explore ideas on their own and sales engineers can propose solutions to help close deals all with the tools we provide with Nova. This is a win across the board and our company is excited to use it moving forward.

 
 
I have had the pleasure to work with Alan on a design system at Apttus. Alan is both versatile and focused. He has a good balance of technical knowledge as well as having a depth of knowledge in design patterns. Alan can quickly iterate on solutions for complex problems. He is a great person to work with and a huge contributor to the team. Chad Sahlhoff — UX Technologist

Sorry, but this website was built to showcase modern internet browser features. Your browser is over 7 years old and does not have most of the functions that are featured on this site.

Please consider updating to a modern internet browser from the links below before revisiting this site.

Google Chrome Mozilla Firefox Microsoft Internet Explorer Apple Safari

The browsers above will make websites you visit look beautiful as well as perform much faster than your current version.