3) blume magazine online shop

blume magazine: Functional e-commerce design for user-focused online shopping

While designing and building the website and online store for blume magazine, I wanted to use a design ethos that put the content we publish and the products we sell at the forefront of the user experience. This led me to develop a minimal aesthetic for the website’s design, and apply simple, stripped back functionality when creating the online shop. The aim was to simplify this area of the website, as users go there with the single aim of browsing and purchasing products.

Mockups showing the blume homepage designs on desktop and mobile.
Mockups showing the blume homepage designs on desktop and mobile.

Developing a consistent user experience between the shop and the online magazine also presents an interesting design challenge. Between these two areas of the site, users normally have competing goals. In the online magazine, users will browse, hang around and ‘consume’ content, whereas in the online shop, users generally want to spend as little time as possible when completing purchases.

Mockups showing the blume shop designs on desktop and mobile.
Mockups showing the blume shop designs on desktop and mobile.

In order to provide a joined up experience across the website and prioritise core user needs, I ensured our online shop mirrors the rest of the website in its minimal approach and content-focused design. This aesthetic suits the shop well, and extends to the user-focused copy. The writing style here is intended to present the user with only the most necessary information at each point in the shopping user journey.

An image showing a product page on blume magazine.
The product page prioritises clear navigation and user-focused descriptions, with the ability to add-to-basket or check out directly from the page.
An image showing a product page on the blume website.
Descriptions provide the most essential information in the most readable way possible. Users can easily make selections based on requirements.
An image showing a product page on the blume website.
Concise paragraphs follow F-shape reading pattern, and utilise white space to break down information in an easily-digestible format.

The result is a consistent user experience across all channels, especially when users are driven towards the shop from email or social media campaigns. The overall goal is to present the user with the most important information at each touchpoint in their journey, at the right time and in the most appropriate format.

Mockups showing a multi-channel digital campaign driving users towards specific pages from Facebook (left, desktop) and email newsletter (right, mobile).
Mockups showing a multi-channel digital campaign driving users towards specific pages from Facebook (left, desktop) and email newsletter (right, mobile).

Prev

UK NSC accessibility

Next

UK NSC consultations