Architecting for simplicity and meaning: Shopify reports, a case study

Virginia Start
Shopify UX
Published in
5 min readJan 4, 2017

--

This blog post is based on the IA Summit talk Kylea Parker and I gave in Atlanta, Georgia on May 6, 2016.

What do you do when you’re faced with an information architecture (IA) project that feels way over your head? Last year I was faced with this problem when my team was given the task of improving Shopify reports for over 250,000 merchants. We had reports spanning several categories: from payments and taxes to conversion and traffic, and each could be filtered in multiple ways.

The good news? Having come out the other side (after shipping our finance reports and redesigned reports index), I know that it’s possible to turn a complex IA project into an approachable IA project.

Here are 5 steps that helped us make Shopify reports more approachable for our team and our merchants.

1. Round up your information

Before I can make sense of any mess, I need to immerse myself in that mess.

A good place to start is by looking at the information that already exists in any user experience. To do this we took something called a bus matrix, which our data friends handed over to us, to understand how the dimensional modelling was architecting our existing reports.

But if you’re like me you’re probably thinking: what the heck is a bus matrix and what is it actually telling me. Essentially, it described all the ways our merchants could slice and dice our reports.

Assess your existing information architecture.

So whether it’s dimensional modelling that’s buried under the surface of your product or a list of contacts that need to be categorized for better discoverability, start by rounding up the information that already exists and take time to understand how it’s architected.

Tip: If you’re starting out on a brand new project with no legacy information, start by defining user tasks, or conduct a competitive analysis to see what information exists in similar products.

2. Map out high level information relationships

Once we had a grasp on how our existing reports were architected, we started to rip them all apart and break them down into information objects.

In this case, our information objects were report types. Consider a tax report. To define it, we described it with metadata like the location of the store and the products it sells. These pieces of metadata started to shape the report into a definable information object that was meaningful to our merchants.

Define high level information relationships.

As we started to define our information objects, we also thought about how they would talk to one another. We mulled over questions like:

  • What are our report types and how do they support our merchants’ top tasks?
  • How related are our categories? Is products just a filtered version of sales or are they truly different?
  • Should we cross-link between categories?

But when we started doing all of this information mapping, we fell into the trap of defining every piece of information to the Nth degree. Don’t do this. Instead, do just enough mapping.

3. Start small

Looking back on it, we really just needed to get a feel for what the information landscape looked like for our new reports. Instead of mapping everything at once, we should’ve defined our high level categories and then fully mapped out just one or two of those categories.

Think big, start small.

The category we decided to tackle first was finance reports. It was a nice amount of work for the team to start with, and most importantly, it was a real pain point for our merchants.

Tip: Ditch your spreadsheet and try using a mind mapping tool like mindmeister to communicate information relationships.

4. Get it in front of users

When we felt we’d hit a wall with our mapping, we handed it over to our merchants.

This doesn’t need to be a lengthy or complex research study. We threw together a quick tree test (my go to is Treejack) to get feedback on how we’d grouped our information.

We also met with accountants to pick their brains about the organization of financial information. Their wealth of knowledge saved us oodles of time and helped us further simplify our IA. Again, this doesn’t need to be fancy. We literally took mockups sketched on paper and sat down with them to see what they thought.

Talk to subject matter experts.

Tip: If you really don’t know how to start organizing your information, hand it over to your users to categorize. You can do this with a card sorting exercise.

5. Implement in increments

The reality is, especially with big IA projects, you’re not likely to ship the entire thing all in one go. And you shouldn’t.

Doing this IA project in phases helped us layer in complexity for our team and our merchants. We had to remember that many of our merchants had become really good at navigating our old reports. Even though it wasn’t efficient, they knew exactly what 7 things to click on to do their end of day reporting.

Don’t pull the rug out from under your users.

By focusing on finance reports and rolling those out to our merchants before anything else, we not only gave ourselves something manageable to work with, but also allowed our merchants and their employees to adapt to a new experience.

Are you working on a complex IA project?

These are just a few things that helped us transform a complex IA project into an approachable one. If you have other tips and tricks, give me a shout. Or just come on over and join the Shopify content team as we solve other tangly IA problems!

Shout out to all of the wonderful UX team members, like Alëna Iouguina, Alyse Adlard, and Sarah Folkes, who have also worked on simplifying the Shopify reports IA.

Navigation illustration by the oh-so-talented Ryan Coleman.

--

--

She/her. Senior content designer @Shopify. Librarian by trade, writer at heart. ❤ ️ www.virginiakstart.com