Creation of high fidelity detail page mock-ups
Presentation of design to stakeholders, including senior designers, product managers, site merchandisers, and executives
Creation of production graphics for localization
Asset management and coordination with site merchandisers
Usability testing observation and analysis of page features
Maintenance of detail page graphics
Overview: Amazon.com offers a range of consumer electronics including e-readers, tablets, streaming media devices, and a smartphone under its own brand.
Problem: Design detail pages to sell the following Amazon devices: Generation 7 Kindle with touchscreen display, Kindle Voyage, and Fire TV Stick. Pages must follow established visual and interactive patterns, inform customers of the features and benefits of the products, satisfy marketing objectives, and adhere to brand guidelines. Separate desktop and mobile designs are necessary.
Solution: Detail pages with a focus on transactional efficiency, clarity of information, and strong visual presentation. Comparative product information is provided so customers can make confident purchasing decisions. Imagery is carefully considered and aligned with company-wide marketing strategy. Interactions are chosen to meet customers expectations of behavior and create a fluid, straightforward experience.
Results: The selling results of these detail pages have been strong. Both the Kindle Voyage and Fire TV Stick sold out shortly after launch. Dave Limp, SVP of Amazon Devices, stated in a press release that “Fire TV Stick has been our most successful device launch ever.” The Fire TV Stick is currently the best selling product in the electronics category on Amazon.com.
To prepare to design these detail pages, I learned as much about the products as I could. While the Generation 7 Kindle, Kindle Voyage, and Fire TV stick were all new products, Amazon had previously released similar products in the eReader and streaming media player categories. I throughly read the content of all the detail pages in these categories as well as many Amazon customer reviews. I also researched competitive products in the eReader and streaming TV spaces, looking at how those products are displayed on detail pages and how tech blogs evaluated their features and benefits. In doing this research, I learned what the differentiating features of Amazon’s products are and what product aspects affect users decisions to purchase. For example, the most negative user feedback for the Chromecast, Fire TV Stick’s biggest competitor, is that it does not come with a dedicated remote. This played into the my decision to feature the included remote as much as possible on the Fire TV Stick detail page.
Additionally, before beginning work on the Generation 7 detail pages, I audited current Amazon device detail pages to learn as much as I could about established visual and interaction patterns (Amazon had not published its HIG at this time). I worked with the lead UX designer on my team to find out which interactions and visual patterns were compulsory, and which could be changed or updated.
In order to get buy-in from key stakeholders of the detail pages including product and marketing managers and senior leadership, I created high fidelity mockups in Photoshop. These mockups often required very little lead time and necessitated multiple iterations.
One example of iteration was in the main product image of Kindle Voyage. In order to communicate the unique experience of reading with this premium device, it was suggested that I try using lifestyle imagery for the main detail page image. This would be the first time Amazon had ever used lifestyle photography in this position. I created at least 30 options for this image.
These detail pages were built on Amazon’s Gurupa platform with features specifically developed for Amazon’s online device sales. After they were completed, my team partnered with a usability testing firm to evaluate which elements of the detail page customers found most effective. Those results were then used to influence which page elements would be incorporated into Amazon’s Universal Detail Page (UDP) platform to sell Amazon’s devices.
My team and I observed customers explore and accomplish tasks on prototypes of both platforms’ versions of the pages and took detailed notes on customers’ eye-tracking, interactions with page elements, and verbal reactions. Our team then went through an affinity diagramming process to organize the data. We used post-it notes to document each piece of feedback and create topic clusters of related feedback. This process helped organize data as well as to see how frequently each data point arose. This exercise was incredibly valuable in determining which page elements and features we should push for our developers to create.