Configurator4 – Estela Ordonez

✦ ABOUT THE PROJECT

Bridging the gap between digital and printed results

The goal of this project was to improve user confidence in the online product customization process. I achieved this by executing a holistic redesign of the user flow, specifically focusing on clarifying and enhancing the presentation of critical customization options.

The resulting solution successfully increased user trust and improved conversion, while also establishing a scalable foundation of a reusable component library for future product pages.

ROLE

Sr. Product Designer

timeframe

1.5 months

The assurance void

Uncovering the main pain points

A comprehensive UX audit to identify the roots of a low NPS (Net Promoter Score), pinpointed that many customers were having issues with the post-editor upsell page. This page was creating a confidence deficit because crucial customization options lacked clarity, actively eroding user trust and hindering conversion.

Lack of descriptive text

Lack of supporting imagery

Lack of pricing transparency

Unclear material names

Screenshot of the upsell page

Shifting focus

Transitioning from upselling to the forefront

As a first step, the Product Manager and I identified a key opportunity to boost customer satisfaction by strategically moving key customization options (materials, finishings, and accessories) from the pre-checkout upsell page to the product landing page. This shift would simplify the purchasing journey and ensure pricing clarity.

Old Flow

Product SKU

Customization

Approval

Upsell

Cart

New Flow

Product SKU

Customization

Approval

Cart

User insights

Conducting user interviews to refine imagery and messaging

To define the most effective content and layout for the new product page, I conducted ten customer interviews focused on a direct content comparison between our platform and competitors. By observing how users processed product imagery and descriptions, I gathered crucial qualitative insights that would support the decision-making needs of new and experienced customers.

Screenshots of user interviews on usertesting.com

Screenshot of user interview on usertesting.com

This is confusing, is basic going to make my poster look cheap?
I feel like I'm picking the wrong choice.

I liked that when I changed the coating to glossy,
the preview instantly showed the shine.

I know what I want. I don't need to read about the poster,
I just need to start selecting options.

Just tell me, 'For this use, we recommend this option' or
maybe show me what the most popular choice is.

The description for 'Tear-Resistant Vinyl' explicitly said
'Recommended for outdoor use.' That was helpful.

Exploring solutions

Leveraging user insights to shape the new experience

Non-linear customization

Replaced sequential steps with, non-linear control drawers, allowing users to directly jump to and modify any customization category, maximizing efficiency and perceived control.

Visual Decision Support

Integrated image-based previews for every selection, empowering customers to visually build their product and eliminating guesswork about the final appearance.

Client centric approach

Our team of experts combines deep technical knowledge with creative thinking to develop AI-driven strategies that drive efficiency, innovation, and growth.

Seeking feedback

Prototyping to communicate and test design ideas.

Throughout the iterative design process, I developed a prototype aimed at effectively communicating design decisions to diverse stakeholders, particularly developers. This prototype served as a pivotal tool for soliciting feedback on feasibility and effort required for implementation. Additionally, it served as a tool for usability testing.

Selecting any option instantly triggers dynamic updates to the image gallery and caption. This logic validated complex front-end requirements early.

Incompatible options are disabled and include a clear explanation to guide users away from invalid configurations.

Selecting a 'Delivery Only' option automatically removes 'Store Pickup' from fulfillment availability, aligning the interface with logistics rules.

Try Figma prototype

Want to see it in action?

Gathering feedback from users

Our approach involved shifting customization choices such as materials, finishings, and accessories from the upsell page right before checkout to the product landing page. This change would make the decision-making process smoother for our customers and ensure that pricing information is clear and upfront.