Mailchimp – Contact Import
How might we help users send their first email?
Every Mailchimp user is required to import their contacts if they want to send an email. The existing Contact Import flow suffered from a notably low task completion rate. It was contained in a confusing and inaccessible wizard which resulted in a substantial drop-off rate among users, particularly at the complex field matching step.
As part of the 2019 company-wide app redesign initiative, this project was the initial release. My team leveraged existing research and data to pinpoint Contact Import as a significant pain point causing activation drop-off, identifying untapped upsell opportunities tied to audience growth.
A mere 1% boost in activation rate equated to a $1.3 million annual revenue increase. So, retaining the 14% of users who churned due to usability challenges represented a $10 million annual revenue potential.
Notably, 75% of these users failed to utilize the platform for sending after creating an account.
Before
The wizard UI was not accessible while simultaneously confusing to use. Additionally, the placement of "Help" and "Exit" in the top right of the wizard and “Continue” in the bottom right were not clearly visible due to low contrast. This complexity led to a high drop-off rate among users, especially at the most intricate step, which was the field matching process.
Strategic Approach
Reviewed existing research and analyses
Facilitated internal cross-functional workshops
Partnered with test vendor Human Interfaces for competitive benchmarking
Conducted in-person customer visits to interview frequent Contact Import users
Employed RITE method with low-fidelity prototypes for quick insights during customer visits
Released iteratively to GA
CORE INSIGHT
Active accounts that never import exist, but importers have three times the average revenue per user than non-importers.
Challenges & Opportunities
I initiated a series of internal sessions with my team to identify areas of improvement based on the current flow, which allowed us to establish our initial requirements. We also reviewed existing analytics, customer feedback and complaints, taking into account various user journeys and edge cases within the flow. These sessions were instrumental in shaping the initial problem statements, sketches, and prototypes that we later brought to our customer visits.
We had various issues to address, and the outcome of our benchmarking study pinpointed these specific focus areas:
Improving the tagging feature
Streamlining the process of matching contact fields to Mailchimp's system backend
Facilitating the creation of new contact fields
Improving the usability and legibility of the 'wizard' UI
Transitioning from our legacy framework, Dojo, to React, and aligning with current WCAG accessibility guidelines
These areas were chosen because during the study:
Only 45% of participants were successful in matching fields.
Only 64% of participants could create a new field.
Only 29% of participants managed to tag an import.
Testing & Validation
Following the benchmarking study and workshops, we did eleven in-person customer interviews, visiting their stores, offices, and factories. During these visits, we used Rapid Iterative Testing methods via low-fidelity prototypes (see below) to gather quick insights.
Six of these interviews occurred in Austin, Texas, while the remaining five were in Atlanta, Georgia. We chatted with customers with a range of marketing sophistication levels and business ages or maturity.
During our initial visit, we had the pleasure of meeting Leslie, the owner of a jewelry shop named Aro. Leslie's method of gathering subscribers involved a notebook placed on the shop's counter, where she collected email addresses. However, this approach often resulted in illegible or misspelled manual entries.
Insights & Feedback
Of our eleven customers, those who frequently imported mainly from digital sources found that importing seemingly irrelevant contact fields was cumbersome, the value of importing more than the essential information was unclear and they needed to regularly and manually update their contact list.
Conversely, those who infrequently import mainly from digital sources experienced difficulty with Mailchimp's field matching process and other options, particularly when not used frequently.
Meanwhile, customers who often imported primarily from physical sources quoted inefficiency, either adding contacts one by one or creating spreadsheets for Mailchimp uploads.
And those who infrequently imported mainly from physical sources faced challenges in reading handwritten information and the need for additional ideas on how to collect subscribers.
When we started this effort, only 74% of new users that started an import successfully completed it. After we shipped the new version, we saw 87% of new users that start an import successfully complete it.
Overall, 92% of all users that started an import successfully completed it, which was an increase of 18%! Because of the project’s success, I partnered with the mobile app team to deliver a mobile version of this flow that also showed a huge uptick in mobile list imports.
Outcomes
Design System
After auditing what we felt could be adopted from the Contact Import work, my primary contribution was a reusable Combo-Box dropdown component with multiple inputs.
I also contributed an accessible, reusable modular Wizard pattern. We built Contact Import as a portable experience to minimize disruptions to user task flows.
In addition, my team delivered the new React code for this Wizard, the shell of the application, the navigation and our new modular sub-system.