Design principles: shaping a Product Detail Page that puts the customer first
In the latest installment of our Design Principles series, Senior Product Designer Sophie Nothnick and Principal Content Designer Jemima Leathwood-Hill share how they crafted design principles to optimize the customer experience on Zalando’s Product Detail Page.
“Design is so simple. That’s why it’s so complicated.” The famous Paul Rand quote perfectly illustrates the Product Detail Page (PDP). It may look simple to customers, combining an image gallery, product details, size and color information, and shipping details. However, beneath the crisp interface is a complex ‘circuit board’ of processes and decisions, connecting multiple teams and functions. With a significant impact on the customer experience and conversions, the PDP is one of the most important parts of the Zalando store.
“Our responsibility is to make sure the customer has all the details they need about the product to make a good purchase decision,” says Sophie Nothnick, Senior Product Designer at Product & Category Experience, the product design team behind our PDP. “One of our main goals is to decrease the return rate as well.”
To strengthen alignment and optimize the customer experience, Sophie collaborated with Principal Content Designer Jemima Leathwood-Hill to craft a set of design principles. “The PDP has many contributors and stakeholders, making efficient collaboration crucial,” Jemima explains. “We wanted to create consensus among stakeholders to ensure everyone was aware of the PDP’s role in the customer journey and how their solutions needed to slide seamlessly into the existing experience.”
The PDP principles were finalized in November 2022 and have since been adopted successfully by the team and stakeholders. Read on to find out how Sophie and Jemima created and implemented them, and what they learned along the way.
Getting everyone on the same page
Sophie and Jemima started by getting all stakeholders on the same page. “We facilitated a big workshop that brought together Product Designers, Software Engineers, Product Managers, and leadership to align on a common vision for the PDP,” says Sophie. “It was a great starting point as it revealed we all had the same goal. We had a somewhat similar understanding of what the PDP should be like, which made it clear that there were rules that we could apply and agree on.”
It was not only necessary to establish alignment between functions but also with the contributing teams. “The PDP is a special case because many other teams work on solutions that get added to it,” Sophie continues. “We had spent considerable time as gatekeepers, telling various teams what they could and couldn’t add to the space. Moving forward, we wanted those teams to use our principles as a guide. By the time they came to us, they would already be on the right track with coherent solutions.”
The principles would also ensure the PDP team had a unified voice in these discussions. “Previously, our team relied on usability best practices and individual knowledge of the different project areas,” Jemima explains. “The principles would give us a benchmark to hold solutions against and act as a ‘north star’ to guide us in the same direction.”
Iteration and evaluation
After the initial vision workshop, from which they defined the main themes, Sophie and Jemima held four further collaborative workshops with the PDP team to iterate on the principles together. The pair evaluated the success of each iteration through anonymous surveys. They ensured they had everything covered by gauging satisfaction with the individual principles and their value as a set. “Gathering data points along the way and tracking our progress helped us prioritize which principles to rework first,” Jemima explains. “We found some low performers, which required us to look deeply into their origins and figure out why they didn’t resonate. Others simply needed small terminology tweaks to hit the 100% satisfaction score.”
A crucial part of the iterative process was aligning on language. “There are so many nationalities at Zalando, so words are important,” Sophie explains. “As native English speakers, sometimes Jemima and I would use language that others did not understand, so we had to be super straightforward with what we were saying. Different people also have different associations with certain words, so we always made sure to ask how everyone understood them.” Jemima affirms that “getting everybody to understand and ultimately believe in the principles is key to their success, as they won’t be used if they’re not seen as helpful.”
They originally came up with eight principles, but aiming for utmost clarity and conciseness, they merged some of them and narrowed it down to just four.
PDP experience principles
As Jemima pointed out in her previous article on how to elevate design principles, it is helpful to refer to them as experience principles. This highlights that all members of the product team can use them. The experience the four following principles define is shaped around the needs of our customers: intuitive, personalized, inspiring, and transparent.
1. We enable decision making
We help customers make a purchase decision by giving them relevant information in ways that make sense to them. We present this in the right content format, at the right time, in the right place according to its importance.
“This principle asks contributors to consider whether their content needs to be on the PDP, where it should be, and how it should be presented,” Sophie explains. “One example would be the location of size and fit information. While we choose to display it in the accordion at Zalando, other brands might choose to add a sizing table to the gallery images. We should always ask what is the easiest and most intuitive solution for our customers.”
2. We tailor the experience
We offer personalized guidance to help customers feel understood. Advice and recommendations based on implicit and explicit signals help customers find the perfect match for them.
“An example of this tailored experience is the carousels at the bottom of our PDP,” says Sophie. “The algorithm recommends items to the customer based on the product they are looking at. A common problem on many platforms is that the recommended items are irrelevant. We try to figure out what the customer wants to see when looking at a particular product while also factoring in what they have viewed before. What can we provide that is tailored to them and also makes them feel a bit special?”
3. We encourage playful exploration
We provide inspiring ways for customers to explore the product or new ideas, without feeling lost. It’s always clear where customers can go and how they can come back.
“This principle was born out of the first big workshop we did with our stakeholders,” Sophie explains. “There was a consensus from all functions that we wanted our customers to explore more. We want to inspire our customers with the content we provide on the PDP while ensuring we don’t lead them away from what they came to do — or at least that they can make their way back easily.”
4. We inspire trust
We display the product honestly and accurately, knowing that transparent communication leads to credibility. Communication is clear, intentional, and feels authentic.
“This one may feel like a no-brainer,” says Sophie, “but we are very sensitive to how customers might respond to certain details. In Beauty, bringing in additional product information and recommendations can strengthen Zalando’s trustworthiness. Another example is product reviews. We don’t just show the best reviews or order them from best to worst; we display them in the order they are posted and let the customer decide.”
For further context and clarification, each principle is accompanied by a list of guiding questions that contributors can ask themselves before bringing their solutions to the PDP team. There are also visual examples of do’s and don’ts under each principle that demonstrate how to correctly integrate content into the PDP. As Jemima suggests, “Adding context helps people to visualize and refer back to their related experience. They can then apply the principle more effectively.”
Putting the principles into practice
As Senior Product Designer Xen Szymczak emphasized in her advice on building design principles, for them to be fully adopted and put into action, it is paramount for stakeholders to have a sense of ownership and investment. Jemima and Sophie achieved this by involving stakeholders in the creative process (the collaborative workshops) and then by evangelizing the principles in open-house sessions. They also published them in certain “hotspots”: “Figma is the starting point for most designers looking to work with the PDP team and/or to design solutions that will eventually live on that premise,” says Jemima. “We decided to include the principles on the intro page to onboard people to them from the start of their collaboration with us.”
Key learnings
Over six months since they were implemented, the PDP principles have met their goals successfully, acting as the desired “north star” for smooth alignment on the customer experience vision. “People are already starting to bring the principles into conversations,” says Sophie. “For example, a Product Designer from my team came back to us and said the principles resonated when he shared them with another team. We want to continue to mention them as much as possible so they stay at the top of everyone’s minds.” In addition to internal surveys, the pair also plan to survey the contributing teams for their feedback.
From this intensive collaborative process, Jemima and Sophie came away with three learnings that are essential considerations for anyone looking to craft experience principles.
Make space for everyone to be heard
In addition to holding thorough collaborative workshops and checking in on the comprehension of the principles, the surveys were a great way to gauge satisfaction in the team. “Include your team and ensure everyone feels heard,” Sophie advises. “Ultimately, everyone needs to stand by the principles. It would be a waste of time building them alone, presenting them, and expecting people to adopt them.”
Take your time
“It was important for us to invest ample time in this process,” Sophie recalls. “Each workshop was about two to three hours long, in addition to at least another ten hours of Jemima and I working together. There is no forcing it; it takes time and discussions to get it right. Expecting the principles to come together in a couple of days is not realistic unless you’re doing an intense design sprint. Patience underpins all aspects of our work as Product Designers.”
Avoid prescriptive principles
Jemima says they fell into the trap of being prescriptive with the principles multiple times. “Since we were well versed on some of the initiatives we wanted to bring to the PDP in the future, it was all too easy to get swayed into describing a potential solution rather than the experience we wanted to deliver. Principles are evaluative by design. They shouldn’t tell you what to do, but rather how. By falling into the trap of describing an ideal state, we were restricting the value of the principle as a tool for future creative thinking. To try and combat this, we asked ourselves during each iteration: ‘Which PDP scenarios could this apply to today? What could it apply to in the future?’ We needed to strike the right balance to ensure the principles were immediately actionable but open enough to inspire new ideas further down the line.”
For more on how to create experience principles that elevate the customer experience vision, check out Jemima’s collaboration-focused tips. Enjoying our Design Principles series? Ensure you don’t miss our next articles by subscribing to our posts at the top of this page.
