Verizon Webinar 

DMart

Design System

Gainon

Rivali Park

Quest Alliance

Unity Small Finance Bank

Exotel

Verizon Developer Portal

Sparky

Dr. Reddy’s website design

Nestaspaces

Exoverify 

Mapro Signature

Quest Alliance Product Design

Foy Cosmetics

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

DMart Ecommerce Experience Design

DMart’s brand values include reliability, efficiency and maximising customer savings. As their designers, it was our job to bring these values to the fore such that they are noticed, appreciated, and loved - by all their end users!

Brief

This part of the process with DMart involved heavy user research. Of course, we also conducted a heuristic evaluation, but the most actionable part of our research was gathered via the end user’s experience with - as well as their expectations from - DMart!

Heuristic Evaluation

Competitive Analysis

User Research

Contextual Enquiry

This phase of the process called for the construction of 7 varied user ‘archetypes’.

Behavioural Archetypes

Journey Mapping

Information Architecture Re-org

The most tangible, delightful part of our process! All past research and ideation now come together to establish a successful, enjoyable user interface. We conducted a complete makeover of DMart interface, all while keeping brand integrity and core values in mind. Some highlights include:

The homepage’s interface and user experience was redesigned based on the stage of a particular user’s journey. To do so, we used customised cards for every archetype. A new user will see cards that use real data from the past to explain why DMart is a reliable brand, true to its values. New user cards can also talk about what a pick up point is, how they work, how much money DMart can help one save, and more.

Card types vary based on the actions a user has either already taken or is in anticipation of taking. User archetypes included Hesitant, Anxious, Curious and Returning Customer - among some others.

Before NOCTs intervention, users had to use 7 consecutive actions in order to place their orders, make their payments and check out. We shaved off about 4 of those steps, and ensured swift check outs for all - increasing interactions and overall conversions for DMart. Returning customers with their payment details saved, now enjoy a flashing 1-step check out system.

We worked hard and smart to optimise DMart’s product listing page design such that customers need not jump to the product display page in order to make purchases. DMart’s all new product listing page comprises of product cards that carry all the information that is relevant to buyers, ensuring it’s easy and convenient to make purchases!

We reorganised DMart’s product navigation entirely. Previously, their navigation relied on hover ability, which considerably reduced the user’s ability to explore and discover. Presently, DMart customers enjoy a leisurely, structured and organised view of everything that is available to them. This new layout allows customers to scan and locate products they are looking for, as well as make delightful new discoveries.

We initiated similar product recommendations for out of stock items! As per what is in the user’s cart, we also brought in frequently-bought-product recommendations, as well as personalised wish list reminders, based on past data. Furthermore, we provided universal suggestions egging users on to buy products that are often purchased together, like bread with butter, or shampoo with conditioner! To reduce drop offs and stress upon how easy the buying process can be, we designed to prompt users to checkout on the home page itself.

One of DMart’s core values is their deep focus on affordability, and it was our job to design in a way that helps customers realise the value of shopping with DMart.

Every cost label is accompanied with a ‘savings’ amount, perpetually notifying users about how much they are saving, even as they spend.

Across the board, designed cards reveal hefty savings made by DMart users over the years.

We created several micro-interactions that support the user’s information intake as they navigate through the DMart buying site. To remain in line with DMart’s philosophy of value for money, we used micro-interactions to ensure all users are hyper-aware when charges are added for any reason. Extra delivery charges are highlighted in red, and a floating, animated arrow points at the number every time a user opts for home delivery.

Creating custom illustrations for DMart was a joyful process for our designers. That is to say - we really had fun with it! Each illustration was made keeping DMart’s target audience in mind, while also reflecting their brand values, overall reliability and a good-natured sense of humour.

We also built illustrated icons to help users find relatability when looking through DMart’s product navigation page. This worked well because all the icons are based on (literally) ‘iconic’ products that are used around most Indian households… Fun-sized, icon-illustrations of Amul butter, Harpic toilet cleaner, Lifebuoy hand soap and Parachute coconut oil sit amongst plenty of other charming drawings of real, recognisable and quintessentially Indian products.

Design system acts as a single source of truth for streamling user experience & interface. Multiple design patterns, rules & UX guidelines were carefully created to maintain consistency across all current & future products of the application.