top of page

Information

ARCHITECTURE

Information Architecture Analysis, testing, and recommendations for improvement for an existing nonprofit website.

Fall 2020 - School Project

Myself and a group of 3 other students performed an information architecture analysis for vibearts.ca, a Toronto-area arts nonprofit

My Role

  • Low Fidelity Sketches

  • Report Copywriting & Editing

  • Medium Fidelity Prototype  

Context

Problem Space

VIBE Arts provides access to arts education to under-resourced populations in Ontario. Their website is used to share information with the public, but we found a mismatch in the organizational structure and what users of the website need, as well as an ambiguous labelling system. For this section, I worked on defining the user groups and creating page schematics. 

Context Analysis

To analyze the context of the organization we took into account VIBE's mission and values, stakeholders, and body of work to consider the types of users that are likely to visit the site: 

  1. Community Organizers: Community organizers visit vibearts.ca for art programming.

  2. Arts Volunteers: Artists motivated by their love of the arts and their desire to gain experience and mentorship in arts education, or to be a mentor to up and coming artists.

  3. Donors: VIBE Arts is a charitable organization, and relies on funding from many sources to continue their work. 

Content Analysis

We used the Noah's Ark Approach (right) to analyze content on the website: using two examples of each element, we sampled elements of the website's information, be it documents, reports, or buttons. 

Using Onpoint Content Auditor, we analyzed 100 pages of the VIBE Arts structure.

I constructed a set of structural page schematics (below) to express the current layouts of several reoccurring styles of pages.

Information Architecture Diagram

Using this context, we were able to construct a diagram of the existing information architecture. 

IA Schematic - Original
Research

User Research

To learn about users' interactions with VIBEArts' website, we performed three rounds of research at different stages of the process: tree testing, think aloud interviews, and card sorting. 

Tree Testing

Through Optimal Workshop, We chose tree testing to understand the routes users expect to take on the website when searching for content. Each task was framed in the mindset of one of the three user groups and were shown in a random, shuffled order.

 

From this we learned that a prevailing issue was misleading and ambiguous labelling.

Think Aloud

We chose to conduct semi-structured interviews using Zoom to better understand users’ mental models of how they expect the site to be structured. 

From this exercise paired with the tree testing, we noticed major themes in user pain points in the website's structure: users could not find what they were looking for; they did not find information where they were expecting; they could not tell where in the website they were and how to return. 

2

Participants

3

Major Themes

Card Sort

For our final research exercise, we conducted an open-sort cart sort study. Using Optimal Workshop, we moderated this over Zoom with a short introduction, card sort, and four debriefing questions. 

With this study we were able to triangulate the major patterns found in previous research, condensing down to 6 major patterns in user pain points.

5

Participants

6

Major Themes

Proposal for Improvements

The themes that appeared in our card sort exercise allowed us to locate prevalent issues in the website’s navigation that impede the ability of target user groups to successfully engage with the organization. Our suggestions fell within two categories: improvement of organization of the global navigation, and clarifying labelling used throughout the website.

Improve Global Navigation

​The issue in these top-level items arise as users cannot find items located as expected.

  • Add a top-level ‘Programs’ category

  • Redistribute ‘Our Team’ category

  • Restructure ‘News’ page 

  • Add ‘Our COVID-19 Response’ category

  • Remove Documents from navigation

  • Restructure Arts Effect category

Clarify Labelling

The ambiguous labelling and unclear organizational jargon was a major issue.

  • Clarify Volunteer roles. Place them under the top-level ‘Programs’ category for added context

  • Replace ambiguous labels with concise language in navigational items. 

Information Architecture Diagram

With these suggestions in mind, we proposed an improved global navigation with clarified labels.

Prototype

Prototype

We used 3 user scenarios for the prototype, representing the three determined user groups. We started with hand-drawn low-fidelity sketches to ensure our suggested architecture met expectations, then used Balsamiq to create a clickable medium fidelity prototype.

Sketches

For the low-fidelity sketches, I took three user scenarios (volunteering, partnering, and donating) and constructed three storyboards guiding the viewer through the proposed new navigation. 

Medium Fidelity Prototype

We used Balsamiq to recreate our low fidelity prototype. In this change, we were able to further revise some labelling. I created the initial template to ensure consistency and linked all pages.

COVID-19 Resilience Report (Full, on Home page), COVID-19 Resilience Report (Section, on Home page), Suggested COVID-19 Resilience Report page

Lessons & Acknowledgements

This project was completed for the course INF2170 - Information Architecture at the University of Toronto under the direction of Professor Tony Tang. The group consisted of myself, Aisha Aminu, Ariana Cuvin, and Evan Rees. 

This first project on information architecture opened my eyes to the minute details that affect users' abilities to navigate a website. As we delved further into content analysis, we realized that there was so much more than initially expected, and had to decide how to narrow down our analysis without missing important details. 

Our user interviews were very enlightening, as well; every user that interacted with vibearts.com approached it in a different manner. The card sorting exercise especially provided many insights as to the varied way users expect to find information.

bottom of page