Product Page Template in Sketch

Last year I wrote an article for Shopify on how to design a great product page, here's the template I created for that article.

Here’s the downloadable product page sketch file that accompanies that article.

My background in psychology, along with research, has shown me that when making a buying decision, users assess a product on both an emotional and a rational basis. Therefore the product page on your clients’ website needs to speak to both. The page should both excite and reassure the user — without both, the page won’t perform.

In this article I’ll talk about each of the nine page elements, assess their emotional and rational aspects, as well as highlight some do’s and don’ts. To help solidify the concepts, I’ll work through a practical example using an online shoe retailer.

From The UX Elements in a Product Page Design

The product page template

Here’s the template, you may have noticed that I have not mentioned all the elements that should be included in a product page design, as the inclusion of these elements vary per product type.

The product page template

Download the Sketch Product Page Template

Leave a Reply