CASE STUDY 02: U.S. BUREAU OF INTERNATIONAL LABOR AFFAIRS
Amplifying Impact: Redesigning to Highlight Humanitarian Achievements
The website is live! It can be found at dol.gov/agencies/ilab
Launched
12 March 2022
Role
UI/UX Designer
Design team of one
Team
1x UI/UX Designer
1x Product Manager
2x Developers
Project context
I lead the website redesign for the Department of Labor’s Bureau of International Labor Affairs (ILAB) to enhance humanitarian project visibility and increase retention.
Impact
The new design grounds and contextualizes the information displayed
Increased user engagement and retention
INITIAL BRIEFING
I jumped into a project that was already underway.
The lead developer was quite skilled in UI design, so the team had already made some initial progress on the design front (more on that soon), which was quickly handed over to me. I learned right away that design decisions would be shaped by the constraints of Drupal, the framework upon which the web app was built.
I was also informed that this project would prioritize client requirements over user research, meaning that we were taking on additional risks with user acceptance later on.
01
More discoverability, more story-sharing
Better display ILAB’s humanitarian projects for greater visibility, discoverability and retention
02
Keep readers engaged for longer
Improve retention and create activity around the Knowledge Base page
03
Give an optimistic reality check
ILAB wants the weight and impact of the humanitarian projects to be felt by users.
PROBLEM 01
We were working with the government’s archaic design system
A quick heuristic evaluation of what we had to work with revealed some fundamental issues with usability that would directly impact dropoff rates and engagement.
It may not look like it, but this is a full screen shot of the old website. The filter panel took up the entire screen when expanded.
01
Filter hide/reveal wasn’t a good solution because it takes too much space when revealed
03
Key features for usability are missing (tags, for instance)
02
Filters don’t show which are selected when results display
DESIGN DECISION 01
I created a highly searchable Projects page with refreshingly fewer frills
The changes improved their userbase’s ability to locate things they were looking for, accomplish tasks without giving up, and discover new site elements they weren’t previously familiar with.
Tags were an interesting challenge to pull together because it was a lot to iron out on the back end data side, but their value in connecting projects was large enough to warrant it.
The redesigned Projects page satisfies user needs without overwhelming.
01
I determined that stacking filter fields would help improve overall space taken up.
03
I proposed we use tags to connect pieces thematically to one another. Super well received!
02
Stacking the filters to the left of the table wouldn’t compromise how much the table could display.
PROBLEM 02
The original site didn’t have a way to display the plethora of research and projects
There wasn’t an existing way to display data (meaning reports, learnings, projects, etc.), which meant users weren’t likely to know they existed. That also meant that users had no basis for the value created by these initiatives.
01
02
03
01
02
03
DESIGN DECISION 02
I created a visual, engaging repository for the new knowledge base
The client requested we created a Knowledge Portal housing all reports, learnings, resources, and projects. My idea to use an interactive map stemmed from ILAB being a global force with impact felt across borders.
We were limited with what we could do on the motion design side, because our developers’ hands were tied with our use of Drupal.
RETROSPECTIVE
This redesign allowed the data (on initiatives, on aid, and on better futures) to shine
Results achieved
The ILAB website redesign puts people and humanitarian initiatives first, and I’m really proud of that! This was a project whose quality would decline with any frills– the simpler, the better. And the result? Contextualized humanitarian efforts and successes allowing the content to speak for itself.
What I learned
I learned how to remain flexible when our developers were limited by the use of Drupal, which the rest of the Bureau’s website is hosted on. In practice, this looked like a back-and forth with some strain at times, but all in service of wanting to create the best product and best serve our client. Most of all. I learned I wanted to work on more projects that supported good work that made a difference.
ILAB’s Knowledge Base is founded on an interactive world map.
01
Using a map was a tactical choice to help ground and contextualize the data displayed.
02
Displaying the data geographically allows the user to infer the comparative amount of aid sent places.
01
02