Product Listings Page, PLP Design
DESIGNING EFFICIENCY
​
In this case study, I will share my journey through designing Product Listings Page (PLP) for PodConverge webpage. I will discuss the challenges I faced and how I created a solid PLP based on hierarchical structure and filtering system to allowing users to easily navigate through our product list.
​
Role:
UX Designer & Researcher
Client:
PodConverge
Category:
Product Listings Page (e-commerce)
Year:
2024
Overview
About PodConverge
​
PodConverge is a startup company that bridges the gap between leading print providers in North America and individual businesses.
​
Role
A solo UX Designer responsible for conceptualizing and creating the product list page, product cards and product page.
​
Target users
-
Small businesses
-
E-commerce entrepreneurs
-
Independent artists and designers
Challenge
The appropriate layout is the core of a good product list design. Users must be able to quickly understand each category, and how it differs from the others in order to decide where to click.
Approach
In order to have an easy to use a product listing page I used the highlighted subcategories separately from other filters approach which helps to increase the discoverability of the subcategories and encourage users to navigate to a more specific group of products to reduce the number of items listed and avoid choice overload.
Result​

Discovery phase
Collecting Data and Transforming Insights into Action
My design journey began with an extensive discovery phase. During the process of Illuminating the most crucial aspects of paving product listing pages (PLP), I couldn’t avoid speaking and brainstorming about a list items experience. I started by analyzing a product list of our providers. That's helped me to trust the card sorting phase. This analysis helped me to not reinvent a wheel
Imagine you have a nine-bedroom house filled with furniture and belongings, and you need to downsize to a one-bedroom apartment. To make this transition smooth, you must carefully organize everything, get rid of duplicates, and ensure every item has its place. This is akin to what I did for PodConverge's website.
​
Faced with integrating a multitude of products and categories from various print providers, I meticulously sorted and arranged them to create a cohesive and easy-to-navigate information architecture. By placing each product and category side by side, I eliminated duplicates and ensured comprehensive coverage, resulting in a streamlined, user-friendly platform. This process made the complex structure of the site more accessible, just like fitting all your belongings into a smaller, well-organized space.
​​
Extracting data from existing providers

Problem
Many products were not listed under clear categories and could only be found using the search function. This required a careful manual review to sort and organize each product correctly.​



Gather input to Design
After extracting the product categories and subcategories, we moved on to creating and organizing our information architecture. A key consideration in this process was to design the categories to be broad enough for future expansion while remaining easy for users to navigate.


PodConverge's visual design is built based on the Ant Design System. For this project, I stick to our design system guidelines to ensure consistency and coherence in the UI.
Navigation bar

Sub-category card
Product overview card

.png)
.png)



Additional filtering options for products with variations to enhance user navigation and findability.

Catalog pages


Product summery page


Conclusion
As the sole UX Designer on this project, the journey from initial discovery to successful product handover has demonstrated the power of user-centered design, strategic planning, and the value of a flexible and skilled approach to design.