NARESH SELVARAJ

Why multi-product design system?

A design system is a library of foundational guidelines, reusable components, and usage instructions. Together, they create a digital product assembly line that continuously outputs elements made efficiently by designers and developers across.

Team

- UX Designer - 4
- Product Manager
- Front-End Developer
- Design Head
- Data Analytics Specialist

Client

- Vendor Partners
- BNY Mellon Clients
- End-User : Developers
- Product Owners

Time Frame

1 Year 6 Months.

Software Tools

- Adobe XD
- Sketch
- Confluence
- JIRA
- MURAL

My Role

- Interacting with PM
- Collaborate with cross-functional designers
- Collaborate with Programers,
- Research Components &Design Components
- Visual Design,
- Classify & Document Components in UX Library.
- Getting Approval from the Platform team.

–––– Problem Universal Design System

Initially like every other Organisation we have developed our Own Digital Framework Called NXN (Next Generation Platform). To make the framework more adaptable &  consistent  We have decided to develop a design System on top of the Framework.  We have decided to develop a new set of Components & Pattern Styles.  But the Adoption metric was very low among the various Product owners & LOB. On User research, we were able to identify the existing design system was not flexible for developers it has become an additional task to customise the components and adapt them to their technologies.

–––– Solution to the Problem

Just about every organisation has a design system Initially, but often these sets of standards amount to no more than basic principles like colours, patterns, typography and code snippets. This method works for singular product teams, But our is enterprise organisations Client facing Products mature and multiple product teams make their own usage decisions, documenting these nuances can be challenging and often adds a layer of rigidity.

To address this our BNY Digital UX Platform team creates a sophisticated Multi-Product Design system. Scaling Organisation to benefit globally.

–––– New Approach

As we NXN Platform team after Ideating process, we have decided to create an overreaching design system & at the same time, we have decided to create sub-systems for each product line. This included Banking, Stock Markets, Internal, Marketing, and Investment Management. If more than one team finds a component useful design system governance Pitch in and forms a Product level sub-system to a common design system. But a component unique to a team deserves to stay with the Subsystem.

–––– Flow Chart - Diagram

Creating, Customizing or optimising an existing component

Strong and clear Documentation Support this Approach. So designers and developers know when to use which components.

Let's Take a scenario :

The design System allows for flexibility too. Let’s say for Example public team subsystem houses a chatbot - Component, Other teams want a conversational help centre. Rather than Each subsystem designing its own chatbot, the governing system can float up the Chatbot Component to the common design system, maintaining a consistent brand experience.

–––– User Research

Initial Kick off Meeting Interview - Workshop Sessions with all Product owners
& Stakeholders.

Brand & Strategy Kick-off spirit into mini - Groups 1-week Workshop, We Jointly Gathered screenshots of Patterns and design of components. Put all the components into the design phase and come up with one-stop solutions for components with Variations. For Example, we have many use cases for Wizard indicator consider all the use cases and come up with one component to write adoption metric documentation to get approval from the stakeholders.

–––– Example Variations of Components

–––– Organising Design Components

–––– What is in Common design Systems

–––– What is Product Level

–––– Who Works on What

–––– Day to day activities

–––– Universal design for all

An Opportunity for accessibility and inclusion in our Components.

7 Ways to achieve Universal Design :
1. Equitable use
2. Flexible use
3. Simple and intuitive use
4. Perceptible information
5. Tolerance for error
6. Minimal physical effort
7. Size and space for approach and use

–––– 7 Ways to achieve Universal Design

–––– Assigning Tasks

The Product Manager or Product owner will assign tasks through JIRA Boards. Based on that we will do research on components write user cases work on design & push the component for approval.

–––– Results