Magaloop Checkout
Just before I went on maternity leave I was lead product designer at Magaloop, a marketplace that connects shop owners, wholesalers & manufacturers. In nearly three years the application underwent a complete transformation in terms of its appearance and usability. Thanks to the redesign and improvements, we were able to attract many new investors, resulting in securing 14.9 million euros in funding. We introduced 19 new features that enhanced the attractiveness and usability of the application. As a result, we gained a remarkable 78% increase in new users, contributing to the overall popularity and reach of the application.
Leveling up mobile experience
Magaloop was originally built for desktop with a companion mobile app. By 2020, tables have turned as we have more monthly active users on mobile than desktop. However, our mobile experience still wasn't a "first-class citizen," as seen in our app store reviews and survey feedbacks.
I worked with the iOS and Android team to improve our user experience on mobile, to not only meet the competitive baseline, but to exceed it. We have completely audited and improved our core experience, from registration, ordering process, cashback, onboarding new users and navigation.
Streamlined checkout:
The main core of the application was to order goods. Therefore my main focus was to create a simple to use yet complicated checkout process. I have decided to not only re-design the UI side of the application but also the whole whole. Additional features not only streamline the checkout experience but also enhance the overall usability and value of the app. They empower non-digital shop owners with tools to manage their FMCG supply chain more efficiently while respecting their preferences and trust in offline business practices.
User Research:
To fully understand the problems we are solving, design team needed a real understanding of the lives of the people that use Magaloop. We went into off-licence, mom’n’pops, family led shops, and warehouses to experience first hand how our users spend the majority of their day and what surrounds them.
- Non-Digital Orientation:
The target audience, comprised of small shop owners, exhibits a skepticism towards digital platforms and prefers traditional offline business practices.
- App-Based Ordering Preferred:
Surprisingly, small shop owners are open to using mobile apps to streamline their FMCG supply chain. They value the convenience of placing orders through a digital platform.
- User-Friendly Complexity:
While they are open to app-based solutions, simplicity is key. The app should be straightforward to navigate despite catering to complex supply chain processes.
- Delayed Payment Option:
Cash flow is crucial. Hence, these retailers desire the option to pay for supplies at a later date, mirroring their current supplier relationships.
- Pricing Parity:
They expect pricing and deals similar to what they receive offline, fostering trust and consistency.
Market Research:
There's currently no dedicated app in the market to meet these unique FMCG supply needs. Comparisons can only be drawn to conventional food delivery apps in Germany, highlighting the untapped potential.
New Features:
Expanding on the market research findings, enhancing the app with additional features can further meet the needs of small shop owners and provide a more comprehensive solution. Here's how these new features can benefit the target audience:
- Change Delivery Address:
Small shop owners often require flexibility in delivery locations, especially if they operate multiple retail outlets. Allowing them to change the delivery address at any point in the ordering process ensures convenience.
- Payment Method Flexibility:
Offering various payment methods, including cash on delivery and digital options, caters to the cash-centric nature of this audience. Providing a seamless transition between these methods simplifies the payment process.
- Billing Address Management:
Enabling shop owners to easily update their billing address ensures accurate invoicing and record-keeping, a crucial aspect of their business operations.
- Promo Code Integration:
Incorporating promo codes can incentivize these retailers to use the app regularly. Discounts or exclusive offers can encourage adoption and loyalty.
- Product Recommendations:
Leveraging data analytics to provide tailored product recommendations can help shop owners discover new items or ensure they don't forget essential supplies during their order.
Mobile Design System
I undertaken a significant initiative in the form of a design system to elevate user experience and streamline development processes across all platforms ( desktop, admin dashboards, mobile applications, and wholesaler dashboards) with main priority on mobile.
By inheriting foundational styles such as typography, spacing, and color from the core system, the mobile design system ensures brand consistency across all platforms. This inheritance not only maintains the visual identity of Magaloop but also expedites the development process by providing a unified design language.
However, the mobile design system goes beyond mere inheritance. It recognizes the need for platform-specific components, given the unique design and interaction patterns of iOS and Android. As a result, the system introduces platform-specific elements, optimizing the user experience for each mobile platform.
The impact has been substantial. Our development teams can now work more efficiently, delivering polished user experiences. But this is just the beginning. At Magaloop, we remain committed to improving our mobile app, aiming for consistency, ease of use, and delight for our users.
Streamlined order history:
The redesign of Magaloop's Order History pages was centered on meeting key user needs, including the imperative for clarity and transparency in transaction records, streamlined navigation for efficient searches, seamless integration of offline payments, real-time order tracking akin to offline experiences, and accessible customer support. By addressing these essential user requirements, Magaloop aimed to significantly enhance user satisfaction, trust, and overall usability of its platform, reinforcing its commitment to providing a marketplace that is responsive to the diverse preferences and expectations of its user base.
User Pain Points:
Users encountered several pain points when using Magaloop's previous Order History pages, including a lack of clarity in transaction details, inefficient navigation for locating specific orders, challenges integrating offline cash payments into the system, uncertainty without real-time order tracking, difficulty accessing timely customer support, and usability issues with the interface. These pain points led to frustration, mistrust, and inefficiencies in their experience. The redesign aimed to alleviate these issues by addressing these pain points, ultimately enhancing user satisfaction and trust in the platform.
Adding buy now pay later:
The need for a "Buy Now, Pay Later" option, referred to as MagaloopPay, arises from the desire to provide shop owners with a flexible and accommodating payment solution. Magaloop's users, particularly non-digital shop owners, value the ability to manage their cash flow while accessing essential supplies. This option allows them to make immediate purchases and defer payments, aligning with their unique financial needs. By introducing MagaloopPay, Magaloop aims to cater to this specific audience, enhance their shopping experience, and maintain its position as a trusted and adaptable marketplace.
Summary
As a product designer, my journey toward a mobile-first design approach has been a dynamic and evolving process. I embarked on redesigning critical aspects of our platform, including the checkout and order history pages, while introducing the innovative "Buy Now, Pay Later" feature, known as MagaloopPay. Our commitment to mobile-first design recognizes the ever-increasing importance of mobile devices in our users' lives.
Throughout this transformative process, we've embraced flexibility and adaptability, recognizing that our product and business goals are not static. Our team has iteratively updated the ordering and checkout flow multiple times to align with shifting objectives and user needs, ensuring that our platform remains user-centric and responsive. This iterative approach has allowed us to fine-tune the user experience, making it more efficient, intuitive, and accommodating.
The introduction of MagaloopPay, in particular, represents a strategic response to user preferences and market demands, offering flexible payment options to cater to the diverse financial needs of our user base. This holistic approach to design, driven by a mobile-first mindset, underscores our dedication to providing a seamless and user-centric experience across the Magaloop platform while remaining adaptable to evolving product and business dynamics.