Design Process
Started with a design strategy to define business goals, target users, general tasks, constraints, marketing / branding goals and critical success factors. The main business goals were to decrease drop off, and increase page views while also updating the visual design.
General tasks were to be able to search and find relevant results and also be able to filter search results. Constraints were the same amount of ad units, internal search keyword system, and desktop/tablet/mobile views. Critical success factors were defined as: decrease drop off by 5%+, increase pages viewed by 5%+, users able to find what they are looking for 90% of the time, and users prefer the new layout and design.
Sometimes when redesigning an old page that has not been updated in awhile, it is very easy to make it function and look better. With old pages things tend to be added to the page without much thought of how it affects the overall page. With this search page, these were definitely the case.
While researching I found a few helpful articles: Site Search: Strategies for No Results Found, UI Patterns For Mobile Apps: Search, Sort And Filter, and Search Results Design: Best Practices and Design Patterns.
I looked to Google (of course), Best Buy, Apple, Forbes, Lowe’s, Target, Twitter, Fox News, among others for my inspiration. I wanted to get away from the old 3 column cluttered page with underperforming modules that did not relate to search, and use the entire page for the focus it should be: search results. Another part of the project was to add typeahead/predictive search. It is still in the works on the development side, since it was more of a nice to have and didn’t make it into the first pass to get things quickly out the door. I went through several iterations to make the business and the users happy.
After launch, with having things correctly tagged for click-tracking, we were able to learn which refine by tools were being used the most and able to sort them based on usage. A project should never by a ship it and forget it, making iterations to better the experience is always a plus.
Before
Iteration 1 of 8+
Live Site
Successes and Failures
I conducted two rounds of usability studies for this search page, which anytime we can get a design in front of users, I consider that a success. Also hearing feedback from real users is the best critique a web designer can ask for. The main things we learned were:
-
AFTER Usability Study: Related Terms placement
Most respondents missed related search terms due to their placement. So I moved the related search terms from the left to the right under the search box where a few users said they would expect it to be there.
BEFORE Usability Study: Related Terms placement
-
AFTER Usability Study: Location & Time placement
Most respondents missed the refine by: location and time due to their placement. So instead of having all the refine by tools collapsed, changed it to have the first one expanded by default.
BEFORE Usability Study: Location & Time placement
- Most respondents after getting no results would go to Google
- Most respondents altered their search keywords before using refining tools
- Why users use the internal search tool: looking for something specific, looking for an article from the print edition
- Most respondents would expect the search engine to correct spelling mistakes
- Most thought there were less ads on the page, even though it was the same amount, this made me very excited
- I hypothesized that moving forward with the suggested improvements would lower the bounce rate
Usability Report
Here’s the official report I put together (leaving out a things for confidentially agreement):
Executive Summary
On Wednesday, April 2 and Thursday, April 3 2014, the American City Business Journals User Experience team conducted a remote usability study led by Amy Henty, CUA. The purpose of the study was to collect information from users about the search functionality of bizjournals.com on desktop and mobile devices. Henty and team spent 2 days speaking with 7 users from different markets across the U.S. about their use of search, their ability to find what they were looking for on the live site, and comparing the live site to new concepts.
Top Learnings
- Most respondents found no relevant results on our sites
- Most respondents after getting no results would go to google.com
- Minor tweaks needed for mobile and desktop concepts
Moderator: "Did you find what you are looking for?" Respondent: "No"
Moderator: "What would you do next?" Respondent: "Go to Google"
Positive Feedback
There were a few areas in which feedback was positive for ACBJ search:
- Live Site: Most respondents thought the search box stands out well in the top navigation
- Mobile: Most respondents thought the search results display was well designed
- Concepts:
- Most respondents preferred the display over the current site and thought the display was nice and clean
- Most respondents thought there were less ads on the page, even though it was the same amount as the current site
Respondent: "I am all for removing ads but yours don’t seem to get in the way… Like the banner at the top is not offensive to me. You did good. You did good."
Improvement Opportunities
- Live Site:
- Most respondents found no relevant results and would leave the site
- Most respondents expect for the search to correct their spelling mistakes and/or have an option for “Did you mean?”
- Most respondents did not use the “refine by” filters, instead altered their search term
- Most search terms did not display correct related search terms
- Some respondents would like the option to see regional results
- One respondent mentioned several times that they would like to see a dynamic search in the drop down like google
- On a scale from A-E, respondents graded the current experience as a C
- Mobile:
- Most respondents could not find search quickly
- “No results” page has no content
- It was not always obvious to users that they were getting search results based on their search term
- On a scale from A-E, respondents graded the current experience as a B
- Concepts:
- Most respondents missed where the related search terms, location and time were displayed
- Some respondents would benefit from one of the refine by sections being expanded
- On a scale from A-E, respondents graded the concepts as a B. Some said that if it gave them the results they were looking for, found related search terms, location and time the grade would improve to an A.
Conclusion
The technology that powers ACBJ search, needs to pull in better search results to meet users’ expectations. It may be worth investigating alternatives to get better results. Features such as spell check, “Did you mean?”, better related search terms, and a dynamic search drop down will better the users’ experience. Making some minor tweaks to mobile will also better the user experience. With slight modifications based on respondent feedback, the concepts will be a perceptual improvement by users regardless of technical adjustments.
Search is one of the highest ranked site section for page views. Over the last 6 months 57% were exiting the site. The UX team hypothesizes that moving forward with the suggested improvements will lower the bounce rate and result in both more page views (inventory) and more PV/V (engagement).
Recommendations
On mobile the tweaks have already been made. The display of search was made more obvious to the user in the drop down menu, added content to the no results page, and highlighting the search terms within the results.
The internal search technology needs an update from Operations, so Development can work on experimenting with new features and configurations to get better search results and related search terms. The UX team recommends moving forward with the concepts. Visual improvements can run parallel to and independently from core search functionality tasks.
Design Outcome
The goals at the beginning of the project were defined as:
- Decrease drop off by 5%+:
- On average, it has dropped 6.5% since the redesign, I was excited to see that number. Which means happier users getting to the content they are requesting, more page views, and ad impressions.
- Increase pages viewed by 5%+:
- Unfortunately, pages views have decreased since the redesign. Pages were not properly indexed with google causing the drop. This was a huge lesson learned to work more closely with the SEO-Analytics team. The page views should increase with time.
- Users able to find what they are looking for 90% of the time:
- During the usability study, respondents were not finding what they were looking for most of the time from the results due to poor technology that will only get better as development works on it more.
- Users prefer the new layout and design
- During the usability study, respondents were positive about the new layout and design.
I am excited that we are currently moving forward with typeahead/predictive search that is in development to get users to content quicker with less effort. I am sure we will learn even more as we move forward. And as the site goes responsive we will be able to combine the desktop and mobile experience even more.