Insperity Business Blog Redesign
UX Designer
Insperity
Feb 2017 - May 2017
THE CHALLENGE
Identify the problem without a channel to talk to the users directly.
Balance the business goals with user goals.
THE OUTCOME
A renovation of Insperity's business resource center that provides valuable learning materials and engaging reading experience.
THE IMPACT
in average pageview
20%
253%
250%
in blog subscribers
in e-book downloads
UX
.png)
Due to company policy, the data presented in this case study reflects only trends, not actual numbers.
The Problem
The Business Blog Subscription Rate Hit A New Low Point
Insperity business blog converts ~10% of its subscribers into sales leads each year, but the company has struggled to increase blog conversion because fewer and fewer visitors choose to subscribe to the blog. When the subscription rate hit a new low point, the team urgently wanted to turn things around.
Quantitative Data Reveals How Visitors Interacted with The Blog
Site flow data showed that individual blog posts attract the most visitors. The blog homepage is no more than a connecting point.
Heatmap data (left) showed that only 5% of the visitors scrolled to the bottom of the blog post, and mouse movements (the red line on the right) indicated that visitors are not interested in any side rail content but the blog post.
Qualitative Data Reveals The Why In The Observed Data
I was eager to talk to users to understand what motivated their behaviors, but I was guided not to contact visitors due to company policy.
So, I got creative: I created a feedback poll on the site that allowed me to gather user feedback without talking directly to users.
Through the feedback poll, I asked 3 questions to understand visitors' motivation and their pain points:
1. Why did you come to this page?
2. What do you like the most about this page?
3. What frustrates you the most about this page?
Answers showed that visitors enjoyed the content. Their frustrations focus on the interruptions they got when reading a blog post.
"I really enjoy your content, please keep up the good work!"
“Please turn off the popups. I am trying to read here.”
“...I don't mind seeing it [popup] once, but not EVERY TIME.”
Merging all the data from Google Analytics, Hotjar, and blog visitors, the team generated a hypothesis.
Promotional pop-ups force visitors to exit the page
Visitors come to the blog for the content, but they can't tolerate the constant interruptions from promotional pop-ups. The experience of the blog is not compelling enough to convince visitors to stay, needless to say subscribe to it.
Best Practices in the Market
Research on blog design best practices allowed me to see the problem from a different perspective. Now that blogging becomes a common medium for knowledge sharing, readers don't have to tolerate bad reading experience to gather information. Blogging sites like Medium (left) demonstrate what an engaging reading environment can be, and even conversion rate focused business like Hubspot (center) and Moz (right) renovated their blog to focus on delivering good content, not forcing sales pitches with constant popups.
Users expectations are evolving and becoming more sophisticated and demanding. We need to keep up.
Refined Problem
Create an engaging reading experience that allows visitors to focus on content
The Concept
Reading without Interruption
Partnered with our front-end developer, we listed out all popups and their show-hide logic to reexamine their value.
We had three types of popups shown on the page:
1. Subscription pop-up
It appears when a visitor lands on a blog post. Its conversion rate is the highest among all pop-ups
2. E-book download pop-ups
An e-book recommendation pop-up shows up a few seconds after the subscription pop-up. The content of this pop-up is not necessarily always tied to the blog content.
3. Exit pop-up
It appears the second the cursor moves outside the upper page boundary. It has a conversation rate that is less than 0.05%.
According to various marketing case studies, these popups should increase blog conversion rate. But a lack of strategy defeats the purpose.
The team looked back on how visitors interacted with the blog post and presence of these popups to align with the context:
1. Visitors decide when to subscribe.
We significantly delayed the show-up time of the subscription popup to when a visitor would typically finish reading a blog post.
2. Treat e-books as educational materials, not promotional pieces.
Before, we randomly linked an e-book to a blog post regardless of their content, hoping visitors would find it useful. Now, partnered with two copywriters, we categorized all the materials into buckets and connected them to related blog posts. Hence, if visitors were looking for more on the same topic, we would be able to present related content to educate them.
3. If visitors want to leave, let them leave without any resistance.
Though from a business standpoint, exit popups have proven to be a good method for growing subscribers. I fought for the idea of eliminating the exit pop-up since we saw neither any noticeable return, nor did it provide any value to the user experience. The management team agreed to put it to test for two months.
Reading without Distraction
Blog design best practices made me wonder if we should explore a cleaner layout for the blog. I went back to the data to help me form design decisions and the data showed that on any blog post, content on the side rails rarely got any attractions. On the other hand, when browsing on the blog homepage, visitors mainly focused on the content list. We decided to revamp the design for both the blog homepage and blog posts.
For the blog homepage:
1. Demonstrate authorship with the author's profile picture (in green)
A profile picture makes the content more relatable from a human perspective. It also allows readers to develop trust in the content.
Before
After
2. Display more information
The new homepage uses a two-column layout so that visitors can scan through more content with less scrolling.
For individual blog posts:
1. Reinforce authorship with the author's profile picture
2. One-column content without distractions
The team removed the right rail information to create a more engaging reading environment. We also redesigned the social sharing list to make it less prominent.
Blog Homepage
Individual Blog Post
User Testing Reveals What We Missed
I reached out to 32 employees at Insperity to help verify the direction in which we were heading.
The team created a sandbox with the new design, including a blog homepage and a few blog posts. Dividing the participants into two groups, I asked the first group to use the current blog to read blog posts in which they were interested, while the second group used the sandbox to do the same thing. I then followed up on their reading experience.
The first group kept jumping back and forth between the blog homepage and different blog posts without finishing one. Their feedback was the same as blog visitors: pop-ups broke the reading momentum and made it hard to focus on the content. The second group spent significantly longer time on selected blog posts with half of them finishing at least one blog post.
“I remember the blog post used to have a few popups showing up during my reading. I found them a bit annoying. Now it's much easier for me to finish the post."
However, during testing, I noticed that more than half of the testers zoomed in after they landed on a blog post. Apparently, the team overlooked site legibility, which is also a major part of the reading experience.
"It's difficult for me to read if I didn't zoom in."
After another round of research, design, and testing, the team decided to increase the body font size to 18px.
Exceeding Project Scope
By examining page view data, we discovered that e-book download pages and magazine pages also attract a good amount of traffic. Moreover, visitor behavior flow showed that more than 60% of the visitors jumped between blog posts and e-book download pages. To provide a consistent reading experience, we applied the idea to all other sections within Insperity resource center.
E-book Download Page
Infographic Page
Case Study Page
The Outcome
One Reminder. No More Interruption.
When reading a blog post, visitors will only encounter one subscription popup at the end of the post. They can either subscribe to the blog if they find it helpful or leave without any resistance from the page.
Before
After
Clean Layout. No More Distraction.
The new blog post uses a cleaner layout so that visitors can focus on the content.
Old Blog Post
.png)
New Blog Post
Not Just Read the Content. Trust It.
Adding the author's profile picture not only humanizes the business but also help visitors develop trust in the content. Visitors tend to be more willing to learn when they find the content trustworthy.
Old Blog Homepage
.png)
New Blog Homepage
The Lesson
Making Decisions between Business Goals and User Goals
Have worked in both the Marketing and IT department, I found that I encountered more constraints in the marketing department and felt frustrated when a business goal was discussed without understanding user goals.
But then I saw it from a different angle: both UX and marketing are serving the same purpose: generate revenue for the business, and the only difference is the perspectives.
The marketing department focuses on attraction, including promoting the business, which may cause people to overlook user goals. And that is where UX comes into play, to communicate the value of UX and help drive business decisions.
On the other hand, a positive user experience is worthless if it does not culminate in sales. And it is important to ask ourselves when designing for users: what value can we bring to the table so that customers will be happy to stay as a customer?