Respect the Process: A UX Case Study about improving access to garbage collection schedules on NYC.gov

Kaye Kagaoan
Prototypr
Published in
8 min readDec 23, 2018

--

When NYC.gov was redesigned four or five years ago, it was a hit that was praised for setting a new standard for government websites. The website was overhauled from the ground up, from its visual appearance down to the nitty-gritty of its information architecture. With an audience of 35+ million visitors per year, the website is a one-stop resource for all kinds of New Yorkers, from residents to businesses to educators to visitors. You can file a noise complaint, pay for a parking ticket, apply for a civil service job–all in one place.

The Brief

For the Information Architecture unit at General Assembly’s UX Design Immersive, I had the lovely task of redesigning NYC.gov to make Garbage & Recycling collection schedules easily accessible for New Yorkers. Users should be able to access their collection schedules, know which garbage to bring out on certain days, and add pick up dates to their calendars.

This was an individual, one-week project where I was responsible for:

  • performing a competitive & comparative analysis,
  • performing a heuristic evaluation using Abby’s Method,
  • creating a visual sitemap using Sketch (that was painful),
  • conducting a partial content audit,
  • perform one round of card sorting and one round of tree testing via Optimal Workshop,
  • annotating a revised sitemap with my proposed solution,
  • designing new user flows, mid-fidelity wireframes, and a clickable prototype for desktop (web), and
  • presenting my findings to the class.
We deserve better.

**Important Note on the Scope of this Project**

I’m pretty sure this was an old assignment from before the site was redesigned, so we were asked to ignore the super-helpful NYC 311 widget on the home page. I also acknowledge that the DSNY website was recently redesigned and comprehensively displays garbage & recycling information much better than the main website.

For the purpose of this assignment, I focused on the user flow of getting to garbage & recycling collection schedules from the NYC Resources tab on the home page.

Defining the Problem Space

Here’s a partial site map of NYC.gov(the green boxes are where you can find the trash day info):

And y’all thought the MTA was a mess??? I had to post a screenshot because the JPEG file was way too big, and my attempt at resizing the image nearly crashed my computer.

So yeah. Problem space: The Official Website of the City of New York is a damn mess.

Opinion: New York City is better than Boston, so our website should be, too.

As a Yankees fan, I feel strongly about this.

Have you seen the new Boston.gov website? IDEO redesigned it last year and,naturally, it’s beautiful. While conducting a comparative analysis of finding garbage & recycling collection information among city websites, Boston’s “citizen-centered” website was the one to beat. Their Trash & Recycling Guide is one click away from the home page.

Let’s zoom in on our NYC site map, shall we?

“1.1.5.3.2.28.1" aka the 1st link after the 28th link after the 2nd link after the 3rd link after the 5th link after the 1st link after the 1st link from the home page.

On my NYC.gov sitemap, the “Collection Schedule” page is labeled “1.1.5.3.2.28.1,” a.k.a. the first link after the 28th link after the 2nd link after the 3rd link after the 5th link after the first link after the first link from the home page. That’s about 6–7 clicks, including a very long scroll through 70+ articles about literal garbage, that redirects users to another part of the city’s website that most people don’t know exists!

There was a shorter way to get to that information, but you had to find a link to the Department of Sanitation website through the directory of NYC agencies, which can be found here and here. Did you know the City of New York has 138 agencies? The DSNY link (“Sanitation, Department of”) is the 119th item on each list.

Based on the site map and current user flow, I knew what had to change. I just had to make sure I was making the right changes.

The “Bread-and-Butter” Stuff

Another note about this project: some former UX students at GA refer to this project as “The Mountain,” because of the number of deliverables we had to submit in one week. Our instructors referred to the content audit and heuristic evaluation as the “bread and butter of UX.” They weren’t conceptually difficult, but they were definitely time-consuming. And we didn’t have a lot of time.

WHO WILL WIN???

At some point during this project, I found myself nearing another meltdown, so I reached out to a UX designer-friend in the agency space about the actual relevance of the mega-tedious partial content audit I was working on. As someone who hopes to enter that space one day, I had to ask her: Did any of this matter? Her response:

I feel like I do audits every week.

Okay, then.

So I buckled up, downed a shot of espresso, and chipped away at the partial content audit (which you can see here, if you feel like it). I’d be lying if I said I was thrilled about this part of the process, but it is a part of the process. In my last case study, I wrote about respecting the UX design process–I was now dealing with those post-honeymoon period blues, and getting a better glimpse of UX design’s “true colors.”

But as each tedious step of the process begins to reveal its purpose, the solutions seem clearer and stronger, and I remember why I’m doing this in the first place. Big-picture thinking helped a lot here.

Re-Organizing a Behemoth: Card Sorting and Tree Testing

If you’re not familiar, card sorting and tree testing are UX research methods that help designers understand how effectively we’ve decided to organize information.

In the context of the NYC website, I wanted to take all the Garbage & Recycling content out of its parent “Environment” page and make it an independent category. Card sorting and tree testing enabled me to confirm whether I’ve decided to put certain information under the right categories.

Using a tool called OptimalSort, I conducted one round of “closed card sorting,” which means I assigned categories beforehand and asked 8 of my NYC-based friends to assign 30 different “cards” to one of those categories. The results matrix for my first attempt at card sorting looked like this:

Categories are columns, cards are rows, and numbers indicate how many people (out of 8) put a card in that category.

Based on these results, I learned:

  • which kinds of information people associate with residential and commercial garbage
  • “donating goods” was probably phrased too vaguely, since I was specifically referring to disposing of used clothes via donation (TIP: Label your cards clearly!)
  • people don’t necessarily understand the phrase “bulk item” (i.e. mattresses, couches, furniture, etc.)
  • I could probably get away with replacing the “Office of the Mayor” tab in the primary navigation with a more general “Government” tab, and people would know what to find. Sorry not sorry, DeBlasio, the research said so!

The card sort gave me some insight on how to organize the new website’s navigation, which I was able to test using a tool called Treejack. Through a method called tree testing, I asked another batch of NYC-based friends to click through navigation links to accomplish ten different tasks. I loved tree testing because it helped me realize how I should name and organize the new pages in my redesign.

When I asked users to find their trash and recycling collection schedules, users were 100% successful. The chart looked like this:

A boring graph is a Good Thing.

When I asked them to find the page that would contain mattress or bulk item pick-up information, two people chose the wrong page:

A semi-chaotic graph is still a Good Thing because you get INSIGHTS.

Based on this test, I realized that renaming “bulk item” as “large item” wasn’t good enough. That had to be clearer in the redesign. No wonder there are so many moldy couches on the sidewalks.

Bringing It All Together (The Fun Part!)

Presenting: a smarter, more user-friendly Collection Schedule page you can access straight from the home page!

Here’s what I proposed for the redesign:

  • Clean up the home page and use a giant, predictive text search bar that directs New Yorkers to the information they need.
  • Add Quick Links to the home page, and include a link to Garbage & Recycling information.
  • Separate the Garbage & Recycling information from the Environment category, and consolidate information using fewer pages.
  • Once users have looked up the collection schedule for their address, they should be able to understand which kinds of garbage and recyclables to bring out. And they need to know what the heck “bulk items” means. (I used a tooltip on click/hover.)
  • Allow users to download the schedule to Outlook, Google Calendar or iCal, instead of adding to digital clutter through yet another mobile app. This city already has so many apps. The MTA alone has too many apps. Do New Yorkers need a garbage app when we have calendars?

Revised User Flows

Wireframes & Prototype

If you’re on a desktop, you can check out the mid-fi wireframes and clickable prototype here. Feel free to follow each of the user flows above and click around. It’s not mobile-friendly at the moment, but I’d love to redesign this experience for mobile when I find the time.

Is it better than Boston.gov? Maybe not, but it’s the best I could come up with in one week. And I’m only three weeks into this UXD program!

What I Learned, and What’s Next?

I may not have shown it, but this project was an emotional rollercoaster. Still, I learned to respect the tedium of laying out a site map and performing a content audit during a website redesign. They may be the less glamorous parts of the UX design process, but they are there for a reason, and your work will be much better for it.

I also learned that language matters, especially when it comes to information architecture. I’ve always believed in the general value of the words we use, but it’s amazing how much a short round of card sorting or tree testing can reveal about the way people think about words and nomenclature. As UX designers, we are responsible for helping people make sense of the world, so specificity and clarity are more important than ever!

And I learned that designing for everyone has its tradeoffs, but we should still strive to delight as many people as we can. With its massive annual audience and near-infinite use cases, the NYC website‘s information architecture will probably be a mess for a long time, but there will always be ways to make it better for every kind of New Yorker.

How did you like this post? Let me know by reaching out on Twitter.

If you’re hiring in New York: I need a job! You can check out my portfolio at kayekagaoan.com.

--

--

Lead UX Designer @ Suzy, Accessibility-certified (CPACC), eldest daughter-turned-immigrant 🇵🇭🇺🇸