LFC Online Store

Helping LFC Become The First Football Club In The World To Have A Fully Responsive E-Commerce Offering. 

LFC Online Store

Helping LFC Become The First Football Club In The World To Have A Fully Responsive E-Commerce Offering. 
lfc2

The Project

My role was to lead the design on, initially the pitch visuals that were presented to LFC, and then actual website when we won the tender.

I worked closely with LFC’s in-house team, to design a new online retail store that could stand toe-to-toe with the world's best ecommerce experiences. With 40% of users visiting via mobile or tablet the new website needed to be responsive to cater for these users.

 

The Project

My role was to lead the design on, initially the pitch visuals that were presented to LFC, and then actual website when we won the tender.

I worked closely with LFC’s in-house team, to design a new online retail store that could stand toe-to-toe with the world's best ecommerce experiences. With 40% of users visiting via mobile or tablet the new website needed to be responsive to cater for these users.

 

Project Aims

  • Improve the shop user experience
  • Create a modern, responsive design
  • Design an intuitive kit builder feature
  • Keep the site flexible to cater for the club's future needs.

Homepage

The homepage was designed in modules. The idea was that going forward pages could be designed quickly by re-using or customising these modules.

The main focus of the homepage was the kit promotion. For clubs, the main item of the shop is the kit so I designed the homepage to have kit promotion and the kit builder high up. Working closely with LFC, I designed this area to be flexible to cater for promotion of 3, 2 or just 1 kit depending on which had been revealed or was on sale.

The product carousel was a flexible module that could be skinned to promote a number of key themes such as Father's day, Christmas, or the training range. The promo grid underneath was also designed to be flexible so LFC could promote a range of different features, products or categories.

Template features
  • Flexible kit area with kit builder
  • Customisable product carousels
  • Flexible promotional area to surface more products/categories

Homepage

The homepage was designed in modules. The idea was that going forward pages could be designed quickly by re-using or customising these modules.

The main focus of the homepage was the kit promotion. For clubs, the main item of the shop is the kit so I designed the homepage to have kit promotion and the kit builder high up. Working closely with LFC, I designed this area to be flexible to cater for promotion of 3, 2 or just 1 kit depending on which had been revealed or was on sale.

The product carousel was a flexible module that could be skinned to promote a number of key themes such as Father's day, Christmas, or the training range. The promo grid underneath was also designed to be flexible so LFC could promote a range of different features, products or categories.

Template features
  • Flexible kit area with kit builder
  • Customisable product carousels
  • Flexible promotional area to surface more products/categories
c30d8a19088917.562d4d0a94460
b

Category Page

Using the idea of modules, as seen on the homepage, category pages could be quickly designed and flexibly customised to LFC's needs.

The hero area was designed to push key promotions for a specific category and the product carousel could highlight certain products LFC wanted to push to shoppers.

Just as on the homepage, the promo grid could be customised to promote any items or sub categories.

Template features
  • Hero area for key marketing messages
  • Product carousel to push key products
  • Flexible promotional area to surface more products/sub-categories

Category Page

Using the idea of modules, as seen on the homepage, category pages could be quickly designed and flexibly customised to LFC's needs.

The hero area was designed to push key promotions for a specific category and the product carousel could highlight certain products LFC wanted to push to shoppers.

Just as on the homepage, the promo grid could be customised to promote any items or sub categories.

Template features
  • Hero area for key marketing messages
  • Product carousel to push key products
  • Flexible promotional area to surface more products/sub-categories

Listing Page

Listing pages were designed to be clean so users could easily browse products without any clutter. The view could be switched between showing 4, 3 or 2 items per row depending on the users preference. 

Products could be filtered using simple options that allow the fans to find the exact products they were looking for. 

Also at the bottom, modules could be added to cross promote any items or campaigns.

Template features
  • Streamlined product listing styling
  • Simple intuitive filters
  • Ability to customise listing view
  • Modules can be added to push products/categories

Listing Page

Listing pages were designed to be clean so users could easily browse products without any clutter. The view could be switched between showing 4, 3 or 2 items per row depending on the users preference. 

Products could be filtered using simple options that allow the fans to find the exact products they were looking for. 

Also at the bottom, modules could be added to cross promote any items or campaigns.

Template features
  • Streamlined product listing styling
  • Simple intuitive filters
  • Ability to customise listing view
  • Modules can be added to push products/categories
c
d

Kit Detail Page

The kit detail page was designed to clearly show off the imagery of the shirt along with the options to customise the kit with a player's name or a name of the user's choice. The lettering style could also be changed and badges could be added to their shirt just by pressing a button.

I also designed a feature that allowed related products to be promoted. In this case users could complete the kit by adding the shorts and socks to their basket along with other products the user might be interested in.

Template features
  • Prominent shirt imagery
  • Personalise your shirt options
  • Promoted products to complete the kit
  • Modules can be added to push products/categories

Kit Detail Page

The kit detail page was designed to clearly show off the imagery of the shirt along with the options to customise the kit with a player's name or a name of the user's choice. The lettering style could also be changed and badges could be added to their shirt just by pressing a button.

I also designed a feature that allowed related products to be promoted. In this case users could complete the kit by adding the shorts and socks to their basket along with other products the user might be interested in.

Template features
  • Prominent shirt imagery
  • Personalise your shirt options
  • Promoted products to complete the kit
  • Modules can be added to push products/categories

Fashion
Detail Page

Similar to the kit detail pages, the product was shown in a clean and clear design. The main difference between the pages was that the personalisation feature was not used on fashion items. This made for an even cleaner look.

Related products were shown in a similar way allowing the user to complete the look or add other fashion products to their basket.

Template features
  • Prominent product imagery
  • Promoted products to complete the look
  • Modules can be added to push products/categories

Fashion Detail Page

Similar to the kit detail pages, the product was shown in a clean and clear design. The main difference between the pages was that the personalisation feature was not used on fashion items. This made for an even cleaner look.

Related products were shown in a similar way allowing the user to complete the look or add other fashion products to their basket.

Template features
  • Prominent product imagery
  • Promoted products to complete the look
  • Modules can be added to push products/categories

Fashion
Detail Page

Similar to the kit detail pages, the product was shown in a clean and clear design. The main difference between the pages was that the personalisation feature was not used on fashion items. This made for an even cleaner look.

Related products were shown in a similar way allowing the user to complete the look or add other fashion products to their basket.

Template features
  • Prominent product imagery
  • Promoted products to complete the look
  • Modules can be added to push products/categories
lfc product fashion

Designed for any device

The first football club in the world to have a fully responsive e-commerce website

Designed for any device

The first football club in the world to have a fully responsive e-commerce website
footer responsive

More Projects

More Projects

white line