• Lowered number of users leaving the service by >17% per month
• Reduced weekly skip by an average of >%3
• >70% of Sun Basket users use the mobile apps, exceeding projections.
• Overwhelmingly positive feedback from Sun Basket users.
• From Design concept to beta testing: 6 weeks.
I led all UX Design, Project Management and front end Engineering for the iOS and Android mobile applications.
When I arrived in 2016, Sun Basket was a simple meal kit with a web-only interface, whereby the user signs up for a subscription and select 2-4 recipes per week from a list of 12. The goal was to keep users from leaving, and to try to get them to skip weeks as seldomly as possible.
I was hired produce the Sun Basket iPhone app. Mobile apps are ideal for products that require constant engagement. Having Sun Basket on the user’s home screen was an obvious solution to keeping customers and reducing skip, assumptions that would later be born out by subsequent data.
I first looked at the user data to discover how and when users were making their selections; whether on a large desktop, or mobile web, what time of day, whether they would return many times to re-edit during the week, and whether they would set a number of weeks at once. I conducted some user testing, to record how users were using the app, and ask them questions about their habits. We use Hotjar to record and monitor how users are interacting with the desktop and mobile web experience, so spend considerable time reviewing those recordings. I also reviewed Hotjar recordings of live interactions.
One distinct learning I came away with was that the photos were very important to scanning, selecting, and general engagement. Users would often react with their stomachs. The typical eye movement is to be bouncing back and forth between title and image. Fortunately, the Sun Basket photography is the best in class. At that time there were a significant (I recall about 25%) of menu edits occurring on mobile web. But at that time, the design kept the images quite small when viewing on mobile. It became clear that we needed to test whether using a larger photo on the mobile app would have a positive impact.
We also found that users fell into three distinct types: planners, tweakers, and set it and forget its. Planners liked to arrange multiple weeks in advance. Tweakers reacted week by week, and would often tweak a week multiple times, and ‘set it and forget’ users like to just let the boxes arrive based on their meal plan without much customization.
Sun Basket Desktop Before The Mobile App
The challenge was to combine the comparative ability to see the items the user has in their basket, with the immersive photographic experience of larger recipe tiles. We decided to evolve the web experience with some solutions that would allow us to build a mobile app with patters similar enough to make for a consistent experience when users switch between platforms.
The solution
Use an ‘edit mode’. The user can choose to scroll a series of larger recipe tiles before entering into edit mode. Once in edit mode, they can see more recipes on the screen at once, and even dip down below the minimum before hitting ‘save’.
Use checks instead of numbers across mobile and desktop.
For organizers have a schedule tab with a vertical list of upcoming weeks so that the user can easily compare weeks, and manage skipping. Keeping skipping off of the main menu screen.
We realized that we didn't want to allow the user to skip directly from the menu screen, as it was obvious that this would result in an increased skip rate, an assumption that was born out with subsequent testing. It was very important to allow them to easily move from week to week. And so across the top, the primary navigation is to tap or horizontally swipe from week to week.
Mobile App Design With Edit Mode.
Ultimately, this ability to swipe sideways to access different weeks seemed very natural, and was very popular with our users. We later found that users who customized more tended to skip less, and that the more we successfully pulled users into a week to engage, the less likely they would be to skip a week. And so we tested a flow whereby when the user saves a week, then the app automatically takes them to the next week. Surprisingly, users didn't find this annoying, and it resulted in a small, but significant reduction in skips.