The TrackR homepage was in need of a redesign as it did not showcase what the company does, it's products, features and other programs that they offer.
The goal is to increase the conversion rate and user engagement with the website, while also increasing the users' comprehension throughout the following processes: learn about the company, learn about the product and its features and then convert them to customers.
Our aim is to provide TrackR with a clean design solution for their homepage by creating hierarchy of information and organizing content that is easy to parse through for the user. We reorchestrated the information architecture, enhanced the user interface, and user flow. Now, users are presented with a visually pleasing and easy-to-use homepage where they can learn about the company, get an overview of the products and be able to purchase it from the homepage itself.
DISCOVERY THROUGH RESEARCH
Every solution begins with the discovery of the problem. We began by asking questions. What does TrackR have to offer to its users? What sets them apart from their competitors? Why should users buy TrackR products? In order to find where the problem lies, we conducted usability testing on the existing website to observe and pinpoint users' behaviors, pain points, and preferences while navigating through the website.
Testing the existing design
Testing the usability and design of the existing TrackR homepage was an important first step for us to understand where we want to set out to research. Having users navigate through the website helped us discover what is working and what is not.
Looking at a few brands out in the market, we compared their homepage against TrackR. We asked users to walk us through the competitors website such as Tile and Chipolo and tell us about what they liked or did not enjoy about it. This helped us understand what works for the users and what would make their whole experience pleasurable.
...the icons help me understand how the product works... I hate to read, so this works for me...
...a quick overview of the products available gives me an idea of what the company has to offer and helps me make an informed decision
DEFINING THE PROBLEM
From our user research and usability testing with startup employees, existing customers and new users, we identified three areas where users were having most trouble with:
- Product discovery - unable to locate information on all products
- Understanding product features and function
- Terminology and imagery that was confusing and misled existing customers
DESIGNING THE SOLUTION
Taking the Mobile First approach, we designed wireframes for mobile screens first taking into account what we had learnt from our research and then translated these into desktop webpage wireframes using Axure.
We conducted initial testing using the following wireframes which gave some more insights
Annotated mockups of desktop website