tata

Redeveloped the TATA Tiscon website
for user friendly experience.

My Role My Role

UI Designer

UX Designer

Tools Tools

Figma

Photoshop

Illustrator

Duration Duration

2 Months

Team Team

UI/UX Designer

Developer

Project Manager

My Contribution My Contribution

User Interface

High-Fidelity Mocks

User research

About TATA Tiscon

Enforced in the year 2000, Tata Tiscon is India’s first rebar brand to launch TMT rebars with systems support from Morgan USA. As a national leading rebar brand the cornerstone of Tata Tiscon is an stagnant innovation and development of radical solutions in its business. Consistently moving into technological innovation, producing excellence and supreme most quality have helped Tata Tiscon achieve the status of India’s only reber Superbrand.

Project Objective

Tata Tiscon website the client want an unparalled commitment to making non breakable houses, completing dreams are the lasting through the inheritance of Tata Tiscon. Extreme quality building materials leading in the automation industry and unmatchable support for our connection of home builders, engineers, and dealers that unite together to make Tiscon India’s leading TMT rebar brand.

Project Timeline

For the sake of visual representation of the events overview, we organized the project into three main divisions. Starting with the discovery stage all the way to the final product.

Timeline

Problem Statement

Tiscon was in search of an enhanced website, along with a mobile responsive version, to elevate their user experience. Furthermore, the previous website lacked substantial information related to brand. Highlighting some of the problems below for better understanding.

  • Many sections of the website page fail to support the user goals and their needs.
  • The existing Tiscon website experience across various devices is clutter and
  • The Tiscon website organic search are very less and website bounce rate was very high.
  • The main CTA (call-to-action) button was not clearly visible to the user.

Challenges

challenges

Solution

Created a website where users just had to click once to check all the services. And it should be easy to understand and information about the services and process.

  • Collect data from network of home builders, engineers and dealers come together to make Tata Tiscon India’s leading TMT rebar brand!
  • Support for their network like home builders, engineers and dealers
  • Improve the Tiscon website user flow product detail pages
  • We show the relevant services content on the homepage as per the user's need.
  • Worked on the user flow design, which is very helpful to the users. Weadded more visual for better understand of the services.

Our Process

Our approach for breaking down a large projects into manageable chucks. Use this process to define the steps needed to tackle the projects, and remember to hold to all of out ideas and sketches throughout the process.

Process

Research

User Research

We started the study by interviewing various participants as part of our qualitative research We interviewed a small group of 3-4 individuals, including members of the management team, the CEO, and a Tiscon website user. We used this information to analyze website usage patterns.

Qualitative research helped us to understand users' needs and aims. After talking with employees about their real experience with the TATA Tiscon website, we have developed a users journey, survey to capture the pain points and challenges users may encounter. Below are some questions we asked.

research

Survey

We did survey where many people are asked the same question in order to understand what most people think about a product. we can learn more from a larger sample size. Also, we are able to gather results and insights quickly. It was a great way to measure the success of Tiscon product, during development.

survey

User Personas

With the help of the data collected from the user interviews, We got an insight into the goals, needs, and pain points of users. Understanding the target audience allowed me to find out the main fitness goals and frustrations of users, and hence built several User Personas, one of which is listed below.

Empathy Mapping

Utilizing both research findings and interview insights, we developed empathy maps to gain a deeper understanding of the distinct viewpoints, objectives, and challenges of potential users.

User Experience Mapping

Experience Mapping method helped us to understand user behavior, with this method we have identified and optimized the customer touchpoints for a better experience.

Competitive Analysis

Initiated with competitive analysis on 3 websites. Jindalstainless, JSW Group & Jindalsteelpower. In depth idea you will get by shown in the image below.

Information Architecture

Before we dive into the sketch, first we need to find out the flow and process in which way user will go through and interest, that means creating a IA to achieve task successfully.

Sketchs

We gather info’s from research and put together in a paper to make sure it’s going to provide users a necessary content. It’s the most power to generate multiple ideas and solutions with a quick time turnaround. It’s going to support further for high-fi mockup in later stage.

Wireframe

After multiple rounds of sketching, brainstorming, and evaluation, we determined the most user-friendly layout and information structure

User Interface Design

Design Ideas

We explored various design trends in steel bar website domain to understand create an intuitive user interface design for the website. It helped in understanding usage of Images, Colors, Iconography and copy for the interface making it clear and concise.

ui_design

Prototyping

In this phase, we employed prototyping to enhance the website's user-friendliness. This approach simplifies user interaction and offers a clearer grasp of individual clicks and navigation flow.

prototype

Live Design

The structure is made for dual mode separately i.e web and mobile. It received a few feedback sessions and this is final version of the designs that came out live. We also followed the TATA Tiscon brand style and instructions.

Design Guidelines

We create all the reusable components and design guidelines. The guidelines helps to develop the team. So they can be the updated with the guidelines and develop structure in consistent way.

Design Guidelines

What we did?

Here we have narrated the key points of the website which are very vital for the users to win trust for the brand. Also it will help them to understand the Tiscon website and how its useful to them in future.

Old vs New

Old vs New

What we achieved

Post the redesign, Tiscon has seen the following positive results in the organic search.

achieved

What did I learn

Communicating design and reformation challenges to stakeholders, project managers, and developers. Working on the correct level of belief for deliverables to make communication simple depending on whom you are communicating through.

Agile developing lifecycle- Being a part of entire process from gathering website release, I made a deeper understanding quickly for the product development of life cycle and how to better manage work with especially involving design and development sprints