Launching a Tyre Brand Digitally
E-COMMERCE | UI/UX | DESIGN SYSTEMS
Building a website for a tyre manufacturing company looking to expand digitally by making their products and services available online.
Project Context
Aug - Nov 2020
Work for Fractal Ink Design & Consultancy
Team : Senior UI Designer (me), UI designer, UX Lead, UX Designer, Development team
Role & Responsibilities
Design Direction
UI Design and patterns
Making and maintaining a Design System
Managing Deliverables
Client Communication
Tools Used
Sketch
Photoshop
Miro
Zeplin
Project Brief
The brief for this project was to build a website for a tyre manufacturing company looking to expand digitally by making their products and services available online.
With the desire to be accessible across platforms and devices, the website was envisioned with the basic premise of being responsive and catering to buying of products.
Process/Approach
It was interesting to get to know customer behaviour around a product like tyres. The frequency of buying, information to be provided prior to purchase as well as expected services were quite different from common e-commerce platforms.
In order to build a website that caters to this uniqueness, features such as recommendation models, vehicle compatibility check, tyre size guide, registration for warranty, etc were proposed to aid purchasing.
An excerpt from the initial moodboard
Visual Design
As a senior interface designer, I pitched and established the design language for the project, balancing product showcase and brand guidelines.
Here are somethings that guided the visual language:
-
Early discussions with the client focused on keywords like bold, clean, sporty, accessible, and product-oriented, guiding the visual concept to spotlight tyres.
-
The design was kept minimal and clean to highlight product images and marketing campaigns.
-
Brand colors were used in cards and icons to maintain consistent brand presence throughout the website.
The diverse features of the website
Execution
Extending the visual language to the many features of the website was a creatively satisfying task but it wasn’t without its challenges. Often, design iterations for some features would have to be completely reimagined or even scrapped due to technical limitations.
Aside from the extension and maintaining of the design language for the website, I worked closely with a team of developers as well as the client to track progress and manage timelines and deliverables.
Adapted designs for desktop and tablet
Challenges and Learnings
-
This project provided a well-rounded experience, allowing me to design new content types, manage teams, and handle client communication.
-
I was involved in the design team from start to finish, gaining insight into all project stages and their demands.
-
I learned the importance of scalability by designing templated pages and components for the website.
-
Close collaboration with the development team made me aware of technical limitations, enhancing my understanding of front-end interface design.
-
Managing team and client communication was a new challenge, where I quickly learned the value of visual solutioning with collaborative tools like Miro.
Success of the Project
This project had 4M unique visitors in its debut year
It was also entered in the India’s Best Design Awards 2021 contest and won under the Best Design Projects Category.