Jio Screen

Building a flexible multi-theme design system for Jio

With over half a million mobile customers and a wide network of companies and projects, Jio needed a design system that could adapt to almost anything. It had to support different media types, work across brands, and stay true to Jio’s core identity. It also needed to be easy for internal teams and third-party partners to adopt. From a technical perspective, the aim was to help developers focus on building, not designing — making their work faster and more consistent.

My role was to design a best-in-class system that emphasized usability and accessibility while being simple to learn and implement. I also created detailed guidelines to help developers understand when and how to use each component effectively.

Jio Screen
(Sample from the design system’s documentation site)

After reviewing leading design systems, we worked with the product team to define what Jio’s system should achieve. We brought together UX, engineering, and brand perspectives to build a shared vision. Our approach was structured — tackling one component at a time. For instance, we started with a basic question: what should a best-in-class textarea look like? Once we agreed, I wrote specifications for its behavior and usage, while the visual designers refined its look and feel.

Jio Screen
(Each component was carefully documented to ensure accurate development)

As we moved from individual components (atoms) to more complex combinations (molecules), the project’s complexity grew. The design patterns needed to work across many different products with unique requirements. Collaboration across teams — and an openness to iterate — were key to making progress during this phase.

Jio Screen
(UX pattern explorations for shared global elements)

A major turning point came when we shifted from thinking of it as a design system to an experience system. This evolution was guided by ongoing feedback and iteration. The goal was to make the interface adaptable and future-proof. The company’s CEO summarized this vision with the phrase: “The world is entering an era of anytime, everywhere, by anyone.”

Jio Screen
(UX specifications for the design system components)

To test the system in real conditions, we applied it to actual screens from various Jio products. This helped us assess how well it scaled, how consistent it felt, and how easily it could adapt to different use cases.

Jio Screen
(Testing the adaptability of the system across Jio applications)

Jio’s technology team was known for its speed and efficiency. One internal story told how they built an app comparable to Microsoft Teams in just two weeks. With such a capable development force, the design system was meant to act as a force multiplier — removing friction from design work and enabling anyone, regardless of skill level, to build cohesive digital experiences with confidence.

Jio Screen

Creating a mobile-first support platform for Jio agents

During the Covid pandemic, Jio’s customer support operations had to move quickly to a work-from-home setup. Many agents had limited access to desktop technology, so we needed to redesign their support platform for mobile use. The existing system was cluttered, confusing, and not suited for remote work.

Our goal was to deeply understand how agents managed customer issues day to day. We mapped out their most frequent interactions, identified pain points, and prioritized key needs. From there, we designed a new high-level architecture, adapting patterns from Jio’s design system to make it intuitive on small screens. Research involved direct interviews and analysis of recorded calls to uncover practical insights.

Jio Screen
(A redesigned experience for Jio’s customer support agents)