magaloopClub

Background

The magaloopClub is members only section of the magaloop app created to give certain users special benefits. The app's core function connects small shop owners to larger wholesalers, enabling easy ordering of drinks, snacks, and other inventory items (like Gorillas or Flink but B2B). The members club thus offers an additional value add and packaging of cashback savings.

Research

User Research:

I visited a series of actual users of the previous version of the magaloopClub. I fielded questions aimed at understanding what the users understand the club to be, how they currently engage with it during a typical session, and any obstacles they face when trying to use the vouchers included with a club membership.

​

I then synthesised the interview results into the following pain-points:

Competitor Analysis:

In addition to user interviews, I referenced a series of apps with comparable functionality - apps that are used to explore vouchers for use while shopping in person in store, as well as e-commerce platforms with member sections.  

Define & Ideate

The pain-points mentioned above demonstrated some major issues with the basic functionality of the magaloopClub. Furthermore, a quick look at similar applications showed us some obvious quick fixes. Thus, together with my product manager, we devised a list of must-haves (both improvements and new additions): ​

User Flow & Lo-Fi Sketches

As the timeline for this project was extremely tight, I streamlined userflow and lo-fi improvements into one step, keeping in mind our top priorities.

The interesting challenge here was to understand how gamification elements might help users to feel like the club is special, and motivated to continue activating vouchers while shopping. These elements had the potential to both serve the function of - 1) giving users a clear overview of why the club is beneficial, and how much they save each month, and 2) create this feeling that the club had some major added benefits compared to non-club magaloop users.

We also needed to be sure to optimise for easy use while shopping in person. The user journey reflects the fact that a user will likely browse coupons both before and while visiting their wholesaler to purchase their goods. In this sense, the user must be able to quickly navigate from coupon to coupon, but also have an overview of the items each coupon applies to.

​

Furthermore, as the vouchers are available to both delivery users and in-store shopping user, it was quite a challenge to marry the two shopping methods in a coherent experience. For this release, given certain business goal restrictions, we placed only in-store vouchers in the club section, and created a parallel user experience for delivery vouchers in the non-section of the app. The club section was nonetheless created to allow for easy implementation of club only delivery vouchers  at a later time.

Branding

As magaloop's design system was already in place at the time of creating the club section, I had very little to do into the way of a style guide. However, I decided that the club should be visually distinct from the rest of the app - but still obviously contained in the magaloop brand. Thus, I opted for a slight variation of magaloop's color scheme.

Prototyping & Handoff

Hi-Fi Wireframes

Moving into hi-fi, I paid special attention to the club homepage, membership card, and vouchers, as a heatmap data revealed to us that these were the most visited screens. Additionally, I created a series of gamification elements to assist users keep track of their cashback, card scans, and voucher usage.

Summary

In Conclusion

‍
These screens were released and are now live in-app. Voucher engagement and clarity on the club section has seen a dramatic increase, and we have been able to assist our users in achieving even greater savings in-store.

Next steps will include improvements based on further user testing and interviews, as well as a few UI quick fixes.

‍