top of page
FabIndia.png
Logo.png

Fabindia is India’s largest e-commerce platform for products that are made from traditional techniques, skills and handcrafted processes. Their product offerings include apparel, home linen, decor, furniture, food, etc.

 

This project was about revamping their existing app and website.

Domain
Lifestyle, e-commerce
Service Rendered
UX Revamp

The UX Challenge

FabIndia transitioned online before the pandemic. During the pandemic, they had to shut their retail stores, forcing them to rely entire on their online experience. Trusted with 60+ years of legacy, they sought to expand their customer base. Post-lockdown, they observed increased home décor and furniture sales, aiming to diversify from their "kurta company" image.

  • Missing brand personality:
    The biggest challenge was that FabIndia was largely only known for its Apparel offerings. It was positioned as a ‘Kurta company’ even though it had a large portfolio of offerings in the home and lifestyle space. It did not highlight the handcrafted products by empowering local artisans across India for which Fabindia is known.
     

  • Standard e-commerce template design:
    Nothing unique about the experience.
     

  • Lack of persuasion:
    While Fabindia is a trusted brand, there was no validation for why a customer should purchase from them.

The Solution

Celebrate India ✨

  • Highlighting the factors that make Fabindia unique – sustainability, handcrafted products, artisans, the Fabindia village, the crafts of India

  • Visual styling designed with the brand colours, a typeface palette that combined serif with sans serif to symbolize ethnic and traditional with a modern touch

  • Portraying design authority through Style Guides, Interior Design Studio
     

Showcasing Fabindia’s wide range of products and services 🙌🏼

  • Selling Fabindia as a lifestyle brand through “A day in the life of…”

  • Cross-selling and up-selling via banners, cross-category combos to inspire customers

  • Building customization and monogramming flows

  • Engaging and educating users on the various art forms and fabrics of the country
     

Alternate forms of navigation ↔️

  • Make the app more modern & intuitive. Rework on the entire information architecture.

The Process

Stakeholder interviews: Insights

Conducted interviews with stakeholders of the apparel, home & interiors departments to understand the business goals, strategic considerations & critical success factors for this project.
 

  • Customers: Well educated, millenials, established professionals, high income

  • Offerings: Lifestyle, utility, aesthetics, decor, multi-category products

  • Fabindia is facing a challenging situation – typically only known for kurtas. It initially started as a home brand.

  • There is no home page for Home & Lifestyle and hence has an identity crisis

  • COVID-19 lockdown was a game changer since people focused on homes. Also, people started cooking at home, which led to sales of their kitchen appliances, furniture, etc

  • The option of EMI in payment is shown during the checkout process instead of as a part of the product details page, so not many people are aware and that needs to be highlighted.

  • Definition of FabIndia aesthetics – Heritage, old world, global, evident finesse and classic

  • Success Factors - 20% total turnover online as opposed to 8% offline

Sitemap

We performed the Card sorting technique to better understand the L1, L2, L3 categories for better and easier navigation. This helped us segregate each L3 categories like Kurtas, Shirts, Bedsheets under the right section.

61546d6f82171f5785384b93_card-p-1600 1.png

Information Architecture

For better navigation of categories, each category was divided under L1 (Main category), L2 (sub-category) & L3 (Sub-sub-category).

image 48.png
Fab bg.png

Visual Design

The page contains brief information about all the different product categories spanning from lifestyle to furniture products

Style Guides

Aa

Using Playfair Display for banner headings adds elegance, while Assistant's modern sans-serif design enhances readability in body text. 

Playfair Display

Regular

Semi bold italic

Bold

Assistant

Regular

Semi bold

Bold

Includes bright and pastel colours. Every category has it's own unique colour

Mask Group.png

Primary Colours

#903233

#4A4A4A

#FFFFFF

Secondary Colours

#D7AF49

#DC7964

#5C3831

#648DDC

#E7B1B1

#D49D49

Search Icon.png
Rupee Icon-1.png
Cart Icon.png
Account Icon.png
Frame 12.png
Group 8.png
Rupee Icon.png

Product Cards

PC - MRP & Discount.png

On Hover

PC- hover.png
Furniture.png
PC- Trending Tag.png

E-commerce Banners

L2 banner.png
Hp Kids collection banner.png
L2 banner 2.png

UI Screens

The primary goal was to showcase various navigation methods, educating users and enhancing search, especially regarding fabric and the diverse types of sari materials from different states.

Screenshot 2023-10-10 at 9.54.55 AM.png
iPhone 13 & 14 - 2.png
Fab bg.png
  • Bold Apparel Imagery:
    Striking and visually appealing imagery is utilised to showcase items, capturing the attention of users.

     

  • Extensive Filter Options:
    The platform offers a wide range of filter options, allowing users to refine their search and find products that align with their specific requirements.

     

  • Convenient Navigation:
    The navigation bar above the catalogue images facilitates easy access to supporting products. For eg, when viewing Saris, users can also navigate to blouses.

99shots_so.png
Fab bg.png
MacBook Air - 1.png
03 PDP Apparel - Compare mweb.png
  • Sustainable and Handcrafted Icons:
    Icons are used to clearly indicate if a product is sustainable and handcrafted, providing users with visual cues and reinforcing Fabindia's commitment to ethical practices.

     

  • Furniture Customisation:
    The platform highlights a customisation option for furniture, enabling users to personalize their furniture choices and create pieces that suit their specific preferences and needs.

     

  • Comparative Analysis:
    The Compare option allows users to perform detailed comparisons between two or three apparel products, empowering them to make informed buying decisions. This feature simplifies the evaluation process and aids users in selecting the most suitable product based on their preferences and requirements.

Design System Overview

Colors.png
CTA. Tabs & Links.png
Checkout - Payment elements.png

Outcome

An E-Commerce Platform Showcasing, Educating, and Engaging Users

 

  • The platform embodies the essence of the brand while showcasing its unique factors and engaging customers in an informative and interactive manner

  • It celebrates India's rich cultural heritage by highlighting sustainability, handcrafted products, artisans, the Fabindia village, and the crafts of India.

  • With visual styling aligned with the brand's colors and a typeface palette combining ethnic and traditional elements with a modern touch, the platform exudes a design authority that reflects Fabindia's commitment to preserving and promoting Indian craftsmanship.

  • Fabindia's wide range of products and services are prominently showcased, allowing customers to explore and purchase with ease.

    Check design that is live at Fabindia

Start to End e-commerce (Responsive design for App, Desktop, m-web)

150+ screens ✨

bottom of page