Goals:
- Wireframe the PDP, where most of the online purchases are finalized
- Optimize the display of different “Content types” (e.g. product descriptions, specs, images and videos, up-sell & cross-sell sections)
- Use wireframes to understand the context of the “Ratings and Reviews,” i.e. how the “Ratings and Reviews” section is related to other “content types” on the PDPs
- Focus Mobile experience
- Use wireframes to facilitate a VIP client workshop. Help clients understand value of the company’s ratings and reviews products and collect client feedback and expectations
Process:
- Research work prior to wireframing:
- Literature review to summarize existing findings (Baymard Institute Report & Nielsen Norman Group Report)
- Analyze current PDPs of major e-commerce sites; understand design trend by industry
- Determine major components of a PDP
- Design PDP wireframes using Balsamiq
Deliverables
Mobile:
Desktop:
Client Workshop:
I printed the wireframes on paper and cut out each “content type” (e.g. product image, review summary, Q&A). In the client workshop, we asked client representatives to discuss and wireframe the “perfect PDP” that best addresses their needs. Here is the activity guide:
- Break out into groups
- Pick your presenter for readout
- Review shopping scenarios
- Use the “content types” provided to build your ideal PDP
- Discussions
The wireframing workshop was a huge success. In the first place, we received positive feedback from major participants for being able to demonstrate thought leadership in the ratings and reviews business.
