Hi. I’m Jax.
Senior Product Designer · Enterprise UX · Headless CMS · Brand & Creative Strategy · Bilingual EN/ES
Senior Product Designer · Enterprise UX · Headless CMS · Brand & Creative Strategy · Bilingual EN/ES
Overview
Ricoh's Product Listing Page (PLP) was a legacy page that hadn't been redesigned in years. Filtering existed but disappeared when users scrolled, making it functionally useless across long product catalogs. Product cards had three bullets each but the content wasn't consistent and nothing was scannable. Users had to read to understand product differences rather than seeing them at a glance. Analytics confirmed engagement had plateaued. This project became not just a page redesign but a platform-level systems effort, with components designed for reuse across the site and a phased approach that kept the team lean and the development lift manageable.
My Role
Product Designer, leading discovery, wireframing, stakeholder alignment, design direction, and cross-functional coordination across product management, engineering, analytics, brand, merchandising, and the UX and visual design team.
The Problem
The Product Listing Page (PLP) had three core issues.
The facet filter was static, anchored at the top of the page and gone the moment users scrolled down. For a long product catalog that made it basically useless. Product cards had three bullets each but the wording varied from product to product, so comparing options meant reading every card carefully instead of scanning. There were no icons, no visual hierarchy, no quick-read specs. A user trying to figure out if something was a black and white or color printer had to dig for it.
Analytics confirmed what the experience suggested. Engagement was flat. Not declining, just completely stagnant with no movement in either direction.
Discovery
We started with data. Analytics established our baseline, where users were landing, how long they were staying, and where they were dropping off on the Product Listing Page (PLP).
From there we ran a competitive analysis, comparing Ricoh's PLP against competitor pages to understand what users expected from a modern product listing experience.
We then conducted unmoderated user testing alongside the UX Lead. Users navigated both Ricoh's PLP and a competitor's PLP and told us what they noticed, what they preferred, what felt different, and what information mattered most when they were evaluating products. We synthesized those findings and presented them to our product owner, the merchandising team, the content team, and brand, bringing all the key cross-functional stakeholders into the process before any design decisions were made.
Design and Exploration
Knowing our team responds better to seeing something than hearing about it, I came to the first stakeholder presentation with a wireframe already built. Not a finished design, just enough to show the direction: facet filters moved to a sticky left-hand panel, product cards cleaned up and made consistent, content hierarchy rebuilt so users could scan instead of read.
The approach was deliberately lean. We worked with what we already had, existing Salsify data, existing imagery, existing back-end infrastructure. Rather than asking for new assets or heavy development resources, we looked for the highest-impact changes with the lowest implementation cost.
One decision that had a bigger impact than it sounds: I consolidated the image types used across the platform. Previously, tile images, hero images, and gallery images were three separate assets editors had to manage. I redesigned the system so all three became one unified asset. It took real work off the content team's plate and made the product pages more consistent across the board.
The facet filter was designed to use existing back-end logic, keeping it primarily a front-end change with targeted back-end enhancements rather than a full rebuild.
Throughout the whole process I worked closely with our Product Manager who owns the development roadmap, making sure every design decision fit within the team's sprint schedule and didn't create unnecessary burden for the developers.
Stakeholder Alignment
Working in a lean agile environment means every change touches someone's workflow. Bringing brand in early meant the visual direction was confirmed before we went into high fidelity. Working closely with merchandising meant the product card data fields coming from Salsify were mapped correctly to the design in Figma, making sure content, design, and development were all working from the same source of truth before anything went into the Jira board.
Every decision was framed around shared KPIs. The goal was never to redesign anyone's territory. It was to move numbers everyone already agreed needed to move.
Execution
Once alignment was in place we moved into high fidelity with the Visual Designer, who owns design system consistency and developer-ready output. Every icon was checked against the existing design system and confirmed to be globally recognizable, not just Ricoh-specific.
We designed the full future state first, including chips and on-page search, then pulled back to phase one scope for development. Showing stakeholders where we were eventually going before scoping to what we could ship first gave everyone confidence in the direction while keeping the immediate build realistic.
From there it was about getting it shipped. Jira tickets were raised and I stayed involved through each environment as the build progressed, reviewing the work in development, staging, and QA before it reached production. Catching issues early in the environment cycle meant fewer surprises at launch and a cleaner ship overall. When it finally went to production it was tight.
Systems Thinking — Components Built for Scale
A core principle throughout both the Product Listing Page and Product Detail Page (PDP) work was designing components for the platform, not just the page in front of us.
Facet Filter — designed for the Product Listing Page but built with reuse in mind for the Resources page and other catalog-style pages across the site.
Table of Contents (TOC) Navigation — born out of the Product Detail Page redesign and first deployed on the Resources page as a live test to see how users interact with it before full Product Detail Page implementation.
Homepage Hero Banner — analytics showed that slots 2 and 3 on the homepage carousel were getting minimal engagement. We redesigned the experience from a rotating carousel into a single full-width edge-to-edge hero banner with sub-feature items surfaced within it, bringing secondary content into view without requiring the user to do anything. Recently shipped, analytics in progress.
Product Detail Page (PDP) — In Progress
The Product Detail Page redesign is currently in the wireframe phase. Rather than building the page in isolation, individual components are being designed and validated independently for use across other site surfaces first. When the Product Detail Page is ready to ship, the components will already be tested, refined, and development-ready, significantly speeding up execution and reducing the QA burden.
It's a way of thinking about the platform as a whole instead of just the page in front of us.
Results
+27% increase in product engagement (51.5% vs 40.7%)
+5% lift in request-a-quote conversion rate (1.09% vs 1.04%)
50%+ reduction in editor page-build time following content modeling work
Homepage hero banner recently shipped analytics in progress
Table of Contents component live on Resources page user interaction data being collected
