top of page

Kijiji.ca search result page redesign

A streamlined searching experience

Kijiji.ca is a well-known second-hand trading platform in Canada. I have known its existence for many years and attempted to find some product on the site. However, I never saw anything postings that interested me. So I decided to find the causes behind this result.

head-img.jpg

DURATION

5 Weeks

TOOL

Figma

MY ROLE

User Research

UI & UX Design

Prototyping

SCOPE

Individual Project

INTRODUCTION


The last time I used Kijiji was when I was selling my sofa online, so I reopened the website to find out others' postings price and content for their sofa. Thus I discovered that for different types of products, Kijiji in fact addressed their postings into detailed categories and designed unique filters for each product category, which I completely ignored for past years.


As a UX designer, I decided to challenge myself to provide a more user-friendly searching experience for Kijiji.ca.

Design process[change].png

PROJECT CONTEXT

Kijiji's inconsistent search result page makes it challenging for users to catch useful information from postings. In addition to this, the random ads, disorientated search filter, and unclear visual hierarchy frustrate users. My solution redesigned Kijiji's desktop, tablet and mobile website to make it easier for users to navigate themselves while browsing for specific products.

OVERVIEW OF THE REDESIGNED EXPERIENCE

desktop.png

View of Desktop

tablet.png

View of Tablet

mobile.png

View of Mobile

RESEARCH

User Interview

User interviews are exceptionally useful for me to start with this project to better understand users with distinctive shopping habits and uncover the part my personal experience would not reach.

The user interview aims to gain feedback on users' current searching experience on Kijiji's desktop and mobile website and their pain points during the searching process.

Preliminary Questions

I interviewed four users who had the experience to use Kijiji. Some are very experienced second-hand traders online, and the others only heard or used Kijiji a few times.

Preliminary Question.png

Current search result page perceptions

Insights & conclusion from interviews

Answer result page perception.png

App Audit

By analyzing the five second-hand trading platforms mentioned from user interviews, I saw the strengths and weaknesses in other competitor platform designs. The App Audit method aided my concept development and enhanced my design decisions from the ideation stage and beyond.

App Audit.jpg

PROBLEM STATEMENT

“How to improve Kijiji.ca user's searching experience by allowing users to receive more helpful information while viewing the search results page, which could help users to locate their target items in a shorter time?”

FINDING PROBLEMS

01

Too many words on the result page

On the desktop view, each post shows the name of products, prices, photo, location, date and description from the seller. Yet, the users mainly focused their attention on the product's image. Image is the key that makes them decide to click on the post or not.

pain point#1.png

02

Random ads causing clutter

On the desktop view, each post shows the name of products, prices, photo, location, date and description from the seller. Yet, the users mainly focused their attention on the product's image. Image is the key that makes them decide to click on the post or not.

painpoin#2.1.png

Three types of ads layout

painpoint#2.2.png

03

Disorientated search filter on the left

The filter is long, especially after open unfold some options, the filter becomes even longer. With some options that users do not understand, after the user makes their selection, the filter is fixed on the top left of the page, users need to scroll back to change their choice on the filter, and they have to clear the selection one by one.

The Challenges

  1. How to make simple and minimal designs and provide more helpful information to the users?.

  2. Keeping Kijiji’s original visual style while revamping visual hierarchy .

  3. How to allow users to receive ads more comfortably?

  4. Convert desktop view to mobile view with minor changes.

  5. How to integrate Kijiji's complex and diverse posting categories classification system to new design.

User Flow.jpg

IDEATION

User Flow

This user flow chart is simple but allowed me to pull my ideas together to focus on the process of searching, filtering, and browsing product postings. Further, this user flow helped me divide Kijiji's filters selections into three main parts.

IDEATION

Wire-framing

During ideation process, I divided the search result page into three main sections: filter, result posting and ads.


I drew each module on small pieces of paper and placed them around to form different groups. It helped me decide the appropriate module structure in the result page for desktop, mobile and tablet versions. Later I invited some people to play around with these modules to see which design they feel most comfortable interacting with.

ideation1.png

Desktop version

ideation2.png

Mobile version

Explorations for dynamic filter layout

From testing paper mockups with others, I decided to place a fixed filter on the left side of the screen. As a result, the users can control their search results anytime when scrolling through the results, enabling users to locate their target product in a shorter time and eliminate repetitive actions.

filter.png
filter.png

After testing the paper mockups with some friends to gain some feedbacks and insights. I start to rethink if there other possibilities for the filter placement.

mockip feedback.png

Two filter placement arrangements

I re-designed several search filters and chose two from them:

  1. The filter is located at the top of the results posting, showing categories, location, price, and other filter options are all included at the bottom. 

  2. The filter is pinned on the left side of the screen. When the mouse moves to the bottom, options will expand to open.

Filter-1.jpg

Filter on the top

Filter-2.jpg

Filter pinned on the left

Finally based on the feedback I received, I decided to select the second option - Filter pinned on the left, because Kijiji's filter options are based on product user search, which would constantly change. Reducing all the filter options into one button would cause confusion for the user to remember what decision they made. Keeping users' selections on the side would allow easier access to undo and change their choices.

Usability Testing

After testing the clickable prototype with some people, I found out that the expanded category design causes confusion for people to understand the hierarchy relationship between them.

Categories.png
arrow.png
categories-fixed.png

Before

After

Redesigned Kijiji's search result page aims to streamline users' searching flow to assist them in narrowing down the posting range. Here are the solutions I made:

Solution 1

Card layout posting

Card.jpg

Users browser postings through images to locate their target items. The card layout posting page is heavy image-focused. By eliminating the product description and increasing the product's image size. Users could view more postings at once on one page.

Card-new.jpg
card-old.jpg

New vs. Old posting structure

Solution 2

Ads gather on right column of the screen

All the ads and sponsored postings move to the right side of the screen, showing only the image and the price of the items. If users are interested in any of the ads, when the mouse hovers to the posting, more information will show. Users do not waste energy to distinguish ads from real posting anymore.

ads-scroll.gif

Ads column on the right

ads-block.gif

Solution 3

Revised search filter

Users have the control to manage their selection anytime while browsing through the fixed filter on the left side of the screen. Map windows allow users to better understand the posting results' range distance by viewing directly from the map. Category options have three hierarchies. Users would easily see which tier they are at in the search result.

Solution 3: Filter

Select general options

With the filter pinned on the left side of the screen, users can directly see the modification they make. Then, click the button to open the expansion options on the side; no more scrolling actions are needed.

desktop-Select option.gif
mobile-select option.gif

Solution 3: Filter

Select results location range

Result map with indications helps users better understand the geographic range.

desktop-location.gif
Mobile-location.gif

Reflection

Kijiji is a great platform containing many types of products and information posting. One of the biggest challenges is that Kijiji has distinct platform settings for different post types. My project only includes the most general part of the website and tried to improve a small user experience for searching. The design mostly depends on a hypothetical situation based on a minimal amount of users online shopping behaviour. If I had more time, I wish to do more interviews and test with more users in the research and the final design stage.


From this project, I learn that even a tiny fraction in user flow still requires a lot of work to locate and narrow down the problems. By redesigning the search filter, I think there is still much room to explore further.

bottom of page