Menu

Drinkfinity

UX/UI Design

Drinkfinity

Drinkfinity is a brand of personalized drinks from PepsiCo that allows users to “Peel, Pop and Shake” their water bottle to transform flavor pods into over a dozen flavors.

Overview

Drinkfinity needed a new e-commerce website. 
At Firma, I was responsible for the process of UX/UI of the e-commerce.

My role

In this project, I:


- Together with another UX Designer, created hi-fi wireframes for desktop and mobile versions.

- Created rapid and & InVision prototypes.

- Conducted user testing in New York and London

– Designed the interfaces of the product
– Created variations of design for different markets

– Provided art direction for the website



Info

Client: Drinkfinity – PepsiCo
Role: UX/UI Designer
with Firma
Year: 2017

the process

The process started with the creation of wireframes with the inputs and insights got through the profiles of personas created by Firma Team and the experience of the old website, and also the benchmark insights.

 

USER TESTING

We did the user testing in two locations: New York/US and London/UK. The first launch of Drinkfinity was in Brazil, 5 years ago. They then successfully launched in the US and now want to be present in Europe. With this information, the two locations mixing Brazilian people and local people was a good beginning for user testing. We did a test with 20 people in US and 15 people in UK with different profiles. We asked them to do a few different tasks to see if they could complete them. The tests were recorded and were late analyzed. 


 

Invision's prototype

tasks


1) You already know about Drinkfinity, bought the products a few times and now you need to create a subscription to receive our products monthly. Show me how you would do it.

2) Now, you need to find a sweet flavor in the Pods Page.

3) Someone just told you about Drinkfinity and sent you the url of website. You liked the brand and want to try a product. Which product would you buy first?

4) It’s your wife birthday, get her a bundle with the flavors of her preference.

5) You just receive da promo code by email to get any products on the website. Where can you input this code?



USER TESTING RESULTS

The user testing & interview applied was clear enough to get some good results:

  • In general, users think the navigation is easy and intuitive.
  • 96% of the users tested preferred customizing their Kits to choosing a Pre-selected Kit.
  • The Customization process for Welcome Kit and Bundles was easy for users both desktop and mobile.
  • 60% of users did not understand the subscription process. They didn’t get why the option to subscribe was only given on each specific Pod PDP and not before.
  • Users would like to be able to subscribe to multiple Pods in one go, rather than having to complete the subscription process one Pod pack at a time.

 

  • 95% of users preferred the filters on the left-hand side of the screen.
  • 50% of participants did not understand the Active Ingredients, and therefore how they were connected with the Modes.
  • 90% of participants preferred the cart notification displayed on the right rather than a temporary notification at the top of the page.
  • 70% of participants preferred to purchase as a guest (without registration).
  • All users were happy that several payment methods were available. The most preferred payment options were PayPal and credit cards.
  • 70% of users would only provide their friend’s emails (to invite them to try D8) if they received a discount or other incentive in return.

 

visual design

Also, I was the creator of the visual design of the website for US, UK and BR versions. I worked closely with the Pepsico team to develop the visual and the copy.

 

Interaction Design


In each deliverable, I used the Principle app to create prototypes of animations. I did this to better show off how attractive each page will look once it was finally developed.

This is a unique website which will require a more modern browser to work!

Please upgrade today!