Coffee Club Mobile App UX/UI




Problem Statement


How do we create a mobile app to house a coffee subscription service?


This project went to market and is currently available to download

︎ iOS App Download




Context


Northern Vessel is a coffee shop in Des Moines that seeks to utilize technology and innovative business models to provide a better coffee experience for the customer. One of those innovative business models that Northern Vessel has implemented is a subscription model called Coffee Club. I was tasked with leading a team to research, design, test, develop, and eventually market an app that houses the subscription service.

This project was undertaken in just 5 months in conjunction with the opening of Northern Vessel’s first brick and mortar location, and therefore was subject to considerable budget and time constraints. My goal was to lead the team to the successful launch of a mobile app that met the needs of both the customer and the business.

My Roles


UX/UI Designer
Brand Designer
Copywriter
Photographer


I Worked With


3 Stakeholders (Business owner, UX Consultant, Developer)
30 In-person Test Users


Project Duration


5 months




User Goals


  • Easily create a Northern Vessel account
  • Understand what a Coffee Club subscription is
  • Subscribe to Coffee Club easily
  • Cancel a Coffee Club subscription easily

Business Goals


  • Educate users on the benefits of a Coffee Club Subscription
  • Increase Northern Vessel account creations
  • Increase Coffee Club subscribers 
  • Retain Coffee Club subscribers



Research


  • Competitive analysis of reputable coffee subscription/ordering mobile apps

Surveys


  • Ran 2 surveys on Instagram to Northern Vessel’s followers to gauge interest in subscription service/mobile app


Wireframing, Prototyping, and User Testing



I conducted one round of wireframing user flows and we created three functional prototypes of the mobile app, along with two rounds of usability testing.

Initial progress was slow, as the subscription model itself was also under development and subject to scrutiny/revision during the two rounds of usability testing that we did. Because of the duality of developing the UX and the subscription model simultaneously, balancing stakeholder input, user goals, and business goals was absolutely crucial in this stage of the project.




Wireframing/Low Fidelity User Flow and Prototype

Initial Wireframing 

Initial User Flow Prototype 


First User Test


  

                                                      Typical startup stuff ︎



Mid Fidelity User Flow and Prototype




Second User Test



We rented out a coworking space and ran multiple user tests of the mid fidelity prototype for creating an account,
understanding the subscription, creating a subscription, canceling a subscription, logging in and out of an account,
deleting an account, as well as tested intentional crashes. We had iOS and Android test users present.


User Feedback Examples





High Fidelity User Flow and Prototype


After the two user tests, we arrived at a high fidelity prototype that was developed and went to market for iOS and Android.




Mobile App 1.0 Launch, Revision, and 2.0 Launch



Coffee Club 1.0 Launch

Despite a rushed development timeline, the mobile app went to market.




Coffee Club 2.0 Launch


After several months and with a newly revised and solidified subscription model, Coffee Club 2.0 was launched.

With a significantly simplified user flow representing a refined business model, this relaunch resulted in a 1,860% increase in Coffee Club subscriptions.


Cognitive Load


Another marked difference between the 1.0 and 2.0 versions of the mobile app was the main infographic, which contained the sales copy for the subscription. As the subscription model was simplified, so was the sales copy, contributing to a significant decrease in cognitive load for the user.


1.0

2.0



This project went to market and is currently available to download

︎ iOS App Download





What I Learned

  • Communication between the developer and the other stakeholders was likely one of the most important factors in this process
  • Finding the right developer to work under the budget and time constraints present was crucial, and he absolutely nailed it! 
  • Submitting the app to the Apple App Store was a very fast process, while submitting to Google Play Store was much slower, about a week delayed (the app is no longer available on the Google Play Store)
  • Since the subscription model was being developed alongside the user flow and experience, this presented complications that ultimately led to a rushed launch
  • The mobile app could have benefited immensely from one more round of usability testing before the first launch
  • This project would have benefited from more research and development of the business model before beginning the UX process
  • Spending more time initially on researching user behaviors within the context of subscriptions would have saved valuable time and budget


    Key Takeaways

  • Users were far more likely to initiate a subscription if the button to cancel was as visible/easy to find as the “subscribe” button (nobody likes to feel trapped)
  • One major benefit to the business due to a minor feature of the mobile app is a user base that now receives push notifications directly to their phone - this may be more effective than social media or email for short bursts of information - which none of the stakeholders anticipated
© 2024 Alexander Prins 
email: hello@alexprins.com