top of page
fanstore.png

Loyalty UX

Coca-Cola Spain had specific functional requirements for migrating their loyalty site onto a newly released global template. The project focused on providing both the development team and the marketing teams with a detailed understanding of the requirements the experience needed to move to the new template following its previous consumer facing loyalty website.

Activities:

Site mapping // User flow // Functional specs // Wireframes // Screen design // Prototyping

Year:

2020

SITE MAP

Laying out the experience's site map provided a useful overview of which pages would need to be included on the site for a functionality review.

 

This would also create a clear indication of which pages would need to be mocked up.

NAV.png

USER FLOW

Detailed user flows helped map out the unique functional requirements of the loyalty activation as the user would interact with elements on site. This helped inform the team of gaps in functionality which would need to be requested for development in order to meet the requirements that existed in the previous version of the experience.  

14.17-flow1@2x.png

FUNCTIONAL SPECS

A breakdown of the functional requirements was outlined with regards to each section that was included within the experience, which included mock-ups for reference.

It summarised details about the activation's mechanics regarding points earned and how users could redeem items on the site using those points.

fanstore-requirements-book2.png

WIREFRAMES

Wireframes were prepared for the development team to review layouts of the key screens that made up the experience.

 

In addition to providing the definitions for the page architecture, these wireframes called out the functional requirements including shopping cart behaviour, user profile management and points mechanics.

Screenshot 2021-04-13 at 15.24.34.png
Screenshot 2021-04-13 at 15.26.43.png

SCREEN DESIGN

Mock-ups were created to further demonstrate the page layouts for the loyalty migration. The designs supplied included those for the home screens variants (logged in/logged out/returning user), the catalogue area as well the UI to be applied to elements affecting the shopping basket pages.

Mockup-tablet-fanstore.jpg

PROTOTYPE

A prototype was built to demonstrate the way a user could navigate from the main website through to the Fanstore experience. It showed how a user would need to first login in order to browse and interact with the catalogue content available to redeem. 

browser-xd-rpototype-fanstore.jpg
bottom of page