Klikfranchise: Creating a franchise directory system

Work / user interface, analytics

Share

How we can improve the website with data

I have been assigned the responsibility of developing a business and franchise directory.‍ Not only that, but the primary goal of Klikfranchise is to keep people from being scammed or deceived by the franchisor (people that sell the franchise). I must indicate to the user which franchisor can be trusted and educate them on the franchisor's business.

Most of the work I’ve done for Klikfranchise isn’t disclosed to the public yet. In this case study, I have excluded and obfuscated sensitive information. All information in this case study is my own and does not necessarily reflect the views of Klikfranchise.

Role: UX Designer, UI Designer
Sector: Directory, Franchise
Time: 1 Year
Project Category: Work

Business Goals
The considerations of business:
How to make people want to use the calculator because it is to prevent people being deceived by unrealistic offers from the franchisor. 
We designed the franchise directory to be easy to read, quick to use, and unbiased. 
How to present our articles to make people interested and educated. 

The new business is coming: 
How do we provide a one-stop platform for users to find suppliers or any related to business needs?

Analyze the current website (by Previous Designer)
I used Google Analytics to evaluate the current web, and my conclusions were as follows:
I discovered that people who read articles go directly to the article via an external link or a Google search.
The top page that users clicked was also the franchise directory.
Calculator franchise is ranked relatively low.

What factors do I consider when designing Klikfranchise Home Page?
Eyetracking by GazeRecorder is being tested by a group of up to 50 users. I discovered that the majority of users only look at the hero section (first top screen). Less than 40% of participants scroll down to the page beneath the hero section.
With these findings, I proposed in my design that I place all of the important information in the hero section. And in the section below, I would include any supporting features or information that serve as an additional.

How I design the new Hero Section
After I analyzed the old design, I implemented the principle of putting important things all in the hero section (first top screen).

In my first proposed design, I focused on the hero section only to find a franchise. After I did usability testing on five participants, I found that people did not notice other features. So, I made changes to the design.

"Testing one user early in the project is better than testing 50 near the end." - Steve Krug

After the usability testing, I highlighted the franchise finding, the calculator franchise, and the promotional banner. Users notice and have more envision of what is klikfranchise and the services, as shown in the heatmap of the proposed design after usability testing.

Designed a new feature (The Marketplace)
I researched how to use eyetracking on the marketplace search product.
In the Amazon search for a specific product (UX Design by Amelie Boucher), users tend to focus on the images of the products.

Meanwhile, in the more generic product (a gaming headset without a brand), users tend to focus on the title and price. Subsequently, I'll place emphasis on the images, title, and price. The others are merely supplementary information.

The Marketplace Design
Before usability testing, all the supplier, vendor, and consultant are in the same page. I used to create them on a separate page to show the user all of the options available in Klikfranchise. However, after conducting usability testing, I discovered that users are overwhelmed by the abundance of options and often fail to consider their own needs.

After the usability testing results, I changed the design to focus and highlight the products, and if the user wants to find other products, there is a category on the side of the page. Furthermore, it draws users' attention to the products.

Another Finding on Google Analytics
I researched Google Analytics again to design the Kalkulator franchise because the previous designs were not mobile friendly enough. As a result, I've discovered that the majority of users are using the mobile app. We are experiencing several issues, including the fact that the information in the question is not displayed because it is not responsive.

Revamped the calculator
The key to a smooth user experience in the Kalkulator franchise is that users can understand the question easily, which reduces bounce rate. And to produce that, I make sure the information is shown every time they click the input number field, so the user does not have to go back and forth if the information is in a pop-up model. I also display the default number and results so that users can see what number corresponds to the question.

For a more detailed case study of Klikfranchise
Because it is a work project, I only show a few designs and explanations in public. Feel free to contact me for more information of the case studies on Klikfranchise.

Klikfranchise: Creating a franchise directory system

Work / user interface, analytics

Share

How we can improve the website with data

I have been assigned the responsibility of developing a business and franchise directory.‍ Not only that, but the primary goal of Klikfranchise is to keep people from being scammed or deceived by the franchisor (people that sell the franchise). I must indicate to the user which franchisor can be trusted and educate them on the franchisor's business.

Most of the work I’ve done for Klikfranchise isn’t disclosed to the public yet. In this case study, I have excluded and obfuscated sensitive information. All information in this case study is my own and does not necessarily reflect the views of Klikfranchise.

Role: UX Designer, UI Designer
Sector: Directory, Franchise
Time: 1 Year
Project Category: Work

Business Goals
The considerations of business:
How to make people want to use the calculator because it is to prevent people being deceived by unrealistic offers from the franchisor. 
We designed the franchise directory to be easy to read, quick to use, and unbiased. 
How to present our articles to make people interested and educated. 

The new business is coming: 
How do we provide a one-stop platform for users to find suppliers or any related to business needs?

Analyze the current website (by Previous Designer)
I used Google Analytics to evaluate the current web, and my conclusions were as follows:
I discovered that people who read articles go directly to the article via an external link or a Google search.
The top page that users clicked was also the franchise directory.
Calculator franchise is ranked relatively low.

What factors do I consider when designing Klikfranchise Home Page?
Eyetracking by GazeRecorder is being tested by a group of up to 50 users. I discovered that the majority of users only look at the hero section (first top screen). Less than 40% of participants scroll down to the page beneath the hero section.
With these findings, I proposed in my design that I place all of the important information in the hero section. And in the section below, I would include any supporting features or information that serve as an additional.

How I design the new Hero Section
After I analyzed the old design, I implemented the principle of putting important things all in the hero section (first top screen).

In my first proposed design, I focused on the hero section only to find a franchise. After I did usability testing on five participants, I found that people did not notice other features. So, I made changes to the design.

"Testing one user early in the project is better than testing 50 near the end." - Steve Krug

After the usability testing, I highlighted the franchise finding, the calculator franchise, and the promotional banner. Users notice and have more envision of what is klikfranchise and the services, as shown in the heatmap of the proposed design after usability testing.

Designed a new feature (The Marketplace)
I researched how to use eyetracking on the marketplace search product.
In the Amazon search for a specific product (UX Design by Amelie Boucher), users tend to focus on the images of the products.

Meanwhile, in the more generic product (a gaming headset without a brand), users tend to focus on the title and price. Subsequently, I'll place emphasis on the images, title, and price. The others are merely supplementary information.

The Marketplace Design
Before usability testing, all the supplier, vendor, and consultant are in the same page. I used to create them on a separate page to show the user all of the options available in Klikfranchise. However, after conducting usability testing, I discovered that users are overwhelmed by the abundance of options and often fail to consider their own needs.

After the usability testing results, I changed the design to focus and highlight the products, and if the user wants to find other products, there is a category on the side of the page. Furthermore, it draws users' attention to the products.

Another Finding on Google Analytics
I researched Google Analytics again to design the Kalkulator franchise because the previous designs were not mobile friendly enough. As a result, I've discovered that the majority of users are using the mobile app. We are experiencing several issues, including the fact that the information in the question is not displayed because it is not responsive.

Revamped the calculator
The key to a smooth user experience in the Kalkulator franchise is that users can understand the question easily, which reduces bounce rate. And to produce that, I make sure the information is shown every time they click the input number field, so the user does not have to go back and forth if the information is in a pop-up model. I also display the default number and results so that users can see what number corresponds to the question.

For a more detailed case study of Klikfranchise
Because it is a work project, I only show a few designs and explanations in public. Feel free to contact me for more information of the case studies on Klikfranchise.

Research and Design

Tags

#user experience

#visual design

#usability test

#interview

#interaction design

#web development

#analytics

HC

I’m online

Adinda Cahaya

Contact me

Noice: Exploring Ways to improve…