Nagarro

Project

❹ – ⑤

° Info

I worked as a Product Designer at Nagarro Digital Ventures (formerly Mokriya), a user-centric design and development agency focused on helping companies ranging from early-stage startups to Fortune 500 companies build products that are simple, beautiful, and easy to use.

During my time at Nagarro, I worked on a variety of fast-paced projects ranging from concept developments and proof of concepts, but also full-blown projects taking product ideas from initial discovery to final delivery.

Timeframe

2018 - 2019

Responsibilities

UI/UX, Concept Development, Design Systems

Platforms

Web, Mobile

Systemized risk

✺

Nagarro partnered with RMS (Risk Management Solutions), a company that provides software products to insurance underwriters, to build a design system called Radius for their Intelligent Risk Platform application suite.

The Radius Design System was built from the ground up and it took about 3 months to create the initial release. I lead the design efforts and helped continuously evolve the design system after the launch.

° Team

Val Khechinashvili, Jon Tam, JL Phillips, Jaden Giordano, Michel Paupulaire, Julie Crew, Sami Stephenson, Tiago Goncalves, Rui Dias

Out with the old, in with the new

We created a system that gave designers enough creative leeway when designing, but also enough constraints to present RMS products with a unified look & feel and consistent user experience. In order to do this, we started by conducting an audit of their existing products.



For our audit, we wanted to look a holistic view on RMS products. We started by examining some of their legacy UI. As we were making our audit, we started to take note of all the components, styles, and patterns that were being used.

Layering the foundation

We introduced a flexible color system with a range of supporting colors as well as a consistent spacing system to allow designers to create visual rhythm within their product layouts. We accompanied this with a type system with the right balance of font sizes, weights, and character stylizations to create a rich and diverse type style library.

This foundation gave us the essential building blocks to build out the basic components of the design system. We prioritized the most basic components first like buttons and text inputs and slowly began to grow the system outward.

We created grid and layout patterns to provide common ways for designers to arrange content on the screen. Our goal was to have modular layout options that would cater well for the suite of applications. Designers can mix and match these types of layout regions to create dynamic layouts.

Carefully crafted, thoughtfully contributed

Radius has grown to host over hundreds of different components with permutations. Along with maintaining the system, we introduced scalable improvements like component theming and documentation. 

We also established a method to save resources by creating a optimized workflow that allowed representatives from each product team to make contributions to Radius on behalf of their product. 

❶

We introduced component themeing across a spectrum of light and dark variants—this allows designers to customize component styles to fit the specific aesthetic of their product.

❷

Each component has built-in fluid behavior to be resized for any particular need. Designers could easily take a fluid component and resize the width or height of it while the content adapted automatically. 

❸

Our contribution system was the bridge between a centralized design system and product teams which allowed for distributed ideation and contribution at higher speed.

0 to 100, real quick

Radius Design System was integrated into 4 products within RMS’s app suite. RMS product teams were able to build quality user experiences that remained consistent across a portfolio of products.

With a large library of components and patterns, designers were able to build a high-fidelity mockup within 15 minutes.

✺ Cody Cai © 2024

Dribbble

Instagram

Twitter

Linkedin