Verizon Webinar 

DMart

Design System

Gainon

Quest Alliance

Exotel

Verizon Developer Portal

Sparky

Nestaspaces

Exoverify 

Mapro Signature

Quest Alliance Product Design

Treety

All Living Things Film Festival

Qubes

Soulskill

Strawfit

Fruity Sweets

Falero

TruCSR

Mother Nurture

Kaleidescape

Exoverify Branding

Inox Wind

E-commerce Research and Strategy

Verizon Video Conferencing 

Bluejeans UCaaS

Polaris

BlueJeans Conference

Kanlet

Bluejeans Enterprise design system

‘Bluejeans Events’ is one of Verizon’s virtual events platform trusted by industry giants like IBM, Redhat etc. To support the product’s redesign and future development, we created a comprehensive design system that would assist designers, developers and PMs. It formed a strong foundation which current and future designs were based off of.



(Events + Meeting Dashboard (OOM) + Command Centre + Bluejeans Meetings)

Brief

For their product redesign and future product enhancements, the strong foundation of a design system was necessary to ensure consistency and speedy design & development. There were several challenges that had to be overcome.

We stepped back to assess the entire ecosystem—products, components, and teams—to better understand the challenges we needed to address while building the design system.

In-depth audit of all products to uncover gaps & inconsistencies

10+ stakeholder interviews to understand concerns

Analyzing component usage and edge cases

Reviewing accessibility of elements & components

Designing for 3 products, 50+ designers & 200+ developers

Prioritizing end experience for a media-based product

Working around legacy technology

The design system follows Atomic design principles, breaking down UI elements into 4 levels: atoms, molecules, organisms, patterns. This modular approach allows each component to be developed, tested, and maintained independently, making it easier to scale while being consistent and avoiding redundant work.
Designed for designers, developers and PMs, the design system incorporates all requirements and documentation to meet the needs of all stakeholders.

The design system was built to deliver a consistent experience across every touchpoint — from web to desktop applications, mobile apps, and conference room systems. Designed with scalability at its core, the system ensured seamless interactions across platforms without compromising performance or usability.

Given the video conferencing product’s broad user base, accessibility was a key focus in both the design and design system. We ensured all colours followed WCAG-compliant colour contrast for readability, alt-tags for all images and icons, careful consideration of keyboard navigation & shortcuts, and screen reader access to follow the appropriate structure & flow. All this ensured that the designs created using the design system offered an inclusive experience for all users.

Improved color contrast ratios

Focusing on keyboard navigation

Fixed small-sized texts

Improved accessibility for screen readers with  Alt texts and Aria labels

We built our design components to scale across platforms, seamlessly adapting to different screen sizes, supporting both light and dark modes, and pre-prototyped with interactions — making it easier to build and test large design flows without creating interactions from scratch.

We designed the components for adapting to different layouts and screen sizes. With easily switchable properties, they allow quick customization — making it faster to prototype, iterate, and maintain consistency across platforms.

By establishing a 1:1 mapping of colors between Light and Dark themes using figma variables, we reduced design time considerably. This approach not only streamlined the design process but also made handoffs to developers more efficient, ensuring consistency across themes with minimal back-and-forth.

The components in the design system had interactive baked in so that new mocks could be quickly and easily prototyped. This allowed designers, PMs and developers to be on the same page on the expected user experience.

We added micro interactions purposefully to bring moments of delight across the experience, making the interface feel more intuitive and alive. From subtle button feedback to smooth transitions, each interaction is designed to guide users seamlessly while adding a sense of polish and personality.

The design system was crafted to align with the ‘Bluejeans’ brand’s visual language, and expanding it into a comprehensive design system. This ensured consistency across all touch-points. Being a video-based product, we followed a dark UI with subtle components, enhancing usability while maintaining brand identity. Content and tone of voice guidelines were also defined to create a unified and engaging experience.

Beyond delivering Figma files, we took extra care to ensure every design detail was conveyed with clarity. From interaction behaviours to the smallest visual nuances, we documented design logic, edge cases, and component guidelines to leave no room for guesswork.

We worked closely with developers to help translate the design system into a functional, code-based component library using Storybook. Through continuous collaboration, we ensured visual and functional accuracy, since these formed the foundation of all developed product. Regular feedback loops and documentation helped streamline the development process, making the components reusable, scalable and aligned with the design vision.

The design system streamlined collaboration, reducing design time while ensuring consistency across devices and user flows. It enabled faster iterations, improved scalability, and maintained a cohesive user experience.

By comparing the creation of a UI from scratch vs by using the design system, there was a significant reduction in design time. The reusable components, with all the variants and interactions built-in, allowed designers to work significantly faster.

The reusable library of components in Storybook allowed developers to recreate designs into code at a much faster speed. Given that these components were bug-tested and passed through Design QA, the number of bugs arising during testing was also significantly lower.

We have built various design systems, ranging from basic to extensive, tailored to different projects. Each design system was driven by the need for speed, consistency and efficiency in design and development.