Removing Layers of Complexity in the User Journey

(Ghost written)

I’ve worked in web design for many years and I’ve been with Tryzens for almost a decade. During this time web design, has changed radically to keep up with the ever-changing ways in which we use the web.

Design is important from the get-go

At Tryzens, we are particularly proud of our design and discovery process during which we help our clients come to the best design solution for their business using a range of techniques.

We start by understanding the values of the brand and the buying habits of the target audience. We focus on producing the right design to deliver the intended user experience (UX). We want the user experience to be simple, efficient and enjoyable and the user interface (UI) design is crucial to this — the layout, colours, ease of navigation and how users interact with the site all affect overall usability and the communication of the brand values.

The discovery phase of the design results in a detailed brief along with mood boards and competitor and customer analysis to guide the design phase. We then design a detailed set of prototypes which are used to guide the technical implementation of the new site.

Consumers live in a multi-screen world

Today’s consumers live in a multi-screen world, using a range of devices to search, browse and shop online. People favour smartphones when they are on the move, and tablets or PCs when they are not. Consumers may begin a search for a product when they are travelling to work and then complete the purchase in the comfort of their own home, where they can look at product images, compare items on larger screens and have access to a full keyboard for filling out forms.

Building up a picture of the consumer’s cross-device journey is a vital part of the design and discovery process. The design for an effective ecommerce website needs to document these multi-screen journeys and show how they will work on multiple devices.

Responsive web design vs native apps

There are several technical ways in which these customer expectations can be met. One of the key business decisions is whether to build a native mobile app or a responsive website which is optimised for mobile.

Responsive websites fit any size screen and are more cost effective to maintain. A responsive website means there is just one site for the business to update and maintain, which also creates a more seamless user experience across devices.

On the other hand, native apps for smartphones have some advantages over responsive websites. You can use them offline and you can more easily take advantage of device features like cameras, GPS location, accelerometers and fingerprint recognition.

Design for mobile first

Choosing between developing native apps or a responsive website really depends on the goals of your business and this is part of the contribution of my team during the initial project discovery process. Whatever the decision, the design must work perfectly on mobile since more than 50% of ecommerce transactions typically begin on a smart phone .

The ideal approach to designing for small screens on smart phones is often not the way which has been used historically for PC oriented websites. For example, there is a trend towards ‘flattening’ the screen design with fewer pop-ups and overlays due to the constraints of smart phones. Pop ups also interrupt the user journey and can be annoying for users to close. The trend is towards revealing information within the layout of the page which the user can choose to collapse or simply scroll past without interrupting the flow of the page.

This example on the Avenue 32 product page shows the size guide within the page rather than in a common pop-up — when the user taps ‘Size Guide’ the page scrolls down to the size guide section. Another advantage of this approach is that the information is readily available for the user to discover when they scroll, rather than hidden away where they might not see it.

Avenue 32 Size Guide

Trends

The life of an eCommerce design should be several years and so it’s important to think about what may be required to refresh the site during its life to keep it current. Here are three trends which need to be considered:

Magazine content

Firstly, for luxury and ‘lifestyle’ brands it is increasingly important to communicate the brand’s values through more traditional media that often looks like an online magazine. This provides the opportunity to talk about products when the product or brand’s benefits are not easily measured.

For example, the differentiation between different holidays, luxury clothing and cars largely depends on the consumer’s perception of what purchasing from each brand says about themselves. These differences are best communicated in long form content which does not fit comfortably within the traditional product catalogue format, often identical for each product within a category of products.

Avenue 32 Magazine Page

Product list pages with a difference

In keeping with the increasing importance of ‘magazine style’ content, there is a need to make the product display pages less rigid. Instead of using a grid layout with the same space allocated to each product, it is possible to allocate certain products to take up more than 1 space in the grid (1×1, 2×1 and 2×2) to break up the rigid grid structure.

This flexibility could be used to allocate more space to products with greater margin contribution or to create a more informal, magazine look to the product display pages. (Insert) Lifestyle images are also being mixed with products to create a dynamic looking list page. We expect to see greater integration between lifestyle content and transactional content.

J.Crew List Page Grid

Video Brings Brands to Life

Finally, we hope to see much more use of video to provide a ‘true picture of a product’. Video offers the best way to convey a product’s quality and the retailer’s brand values and works well on any web device. For example, with a static image you don’t get a sense of the material in an item of clothing — but in video the fabric’s texture, weight and elasticity is more apparent.

Removing complexity

New innovations will continue to bring exciting possibilities for online retailers and keeping on top of the latest trends and devices will remain a constant challenge. Top quality design goes a long way to eliminate complexity from the purchasing process as well as communicating your brand values.

For more information or if you have any questions please get in touch.

Originally published at tryzens.com on April 28, 2017.