Promotion design
For Disneyland Paris' 25th anniversary, Coca-Cola celebrated their partnership by launching a digital promotional where consumers were offered the chance to win tickets for Disney's in-person event with the purchase of a Coca-Cola drink. The project involved a thorough understanding of Coke's promotions platform as well as the image recognition technology chosen as the entry mechanic for the prize draw promotion.
Activities:
Experience map // Screen design // User flow // Wireframes
Year:
2017
EXPERIENCE MAPPING
Mapping out the stages of this promotional campaign was critical to understanding which screens will need to be designed. It also provided the marketing teams with a clear step-by-step overview of how the activation needed to work. Suggested page layouts for every stage were also presented with this approach. These layouts were made up of appropriate components to recommend for the experience which were available within the Coca-Cola web authoring toolbox.
SCREEN DESIGN
Designs were mocked-up for the pages using assets provided by the marketing team and others that were created by the design team.
Development concept
A development concept was proposed to build a custom "hot-spot" component within Coke's authoring system. The component would allow users access to exclusive content by interacting with an animated map of the Disneyland Paris park. The engagement points triggered the display of short videos provided by Disney.
USER FLOW
A user flow mapped out how the experience would look with the inclusion of the new component. It begins with the user accessing the site where they would scan the product, followed by authentication for entry into the prize draw promotion, to then be presented with the animated map where they could explore the animated experience.
EXPERIENCE MAPPING
A deep dive into the user's motivations and attitudes was taken as a user would navigate through the experience without the presence of the new component. Through this process we were able to highlight pain points the user would run into on the course of the journey; proving a development case.
Subsequently, we laid out how a journey could look like including the new component. It featured fewer stages and less friction for the user.
WIREFRAMES
Wireframes were laid out for the development team to build the new component. They explained how a visual grid within the authoring environment allowed for the selection of coordinates linked on a new layer above a background asset.