Office of the New York State Attorney General

Website Redesign — User research, personas, information architecture, content strategy, page layout, design system, documentation, content migration, training

Client: Office of the New York State Attorney General  |  Company: Upside Collective


The Office of the New York State Attorney General (OAG) website sees upwards of 5 million users a year, and serves everyone from New York State constituents, to members of the press, to lawyers and government officials. Their website was close to 10 years old, and the content was organized based on the office’s internal bureau hierarchy, which made content relating to the public very hard to find without knowledge of that structure. They needed a website that better served their users, adopted modern best practices, was accessible, and followed the brand guidelines.

Site Audit, Research, User Personas

Knowing the site was upgrading from Drupal 7 to Drupal 9 (with plans to update to Drupal 10 by the end of 2023), I conducted a site audit to outline existing Drupal content types and review how many pages and documents were in the system.

There were close to 12,460 unique pages, 9,230 of which were press releases.

Using the quantitative data from Google Analytics as well as qualitative data collected from user and stakeholder surveys, I generated 4 unique user personas.

 
A whiteboard sits atop an old piano, notes scribbled across in many different colors. A black and white cat poses in front of the scene.

Information Architecture

In order to dismantle the existing bureau structure, I needed to become an expert on the bureau structure.

This included weeks of studying the 8 different divisions, 45 units and bureaus, and 13 regional offices and how their content was not only managed across the site, but how they were managed internally at the OAG.

Finding threads of common topics spread throughout the bureau pages, I began to identify major topics that users might recognize, such as Environmental Issues and Consumer Issues.

I coined the phrase “hubs” for main topic categories, and subcategories under each main topic as “sub hubs”. This language is now adopted and used internally at the OAG to further separate themselves from a bureau-focused mindset.

 

Site Navigation

The new organization of content under the hub and sub hub structure is present in the Resources tab of the navigation.

Further delineation was needed to differentiate content frequented by individuals versus content frequented by businesses, government, and organizations and thus resulted in a megamenu option under the Resources tab, splitting the categories up accordingly.

I proposed the concept of an “I Want to…” action menu item for common items that the internal OAG public affairs team typically assist users with.

Since the launch of the site, this has menu reportedly become the most useful tool for the staff to direct users to.

 

Design System

Based on the existing OAG brand guideline, I developed a design system that ensured brand colors were being used for appropriate accessible color contrast ratio.

Page Layouts & Components

Expanding upon the visual elements of the design system, I created a small handful of page layouts to correspond with unique Drupal content types based on the nature of the pages for stakeholder sign off. Once we had sign off on the layouts, I set toward finishing the design system by expanding upon the components showcased in the page layouts and generating a comprehensive list of reusable layout components and their variants.

A single image containing examples of many different UI elements from the attorney general design system
 
A collage of screen mockups showcasing various pages in the attorney general website

Documentation, Handoff, Summary

Designs were provided to my development team through a combination of documentation methods, focusing mainly on the use of Sketch Workspace to inspect my artboards and pull code. I created detailed PDF documentation as well that was handed off to the client for any future visual tweaking they may need.

I provided multiple video training sessions for content editors on how to use the Drupal CMS, what the components are, what the content types are, and how to best build a page using the tools we delivered to them.

The website launched March 31, 2023. At the time of launch, we had migrated over 10,550 pages of content and press releases and uploaded and tagged 3,500 documents and publications.

Next
Next

Business Council of New York State - Website Redesign