Product page features list

  • Save
Media features

1 Attachment

For product pages on PlanetAxel.com I wanted to create a simple list with the features for a product.

Before redesigning the site I had developed and designed the iOS app where I used a UITableView to display this information. Luckily, I was able to use a definition list for the site, which perfectly translates the same list-style design from an iOS table view to the web.

The customer can quickly glance through the special features, such as whether a title has 7.1 surround, is 3D-compatible or which languages are available in the movie or game.

If a feature isn't available (or for example, the languages aren't yet known), this element simply doesn't get rendered. The order in which the features appear is always the same.

I have a attached a screenshot of the the full product page view and you can see it for yourself here: https://www.planetaxel.com/product/John-Carter-(Blu-ray-3D-+-Blu-ray-+-DVD-+-Digital-Copy)/786936819076

Other products such as a PS3 game have a number of other features that need to be listed, including specific game features. Here's an example of a game product page: https://www.planetaxel.com/product/Killzone-3/711719823421

keyboard shortcuts: L or F like