My design approach & redesigning local government websites

My design approach & redesigning local government websites

At the Code for America Summit this year, there was a great emphasis on redesigning state and local governments’ digital front door – their website.

My ‘quick and dirty’ design approach is as follows: discover, envision, create. Using an example of improving the design of a 311 site, I will walk you through the process.

Discover

First and foremost, it’s about discovery and understanding users’ needs. This phase can include a heuristic analysis. This can be quick and dirty but it allows you to have a baseline understanding of the website. The heart and soul of discovery is user and stakeholder interviews through qualitative research methods (e.g. ethnographic research). Developing personas and journey maps is the means to diagnosing and communicating user needs and behaviors.

As an example, I envisioned a future design for a 311 website for a local government in a 3ur afternoon. To start it off, I wanted to be intimately familiar with the current site – using Nielson Norma’s heuristic evaluation principles. I documented the immediate problems with the site – both UI and UX. I noted that the primary user goals were hidden (e.g. finding city services), call to actions were not prominently on the landing page, and there was a lack of visual hierarchy and consistency across devices.

Then, I thought through the potential users of 311 and mapped out users across 2 dominate variables. For example, residents include the vigilant neighbor – who is highly engaged in his community and usually has simple issues to report to 311. There would also be personas for business owners, and residents. I also designed a journey map for the vigilant neighbor for when he has to report a recurring theft and damage to a car on a residential street. 

Envision

This part of the design process includes defining the improved experience – the product vision and the strategy. This also can include more tactical activities, such as future-state journey mapping and task analysis to help you find the opportunities to improve and streamline the experience.

For me the product vision was easy. The 311 website should be citizens’ first choice to report non-emergency issues and complaints, check statuses, and find more information related to city services. This beautiful and functional website will empower users to be engaged stewards in building stronger communities.

The design tenets should be:

  • Efficient – the user completes their action quickly and effectively
  • Simple – the user can move through the site intuitively while feeling confident in their actions
  • Beautiful – the user is delighted by the experience on the website with a UI that can last technology change
  • Purposeful – the design of the site is intentional and consistent

The target group would be frequent users who are engaged in their community and business owners who are starting their business. The current website is difficult to navigate and deters citizens from engaging with city services. The improved product should be a responsive website, feasible to design and develop, and surpass its’ competitors in the market in functional design and usability. The site will align with the city government’s goals to be a more equitable city where all people can contribute to and share in the success and growth by facilitating their improved actions with the city.

One thing that this city did not have publicly available was the data. Qualitative information is always more powerful when coupled with quantitative data. If I was able to examine the data, I would want to know frequency usage metrics on the 311 website. In New York City, the largest 311 center with more than 28 million customer contacts in 2014, allowed for open data so everyone can analyze service requests from the city ranging from noise complaints to dangerous situations. Data will allow you not only to put the most prominent services on the home page, but also allow you to see where you can centralize services and cut out unnecessary steps for the user. 

Create

Lastly, it is critical to start designing a prototype and constantly testing it with users – from paper prototypes to high fidelity designs. The users will show you where to make changes.

My designs, using Sketch, included a landing page with a large search box as the primary call to action: ‘what can we help you with today?’. The second half of the page is large areas for the frequently accessed services – in grid format (e.g. submit a request, check status, make a payment, etc.)  At the bottom of the home page, there are categories of user types which will lead the user to customize services based on if they are a resident, business owner, or visitor.

Then, I moved to submitting a request, always keeping in mind my vigilant neighbor persona and journey map. I also designed a brand new profile section for frequent users – where they can find their report history and can easily check status. They can also have data from their neighborhood at their fingertips so they can easily have a pulse on their community.

 

What if you can't do it all?

Sometimes a complete overhaul of a website is not in the cards – whether it is because of time, money, and/ or skills.

Start with content. This can be as simple as the language on your website. Hemingway (http://www.hemingwayapp.com/) editor helps you simplify text and content into plain language. 

Other thoughts on best practices

At the Code for America Summit, multiple cities and states discussed how they have sarted to make changes to their mission critical IT. Here are some of the tips and tricks they highlighted:

  • Partner with the communications team
  • Gain leadership buy in so you have champions
  • Determine how to scale upfront in your strategy - especially when there are over thousands of websites
  • Reach out to the local community – feedback is not enough, it’s important to build with the local commmunity
  • Put the data team at the center of the digital strategy