Product Designer

Glassons

Glassons is one of New Zealand & Australia’s largest womens fashion chains.

I was approached by the Creative Director to work with Glassons on their digital strategy, of which the cornerstone would be a new ‘content led’ responsive e-commerce website.

Glassons wanted to position themselves as an innovator in the online shopping space, which meant a full overhaul of their hugely popular website, with a new visual direction and an integrated ‘shoppable’ weekly magazine. The aim was to “create a magazine for the 21st century – a hybrid between a store and a magazine that is delivered digitally.”

I worked with an internal project team and the talented development team at Black Pepper to deliver this project.

 

Company Type

Publicly Traded (HLG)

Role

Product designer, including needs analysis, requirements & scoping, wireframes, prototyping, UI Design, UX Design, Interaction Design

Year

2013

Establishing the scope

Before any initial visual design discovery could be done, it was necessary to first establish the vision for the project, describe the project itself in a document, note down the core requirements (deliverables), and outline project particulars such as page templates.

To accompany the scope I created a high level ‘template map’, which would form the basis of the information architecture of the new website. This helped to visualise the sections and templates which would need to be designed from scratch, or re-designed. This process fed directly into the development of a timeline for delivery and served as a basis for discussions with the technical team. 

Glassons.com template map

Defining a visual language

Once the scope of the project had been established, we now had to determine a design direction for the site. 

At the time Glassons was in a transitional phase, and trying to establish itself as a more cutting edge and innovative player in the fashion space in Australasia.  Because of this, we needed to create a visual language for the site which would embrace this new phase of the business. 

The design style needed to reflect this new phase but also be flexible enough to ‘get out of the way’ and allow for other “louder” styles to permeate through in content tiles, lookbooks and editorial etc.

The most efficient way to explore as many directions as possible was with the use of style tiles. 

Style tiles

The ability for style tiles to work well and achieve the required goal is always dependant on the buy-in of the client. During this initial process it became clear that the internal decision makers were more comfortable with the traditional ‘full page comp’ design process. Because of this, I decided to create several different versions of a product page, to push the process forward. Although much more time consuming, we were able to reach a consensus using this technique.

In 2014, my preferred method of using Element Collages may have avoided having to go back to full page comps as a technique for reach design style
sign-off.

Product page comps in various styles

Once a visual language had broadly been decided upon I started to explore a range of different layout ideas for the homepage of the website. 

Versions ranged from wildly different concepts in format and function, to versions in a theme which were iterated upon to bring about the final concept which would be built by the team at Black Pepper. 

Website homepage layout variations

Re-aligning not re-designing

 

E-commerce sites are at their heart comprised of a few key templates. Amongst the most important pages are the ‘category’ page and ‘product page’.

The overall vision for this project was to ‘innovate’ (for lack of a better word), but this contradicted with the internal stakeholders determination to leave the category and product pages basically untouched, aside from an overall re-skin.

The pages were considered to be highly successful in their current layout, which meant that the resulting re-designed pages appear modern in style, but stick to a somewhat old-fashioned page layout. In my opinion, this was a lost opportunity.

The final product page design

A digital magazine afterthought

At the forefront of the Glassons digital strategy was the idea of an intermingling of content & commerce. This has proven a successful strategy for companies such as Mr Porter.

Although this editorial element was positioned as a key part of the strategy, in reality, the task of ideating, designing and delivering a full responsive e-commerce site re-design proved so complicated and time consuming that the editorial section was left until the final stages of the project build.  Little time was given to content strategy and design and as a result of this, the editorial strategy failed to provide the results which were promised. 

The magazine homepage