How Insights from Instagram Post Creation Reduced Drop-off Rate by 23%
Dyne Technologies | 6 minute read
The way that Instagram contextualizes and groups related steps inspired the meetup feature redesign.
At Dyne, We Embrace Inspiration to Drive Innovation
I drew inspiration from unexpected sources like Instagram’s post creation. This reduced drop-off rates by 23% by making it more intuitive and faster to use.
This project focused on the meetup creation feature, allowing users to book reservations, apply discounts, purchase a coupon, book a meetup, and invite friends.
This project focused on the meetup creation feature, allowing users to book reservations, apply discounts, purchase a coupon, book a meetup, and invite friends.
The information in this case study is my own and does not necessarily reflect the views of Dyne.
A brief overview of the final solution: clear separation of meetup creation steps and more flexibility.
Who We Are
Dyne is one of Canada’s top 15 food and beverage startups, founded in 2021. The company offers a B2B analytics web app for restaurants and a B2C mobile app designed for university students.
As one of their UX designers, my primary responsibility was the mobile app, though I often collaborated with another UX designer on web app features.
As one of their UX designers, my primary responsibility was the mobile app, though I often collaborated with another UX designer on web app features.
Information Overload and Inflexible Flows Leads to a Combined 64% Drop-off Rate
Old design with visualized findings - 16 participants 50/50 split between new and experienced users
Imagine you're a student at UBC. All your friends are talking about Dyne and its amazing discounts and benefits. Excited, you download the app to try it out. But when you use the meetup feature, you quickly get frustrated and confused. You give up, missing out on the perks. This leads to lower user engagement for Dyne, making it hard to attract new B2B clients and risking the loss of existing ones.
When we interviewed a mix of new and old users to understand why they didn't like using the mobile app despite its benefits, most of them said, "The meetup creation feature feels too long."
This issue manifested itself differently for new and old users:
1. New users were particularly prone to information overload because of the sheer volume of unfamiliar content.
2. Old users often forgot to purchase a coupon before starting the meetup creation process, forcing them to restart and redo everything.
On the rare occasion that users didn't drop off, 87.5% of them felt exhausted by the end of the process.
With a clearer picture of how user type pain points differed, we were ready to start ideating solutions for each user type.
Desired Outcomes/Goals
1. Reduce the average drop-off rate for new users.
2. Increase active user ratio across all users.
3. Make the meetup creation process feel shorter and more streamlined.
Initial Solutions: Simplification & Tooltips (and why they failed)
With our research-generated goals in mind, it was time to move to solutioning:
1. We simplified the meetup creation process by removing steps like QR code scanning and messaging. However, this did not reduce information overload or the perceived length during testing. Management preferred this low-effort solution, but I had doubts from the start, which I should have voiced.
2. Tooltips to guide users: have a one-time (relaunchable) interactive tutorial with tooltips for new users. Testing yielded new users remembered only some of the required steps for meetup creation from the tutorial.
This solution was implemented not only to the meetup creation feature but to the entire app to improve our onboarding experience as the implementation effort was very low.
3. Flexible coupon purchase: enable in-flow coupon purchases during meetup creation, a change that tested well with both user groups despite not mitigating information overload.
Part of the reasons why the previous solutions failed was because there was still little to no separation between meetup creation steps. With integrating coupon purchases, we knew we were on the right track.
The two screens on the left show the flow for purchasing a coupon within the meetup creation flow. The right most screen shows the previous design.
Design Principle: From Sprawling and Overwhelming to Distinct and Flexible
As a product, we want to make the meetup creation steps more digestible to new users while also giving experienced users more flexibility with actions like coupon purchases with the end goal of increased user retention while keeping the feature streamlined. If necessary, the needs of new users will take precedence given their lower user retention metrics.
These requirements brought us to a proven design concept: Instagram's modularization.
These requirements brought us to a proven design concept: Instagram's modularization.
Pivoting: How Instagram's Approach Could Work For Us
A classic example of modularization is Instagram's post creation. Moreover, similar flows exist within various features like stories.
1. Breaking down a complex process into multiple, smaller steps to make it feel shorter and more digestible for users.
2. Integrating steps from other related features to reduce the learning curve.
3. Grouping related steps into separate pages to avoid information overload and contextualize pages.
How We Implemented Modularization
Modularization allowed us to simultaneously address both information overload and inflexibility. My changes consisted of:
1. Coupon purchase changes: Building the coupon purchase into the meetup creation flow. Also, only relevant coupons (for the selected restaurant) appear in this flow now.
2. Information breakdown: Grouping related meetup creation steps into different pages to aid in mental categorization and contextualization.
Although this looks like more information than the original design, the only new function added is the ability to purchase a coupon. The new design is similar to the original, but with much more room to breathe.
62% Increase in CSAT Among Tested Users
Before shipping it, I conducted one more round of usability testing with our original 16 users for any final revisions.
Rather than 5/16 satisfied users with the old meetup creation feature, 15/16 users were now satisfied with the redesign, requesting only minor revisions.
What I Shipped: The Final Solution
A complete walkthrough of the redesign
Prototype Demo
Here is a video demonstration of my work on the redesign.
Results
1. Reduced the average drop-off rate for all users by 23%.
2. Increased active user ratio by 21%.
3. Increased customer satisfaction (CSAT) by 62% with testers now stating the meetup creation process felt less tedious.
My work also had other effects such as being integral to a seed funding round and leading to the acquisition of 750+ B2B restaurant clients.
Things to Try Next Time
While the project was a huge success, here are some things that I would like to apply next time:
1. Show and sell, don't just tell: Stakeholders hesitated to explore perceived high-effort solutions. Instead of just proposing an idea, I should have first tested it, analyzed data, then presented it.
2. If you don't like a potential solution, speak up! I regret not voicing my concerns about the initial solution we came up with because management favored its low implementation effort. As a designer, it's important to consider business objectives, but advocating for the user should always come first.
3. Look to leading companies for design patterns: We successfully adapted Instagram's modularization model to our product despite industry differences. Next time, I'll look right after defining the requirements for our solution.