Case Studies
How do you create user experience parity between 60+ different systems?
Indigo Design System: Universal Service
Problem
My team knew from extensive ethnographic research that users of USAC’s suite of tools crossed at least 7 different systems when applying for funding.
We also knew that users filled out up to 10,000 fields in a multi-step application process. An error in one of those 10,000 fields could mean a significant delay in receiving much-needed funds for rural health clinics or schools and libraries.
Lastly, we understood that the systems that applicants used were built by different development teams over a decade. As a result, common UX components were not re-used, and behaved inconsistently across systems.
The Experience Design team’s hypothesis was that continuity — through a comprehensive design system — might help lessen user workload, increase accuracy, and help to streamline some front-end dev work.
Approach
Revisit all existing user research, specifically at the product level, as to identify a cross-section of direct user concerns
Perform a comprehensive design audit of the most widely-used systems (by user volume and financial implication)
Analyze existing usage data
Collaborate with the front-end development, content strategy, and data science teams to understand how the systems were being created and maintained — as well as design implications for how data is passed
Create company-wide awareness of the user issue, and build internal coalitions to implement a pattern/component library
Use an Agile approach for sketching, design, and development sprints, testing components as we went
Create living, breathing documentation for how components and patterns should be used
Evaluate (and adjust) components and patterns in context of the systems in which they will be used
Design a mechanism for ongoing updates and releases of the library
Evangelize the system throughout the company
Outcomes
C-level leadership at Universal Service mandated that teams adopt the Indigo Design System for any net-new systems at the company
Indigo Design System was showcased to the Universal Service board of directors to illustrate Experience Design team’s tangible support for a “one USAC”
UX, Design, Content, Data Science, and Front-End Development worked together — happily and productively, fostering excellent collaboration and communications between the disparate teams
Initially launched in 2018, Indigo is still updated today, with new releases, components, and documentation
How do you design for a content-centered process?
IA and Section Redesign: World Bank (via Eight Shapes)
Problem
Critical to the operations and mission of the World Bank is the Procurement process, whereby countries and NGOs can apply for much-needed infrastructure funding.
The procurement process had been updated a few times over the course of a decade, resulting in new guidance and revised forms for applicants. However, the previous set of documents and procedures needed to be retained for continuity of projects already in-process.
The challenge was to come up with a revised IA for Procurement and to translate the resulting information architecture into page designs that aligned with existing design patterns and brand standards.
Approach
Content inventory to understand the breadth and depth of the section
Baseline content analysis to gauge key content-specific metrics
Stakeholder interviews to understand more about the users’ procurement processes, as well as how internal staff use the website to support that work
Draft multiple iterations of information schemas (IAs, site maps)
Test the structure with site users via tree testing
Final IA/site map with related documentation
Page design options based on the revised IA
Outcomes
The user’s experience meaningfully aligned with World Bank layout, navigational, and interaction patterns
Increased prioritization of user tasks to support completion of the procurement process
Extensible structure to support additional changes
How do you tell a more actionable story?
Emergency Pages: USA for UNHCR
Problem
USA for UNHCR (The UN Global Refugee Agency) relies on donations to support its on-the-ground work across the globe. While the Emergency section of unrefugees.org garnered a high amount of visits, the time on the pages was low, while the bounce rate was high.
Approach
Research possible causes for page performance:
Geography/limited “sense of place” for US-based visitors
Copy-heavy storytelling
Limited progressive disclosure
Usability concerns
Peer organization analysis to evaluate the storytelling
Evaluate the breadth of UN-related content to tell a more multi-channel story
Page redesign using existing components to support extensibility
Extensive research and copywriting
Outcomes
A “facts and figures” approach allows data points to tell a quick story
More meaningful integration of video and other multimedia elements
Map element geographically orients readers
Template adopted for all Emergency pages
Increased time on page and lowered bounce rate
How do you foster a UX team's process & career growth?
Process Framework and UX Career Matrix: Universal Service
Problem
UX at Universal Service Administrative Company was largely ad-hoc prior to the creation of a formal team in 2016. UXers were hungry for career growth, but had no clearly-defined path to promotion.
Similarly, the team had not yet codified the UX process at USAC.
These two challenges overlapped in significant ways:
The team needed a defined promotion path to encourage staff retention.
The company needed a stronger sense of the skills and training of the UX team.
The team needed a framework/model for articulating the UX design process.
Management needed a matrix to measure the team’s growth.
Approach
Stakeholder interviews with the UX team to understand their needs and wants
Research into UX job descriptions, specifically as they pertained to process
Interviews with external industry peers, as well as company leadership
Workshops for the UX team to identify the process they wanted to be accountable for
Design two artifacts: a career progression matrix and a process framework
Gather and encourage first-hand feedback to shape the team’s process and individual growth
Display large scale, highly visible posters for cross-team education and discussion
Outcomes
More meaningful coaching and effective performance reviews
Improved leadership accountability for the team’s visibility and growth
Increased communication with other teams to emphasize that UX is a process, not a task
Aided recruiting by standardizing job descriptions and candidate pre-screening