Digital Advent Calendar

Time: 2 months

Role: UX/UI Designer at HashtagYou

Type: Responsive web design

Tools: Figma, Jira and Asana

Skills: Competitor research, wireframes, mockups, prototypes

Context

Overview

Working on the Advent calendar feature was one of the most fun projects that I had at the company, and I was able to work on it from the beginning until the going live phase. In order to develop this project, it was necessary collaboration with many different areas like design, product manager, developers, marketing and creative teams. The goal was to design a creative, beautiful and engaging digital advent calendar to improve customer traffic through the shop during holiday season.

My role

I was the designer responsible for UI and UX, creating wireframes, prototypes, mockups, collecting copy and illustrations/icons. The main focus of the project was the mobile design, as 90% of our customers use smartphones to make purchases.

I first worked with product management and marketing to better understand the functionality and the specific requirements. Later, with already some design options to present, I worked together with the developers to check whether the solutions presented were feasible. Finally, I worked together with the creative team to collect the final copy, illustrations and GIFs.

Design

In order to deliver this project and improve the user experience, the design process was divided into 4 steps:

Research: For this project the research is a little bit different. As there aren't many digital advent calendars online out of the holiday season, we needed to collect inspiration and learning from not only digital, but physical advent calendars as well.
Define: On this step the focus was to understand all the requirements, how it would work and all the nice to have features for this project. Mapping how the doors would open, what would happen if the day had already passed, what would be in each door, how many doors and so on.
Develop: This was the project that I could get the most creative in terms of UI, but still keeping in mind our brand style and our physical advent calendar for that year. I created wireframes and prototypes to explore different solutions and evaluated them with the team, to understand what would be the best options for the product, and what would be the most doable for the developers.
Deliver: Preparing the handoff for the developers, content and marketing team, with the final designs, prototypes, assets and guidelines.

A little bit into the process

The goal of this feature was to increase customer traffic during the holiday season, gain more customers and give something back for them as gifts.

When considering user flows for this project, we have two main types of users: one that already has an account in our shop and the other one who isn't registered. As one of the points was to win more customers, we strategically asked them to create an account or log in to be able to access the feature.

For each door's gift, we had to align with marketing and creative teams to understand what would be possible, as they would be the ones responsible to determine whether they would be giveaways, downloadable files or discount codes.

All the illustrations used were provided by the creative team, inspired by our physical advent calendar that would be available for the holidays. The colors of the digital version were also inspired by the physical one, but evaluating the color contrast and improving it to make sure everything would be accessible to our customers.

As part of the deliveries, it was included a prototype with all main actions, flows and motions necessary for the developers to be able to recreate it.

Results

After many rounds of reviews and iterations, we came up with a page beautifully designed, but still with great focus on usability and responsiveness across desktop, tablet, and mobile. As a designer, this project was a great joy but also challenging, as it was a big team effort to bring this project to life.

This was the first time the company had this feature and we had so much learnings from it, mainly around cross-team communication.

It is such a rewarding experience to see a page I worked on going live and knowing that many users will be visiting, interacting and receiving their gifts everyday, hoping that would bring some happiness through their day, and also achieving our goal.

As this is a seasonal feature, I don't have the weblink available, but you can have a sneak peek with my prototype :)