Constant Contact, an online marketing service, was established in 1995 and since then has grown to serve more than half a million small businesses and nonprofits. The business, with offices across the US and in the UK, provides email marketing services and, more recently, social media (SM) marketing. But the SM feature is underutilized, and their own research indicated that users found the process of using the feature difficult and confusing.
Constant Contact approached our three-member team for this two-and-a-half week project. We were initially tasked simply with redesigning their SM sharing page. But we soon found that the process of getting to the page needed work, and the home page confused users and did not have a strong SM presence.
We made the SM sharing page easier to understand and use, as tasked. We made two further recommendations: first, to improve the navigation to and within the SM flow; and second, to increase awareness of SM as a platform on the home page.
We started with competitive and heuristic analysis, a survey, and user interviews. I did much of the online research and helped formulate the survey questions. From the survey we found that, of the people that used an online marketing tool, Constant Contact’s main competitors are HootSuite, Facebook for Business, and Buffer.
Constant Contact’s competitors, in general, have more polished interfaces and offer more sophisticated tools such as Google Analytics and dashboard management of real-time SM. Constant Contact’s website, with its blue and yellow palette and homey, rounded icons, is geared towards a more “mom and pop store” demographic. The changes we proposed would keep the site’s look and feel, but offer customers education about the value of SM as a marketing tool.
And users, from our survey, want to accomplish a number of tasks with their marketing, many of which are suited to SM marketing—particularly where the user wants to create a conversation with their customers.
Users find the social media page overwhelming (initial project scope).
Design solution: a user interface (UI) challenge
Visually restructure the page and condense formats.
We chose as our representative user “Sarah,” 29, the owner of Kiss & Tell Flower Shop in San Francisco. She is independent and creative, and has many loyal local customers. She has a list of email contacts and a Facebook page, but isn’t sure what to do next to grow her business.
She decides to check out Constant Contact, and navigates to the SM sharing page.
She is confused by the long list of posts, as well as the calendar, which is no longer visible after scrolling.
A task analysis reveals that this page has an overwhelming number of steps, and usability testing participants found the page difficult to use.
We started by sketching the SM sharing page with large but collapsible input screens. We introduced a new icon in the main navigation to represent the sharing aspect of campaign marketing more accurately than the current inbox icon.
This side-by-side input required a popup “lightbox,” and the calendar was still not visible after scrolling.
Subsequent iterations involved a side-by-side format for the post editor but after feedback we decided to make the post editor and calendar have different views, to avoid lightboxes entirely.
The final iteration included List and Calendar views accessible by a sticky toggle, and collapsible editing panels. As a result of feedback from this testing, we also moved the Email Invites page after Social Sharing as it seems less important.
Users are unsure how to get to the Social Media page
Design solution: an information architecture (IA) challenge
Revise the naming and make clearer navigation
The first page Sarah sees after a lengthy onboarding process is the home page. She’s not sure what to do here. It doesn’t look like a home page. She decides to click the orange “Create” button.
This takes her to a lightbox, which is confusing as she expected a page. She guesses, like many but not all interviewees, that “Grow Facebook Fans” is the most likely place for a social media campaign.
We proposed a condensed version of the “Select a Campaign” screen. We also recommended that it should be a page rather than a lightbox.
This takes her to the “Choose Your Promotion” page, and from there to the campaign task flow. The “Choose Your Promotion” page lets a user choose to send out a coupon, provide downloadable content, or set up a sweepstakes.
Taking a step back, we looked at the navigation to the “Choose Your Promotion” page. We revised the “My Campaigns” page to make it accessible not only from the “Campaigns” menu item on the left, but directly from the home page. We added large icons for kinds of campaigns, which are currently accessible only by clicking a “Create” button. Clicking on “Social Media” takes the user to the “Social Media Manager ” page…
…and “Create New Social Campaign” on the “Social Media Manager” page leads back to “Choose Your Promotion.”
Sarah, meanwhile, manages to get through the task flow and her coupon campaign begins. She’s not sure how often she’s going to do this—she thinks the interface is kind of clunky. What’s the big deal with social media marketing anyway?
Users don’t understand the value of SM marketing
Design solution: a UX design challenge
Educate the user by putting campaign analytics and insights on the home page, as well as a visualization of success.
Our interviews and online research strongly indicated that while Constant Contact was not emphasizing SM channels, many small business owners, nonprofits, and marketers saw value in SM marketing.
Small business owner: Peer recommendations help spread our communications to new customers.
Nonproﬁt: We focus on building a personal relationship with our followers.
Social media marketer: When was the last time you sold anything without a conversation?
This led us to alter our hypothesis to: some users don’t understand the value of SM marketing—user education, here, will serve both business and user goals.
Our home page sketches aimed for an exuberant feel to draw the user in: welcoming them by name and showing them the reach and status of their campaigns, with targeted insights. This makes the user feel that Constant Contact has a stake in their success. We also put the “Create Campaigns” functionality on the home page so users wouldn’t have to search for it.
We tested the sketches with users, and found that the full-page analytics were a little overwhelming. Users also wanted to feel that their business was being recognized, not just themselves: not just Sarah, but her flower shop. She has only just created her first SM campaign, so she doesn’t have any data for the analytics. Instead, she would see projected analytics for the kind of campaign she has just run, and insights about how to get the best outcomes.
We kept the excitement of the sketches in our final wireframes, with the personalized greeting and actionable insights. We added an area for some encouraging text about the user’s business or nonprofit and “Help” information.
A clickable prototype is here. Follow the user as they create a Social Media coupon campaign. Scroll down to see the full screens, if necessary.
I’m pleased to say that we’re still involved with the client, and are presenting to a larger Constant Contact team soon.