Nonprofit Project Summary:
Iterative Usability Testing of NFPA’s Web Tool for Building Engineers
A global nonprofit was struggling to get on the same page about how to improve its new web app. Boston-based NFPA partnered with Marketade to conduct 2 rounds of usability testing and on-site workshops, with rapid design changes in between. The collaborative research approach helped a diverse team “get to the root issues” and reach “team alignment” early in its product cycle.
Image source: NFPA.org
The Boston-based National Fire Protection Association (NFPA), a 125-year-old global nonprofit with 50,000 members, recently launched CodeFinder. This web-based application helps engineers, architects, and building designers find and learn about enforced fire codes and standards for their projects. The goals of the project were to:
- Understand who is using the platform, how/when they use it, and their outcomes
- Identify which features do/don’t work for users
- Learn how much users value the platform, and which content they value most
We designed the following study: 2 rounds of research with rapid design changes in between. Both rounds followed the same 5-phase approach, with Round 2 using a lighter-weight version.
We used qualitative usability testing as the primary research method: 1-on-1 moderated sessions with a small number of participants. We supplemented this with 2 types of quantitative research: web analytics and session replay analysis.
Our approach centered around 2 stakeholder workshops, one after each round of testing. These workshops drove implementable design changes through:
- Alignment: The workshops included a diverse set of stakeholders (product, content, design), including the key decision-makers, who we brought together to observe the research as a team. After observing a small number of sessions, the usability problems were clear to everyone — and there was agreement on the problems worth tackling.
- Collaboration: In small teams, the stakeholders brainstormed, sketched, and collaborated on solutions to the top problems — with Marketade’s guidance. Because they were grounded in research observed earlier that day, all solutions were user-centered.
- Action: The team agreed to next steps and owners. In the 1st workshop, next steps focused on prototype changes. In the 2nd workshop, we focused on changes to implement.
A usability testing session with a fire protection engineer using CodeFinder on a mobile device. The participant thinks aloud while trying to find a relevant code.
NFPA stakeholders from product, marketing, and design teams observe research interviews while taking structured notes.
Later, the workshop team participates in a multi-step affinity mapping exercise to post, group, label, and prioritize their research findings.
Near the end of the workshop, breakout groups present their ideas to solve the top problems identified earlier.
NFPA implemented a number of UX improvements based on the research and analysis workshops. Here are two examples:
- Redesigned Search Bar: Users struggled with search functionality during early testing. A new search bar helps users better understand the types of keywords they can search and the scope of their search.
- De-emphasized Map View: Previously, the tool was split equally between a map and a dropdown/content interface. In research, users gravitated toward the dropdown. A new design de-emphasizes the map interface and provides an option to remove the map display entirely.
“Fantastic session and we were able to really get to the root issues.”
More Case Studies
Major companies like McDonald’s and Nestlé use the Accountability Framework to help achieve ethical supply chains. Marketade led usability testing to help increase engagement with the Framework’s digital platform.
To guide a B2B website redesign, Phillip Jeffries hired Marketade to lead its first-ever usability testing study. The collaborative project led to “team alignment on how customers are using the site” and a concrete “action plan.”