Georgia.gov Redesign Case Study

Scope:
Personas, Mood boards, Content strategy, Search redesign, User research, Data analysis, Card sorting, Information architecture, Wireframing, Usability testing, Responsive design, Visual design, Front-end development

Timeline:
1 year, 2011-2012

Members:
Nikhil Deshpande, Peter Lee, Christina Lingga, Kendra Skeene, Pooja Berrong, Noralil Fores, Jenna Tollerson, Venkat Adusumilli, Marc Xu, Andrada Erdoss, Kelly Sheffield, Donna Merit

Background

Georgia.gov is the main website for the state of Georgia. Each year, about 5 million people visit the site, accounting for almost 16 million page views. In the past, citizens browsed the site by topic and found links to information on other state websites.

The site went live in 2002, but except for a refresh in 2006, it’s never had a major redesign. Ever.

Back in 2002, the site was designed to be like the old Yahoo! - just click around, and you’ll eventually find what you’re looking for. But state government is too big for that, and as Google replaced Yahoo as the tool of choice for web surfers, we knew we had to totally rethink georgia.gov.

The Georgia.gov homepage before our redesign.

Methodology

With the redesign, we wanted to do something different. Something that hadn’t been done before. And we wanted to redo everything, not just give it a facelift.

So we looked at every aspect of Georgia.gov — content, search, information architecture, platform, and design. What wasn’t working, and why wasn’t it working?

We had our ideas, but we wanted our decisions to be based on real data. We gathered data from lots of areas:

  • Website analytics;
  • Site search statistics;
  • Georgia.gov customer satisfaction survey
  • Information from the 1-800-georgia call center.

The findings:

  • Citizens came to Georgia.gov looking for information that affected them personally - financial support for their children, copies of birth and death certificates, and jobs.
  • They couldn’t find what they were looking for. The structure of the site was outdated, which caused citizens to bounce around the site, according to web analytics.
  • Trying to meet everyone’s needs, we tried to link to every possible bit of information out there. The result: Long lists of links that were difficult to go through.
  • Bad content on other sites. Even if we got citizens to the right place, there was no guarantee that the information there was up to date and accurate.

The Solution

After pouring over blogs, presentations at major web conferences, and the latest research in usability, search, design, and content strategy, we came up with a few fundamental rules:

  • The Long Neck rules, not the Long Tail.
    We can’t meet every citizen’s need. In January 2011 alone, citizens searched for 25,000 different terms ranging from drip irrigation guidelines to the Advance Healthcare Directive. If we can serve 80% of the citizens with 20% of the content, it gives us an easier task.
  • Simplify.
    We knew our home page was too crowded and content heavy, but we aimed to simplify the design and content as much as possible. As mobile strategist Luke Wroblewski told Forbes magazine, “I hear it over and over again, ‘The mobile site is so simple, I wish the desktop site was that easy.’”
  • Holistic approach.
    We had to start from scratch, keeping nothing from the current site.

Search

As we mentioned before, the old Georgia.gov relied heavily on browsing. Each link to an agency service or content was organized in a special hierarchy. But more and more people are searching for information instead of browsing for it. And for something as big as state government, we knew our search had to carry the users’ experience.

Georgia.gov uses the Google Search Appliance, and like its mother company, the appliance is very good at searching. In fact, it’s too good. Searching for something like “child abuse” yields 30,900 matches.

We needed something a bit more intelligent. So we designed a search that would allow us to promote certain content for keywords and synonyms. For instance, a user searching for DMV will get a match for the Department of Driver Services, since that's what the Department of Motor Vehicles is called in Georgia.

We also noticed that people may be looking for different kinds of information. Some people who are searching for “Child Support” may want to know how to file for child support, while others may be looking for the online service to check on the status of payments. So we organized search results page based on the type of information - online services, agencies associated with that search term, and popular forms. 

Layout

“If something is on the screen and people aren’t clicking on it, we remove it.” — Steve Hafner, CEO of Kayak

Our old design tried to be all things to all people. We crammed as much information on the page as possible and hoped people would eventually find something that pertains to them.

But according to usability guru Jared Spool, the top five links on Walgreens' home page added up to 59% of the total traffic, but those links took up just 3.8% of the page. Users had trouble finding the links they were interested in because they had to wade through all the stuff Walgreens thought they were interested in.

We decided to do the same thing. Using a service called Crazy Egg, we were able to see what users were clicking on.

The results were stunning:

  • Child Support received 31% of all clicks on the front page of Georgia.gov, but the words in the Child Support links took up about .49% of the real estate.
  • Search was used 13% of the time but took up just .65% of the page.
  • Jobs received 10.9% of all clicks, but four links took up only .43%.
  • In contrast, the Headlines feature took up 18% of the page but received only 3.6% of clicks.

Jared Spool and the Crazy Egg study opened our eyes to the realization that screen space was valuable, as was our users’ time and patience. We began laying out the front page with a few rules in mind. The fewer words, the better. We allowed for lots of white space. We made search bigger, took away the Headlines from the front page and moved our features to a less prominent area of the page. If it wasn’t important, it wasn’t going to be on our home page.

Content

In the past, georgia.gov had simply pointed the way to information on other websites. But given our new focus on search, we had to make sure that users found the right information quickly.

There were two problems with this approach:

  • We couldn’t control the search results from websites that were not hosted with us via keywords and metatags;
  • There may be more than one agency (or search result) with information about a topic. For instance, someone seeking information on starting a business may need information from the Secretary of State’s office and the Department of Revenue.

The solution was to create our own content. We could show users the information they needed to see, direct them to the agency website for more information, and show associated forms, services and documents. And by having access to keywords and metadata, we could also control how the content appeared in search results. Instead of seeing irrelevant content appear at the top of the search results, we could steer users to the right content.

We scoured search logs, call center data and site analytics to find the 50 most popular topics requested by Georgians. We worked with the agencies that dealt with those topics and wrote summaries of each topic.

The topics contained consistent information:

  • Overview
  • What citizens needed to know
  • FAQs
  • Associated agencies, online services and documents

We also created pages for each state agency, also complete with consistent information, as well as pages for each city and county in Georgia (over 600 total).

Responsive Design

We wanted to do something special with Georgia.Gov — something that no other state site had done.

This is important for two reasons:

  • Based on our statistics, our mobile users quadrupled in 2011, which accounted for 5% of all visits. From January to February 2012 alone, it doubled to 10% of all visits.

    At the same time, our site is accessed by 191 devices and 86 browsers at 1,750 different resolutions. We knew that we had to accommodate the fast changing trends in devices and browsers.
  • Our “content first” motto would not work unless we took into account how these devices were accessing our content. For instance, mobile users would care more about searching for a specific task than desktop users, who would have the time and the screen space to browse using a menu.

Responsive design allows the site to resize and reorganize itself based on the browser and device. We designed the site to accommodate three common screen widths:

  • Large desktops (960px and above)
  • Small desktops & tablet portrait (740px to 960px)
  • Mobile (Below 740px)

For mobile users, we reordered some of the functionality, moving search to the top of the page and sending the navigation to the bottom. Why? Because users don’t want to navigate, waiting for each page to load and then clicking on something else. They search.

Testing the Look

We didn’t design in a vacuum. User testing played a major part in the design process, helping us gauge how well we were meeting users’ expectations.

To test the new design, we conducted a 5-second test in which users were given a snapshot of the front page for 5 seconds, then asked a series of questions about what they thought the site was about, what types of feelings it conveyed, and what they noticed about it.

We knew we were on the right track with the simple approach and the emphasis on search. But users thought it was too blue and too plain.
Our second iteration got a better response. With just a few more tweaks, the design was ready.

Usability

We paid close attention to usability during the whole design process, paying attention to detail:

  • We added “search as you type” functionality to help users find relevant content more quickly.
  • Popular topics were worded as a call to action; instead of “child support,” the link read “Get Child Support”.
  • Links looked like links - blue and underlined - and were consistent throughout the site.
  • Long lists of content - the 600 cities and counties, the 120 agencies — can be filtered through a search box. As you type, the number of terms is filtered based on your input.

We put the new Georgia.gov site in front of users and asked them to find information to see how they interacted with the new site, whether it improved their user experience, and note any problems. 

The first user noted that our suggested search results looked like the paid searches that Google shows, so they wouldn’t click on them. We changed the styling to make it more like the regular search results.

IA

Information architecture, or the structure of the website, was now taking a back seat to search. We joked that the new Georgia.gov would just have one big search field — no menu, no navigation.

Of course, we can’t do that. Yet.

We use menus to direct users toward the most commonly used pages on Georgia.gov, such as Agencies, Cities and Counties and Popular Topics.

Design

Most people think of design and layout as very subjective, based on the whims of a few art students who throw something together at the last minute.

Far from it. Our design decisions were based on careful research, testing and analytics.

We began with personas — creating imaginary people who we thought were typical users of Georgia.gov. We quickly discovered that, unlike other products that have a niche or a target audience, our users were the entire state of Georgia. Urban and rural, rich and poor, young and old. How could we be all things to all people?

We discovered that in spite of the all-encompassing aspects of our task, there were some basic concepts:

  • Friendliness. In spite of the size, we wanted government to possess small-town values and treat citizens as a person, not a number.
  • We wanted to point the way, and then get out of the way. Signs at airports are good at being clear and concise, with its fresh, modern fonts. Georgia.gov needed to show as little as possible while conveying as much information as the user needed.

We didn’t want to fall into the regular Georgia cliches. That meant no peaches, peanuts, Gone with the Wind references, state outlines, or state seals.