The Science Behind the Art - Broadway Cares / Equity Fights AIDS - Part II

Raheel Gauba - 01.07.2010

In my previous post, I talked about the goals for Broadway Cares’ new web presence and a brief introduction on our strategic approach. Let's continue our case study with a look into our Information Architecture sessions.

Audience Analysis

Before we began any detailed analysis of the website design, layout and navigation, we needed to take a step back and first understand who the target audiences were. Along with identifying the audience segments, we knew that we also had to bridge the gap between what Broadway Cares needed their audience to do and what the audience expected of Broadway Cares.

During our review of audience segmentations, we initially identified more than ten segments that Broadway Cares needed to cater to. After several rounds of reviews, the focus was narrowed down to the top five segments:

  • Supporters
  • Event Participants & Consumers
  • Grantees
  • Prospects
  • Young Adults

Broadway Cares then went out and recruited actual constituents that represented this audience segmentation and invited them to volunteer and participate in a 2-day interactive workshop with us!

Card Sorting

Donna Spencer describes card sorting as “a quick, inexpensive, and reliable method, which serves as input into your information design process. Card sorting generates an overall structure for your information, as well as suggestions for navigation, menus, and possible taxonomies.”

Well put, Donna :) - Our card sorting sessions with Broadway Cares lasted about a day. During this session, not only did we learn a lot about how their audiences look at information about Broadway Cares but it was also a huge eye-opener for Broadway Cares themselves. Like many nonprofits, this was the first time Broadway Cares participated in a card sorting exercise and it allowed them to see first hand how their website, the navigation and information is perceived by their audiences.

We developed card sets representing key pages from Broadway Cares then-current website along with blank cards to give the audience an opportunity to recommend information they would like to see on the website.

During the first round, we handed the card decks to the volunteers and asked each of them to independently organize the cards based on how they perceive information about Broadway Cares and their website. This method of analysis is known as an Open Card Sort. We diligently went around the room and recorded the final orientations of the cards for each volunteer.

Next up, we asked all the volunteers to form one group and organize just a single set of cards and agree upon the final orientation. This round of card sorting allowed for open interaction between the different audience segments where the importance of information for each segment was discussed. The conversations taking place really gave us precious insight into how Broadway Cares’ audiences prioritize and consume information. After a couple of hours, the collective group agreed on the final card sort, which we used as a basis for our recommendations along with the individual card set data and best practices.

At this point, we had valuable insight into how the audience see the information presented by Broadway Cares complete with their recommendations for new areas of interest as well!

Usability Testing

Along with a (much needed) card sorting session with our group of volunteers, we also decided to test the usability of the previous Broadway Cares website. After all, the best way to get to our destination is to get a deeper understanding of where we are today!

We spent an entire day with each of our volunteers and asked them to perform simple tasks on the website. The tasks were customized based on the audience segment the volunteer belonged to. All the clicks, comments and facial reactions were captured via video for further analysis back at our headquarters.

As expected, we learned a lot from this exercise – and most importantly, this process gave the Broadway Cares staff a completely new perspective on how their navigation was being used, how the page titles play an important role and the importance of a good site architecture.

At the end of the day, we had collected more than 16 hours of video from actual constituents telling us what they liked about the Broadway Cares website as well as sharing ideas about how certain areas could be improved – Exciting!!!

Information Architecture

At this point we had the most of the ingredients needed to develop a scalable information architecture that addressed the needs of their top constituents.

The proposed architecture took into account that there really are three major tasks that the organization and its constituents are involved with:

  • What we do – This area communicates what Broadway Cares does on a day to day basis as an organization
  • What you do – This area communicates what the audience can do to make a difference
  • What we do together – This area combines the efforts on both ends and outlines the results and achievements of Broadway Cares AND their constituents!

This underlying philosophy was the basis to develop a final navigation system and act as a guiding light for the visual site redesign.

My next post will conclude the Broadway Cares case study where I will be sharing some insights from our design discovery process along with wireframes and the final design… Stay tuned!

Have any comments or similar experiences while redesigning your website? Share your comments with us!

 

Recent Posts


Nonprofit Tech Featured Blog