Projects Ancestry


Web Design and Development

Ancestry combines DNA results and the largest collection of records to give people the best insight into their genetic origins. Our task was to help users connect with their musical heritage.

Getting to understand the brand's core purpose

In essence Ancestry's primary goal is to enable journeys of self-discovery that collectively inspire a world of greater understanding and belonging.

Brining music into the equation

Self-descovery is often an emotional connection and what better way to embody this than through music. Music can inspire us, consume us with nostalgia and awaken within us a whole world of emotions. To help bridge the gaps between discovery, understanding and belonging we created two microsite experiences. The first of which was aimed at the general public, allowing users to discover their 'Musical DNA' while also being given the opportunity to explore the musical culture from a number of countries around the world. The second expereince was aimed at members of the Ancestry community who had acquired the DNA kit - and offered the chance to use their results to get a playlist of music specific to their personal heritage.

Designing for fingers and thumbs

To ensure the best experience possible for the user, we begin our design process by creating wireframes to map out the user journey. Here we lay out each element and carefully considering where it should be placed to best inform the user's navigation through the expereince. As standard our initial strategy will centre around the smallest mobile interface - we are then able to boil down the essential pieces of information that users need to receive and capture the precise order of the hierarchy. Once this order has been set we can move to larger formats such as desktop and tablet devices, considering how and why we should hero certain content (imagery, infographics etc) to create the most attractive and engaging expereince.

Connecting Experience with aesthetic

The images we used were chosen to capture the notion of historical and personal exploration, while ensuring that we conformed with the brand style throughout each expereince. We tried to capture a sense of discovery and belonging through the use of colour in our designs, assigning each region a specific hue which changes depending on which region is selected.

Build for Phase One: Explore Your Musical DNA

With 'Explore Your Musical DNA' the user's result, their 'Musical DNA', was naturally the crux of the experience. Our challenge here was to offer the result in an attractive and engaging way - and we did this via an interactive pie chart, which broke down the user's favourite sub genres, to offer an interesting and accurate result. This was generated using a data-driven javascript library which produces dynamic, interactive data visualizations to make the user's Spotify data look stylish, while also offering substance, to achieve the desired effect. The detail within the second section of the results page, where users are matched with musical cultures from around the world, was generated by finding which countries/regions the user's listening habits were most closely aligned with and then presenting a number of comparable countires to explore - each with their own playlist to investigate and enjoy.

Build for Phase two:DNA Kit/User Heritage

The DNA Kit-based experience presented us with an immediate challenge given the volume of traffic we were seeing to the site, the level of user engagament and, most importantly, the number of playlists which were being generated. As standard a typical Spotify user account can only hold a maximum of 10,000 playlists, so with such a high volume of activity, accounts were filling up in as little as 20 minutes. To save us needing to manually create a new account every time we hit the 10,000 playlist limit - and to save the possibility of users being unable to generate a playlist because of the Spotify account being at full capacity! - we built a time-based job scheduler software which is running every minute, calculating the number of playlists created; if that number is equal to or greater than the set limit, there will be an automatic swap to a new, empty, account. Thusly creating a seamless, unaffected expereince for our users.


We use cookies to track usage and performance.

I understand Cookie & Privacy policy