Using UX to modernize and optimize legacy applications in federal IT
Federal agencies plan to spend $87 billion on IT in the 2023 fiscal year, and a huge portion of that will be tied up in hosting and maintaining legacy systems. In its most recent statistics, the U.S. Government Accountability Office (GAO) estimated that legacy systems took up as much as 80% of the federal IT budget. At the same time, many of those legacy systems are not delivering the value they should. In ICF’s 2023 digital modernization report, 40% of the federal IT employees surveyed said their agency had five or more existing programs or solutions that are not in regular use.
Agencies that wish to reduce the cost of their legacy IT can do so by investing in digital modernization. A key facet of modernization involves updating user experience (UX) to maximize their return. Modernized UX brings a range of benefits to the user: It means increased accessibility, productivity, efficiency, and scalability, all of which lead to greater user satisfaction and a higher rate of adoption.
UX that meets contemporary standards preserves or even increases the business value of legacy systems, which is one reason human-centered design (HCD) strategies appear prominently in the U.S. Digital Services Playbook. The benefits are clear in projects like the Measure Authoring Development Integrated Environment (MADiE) that ICF has been building on behalf of our client, the Centers for Medicare and Medicaid Services (CMS).
What is MADiE?
To understand MADiE, it helps to start with our client’s mission. CMS provides health coverage for more than 100 million people in the United States. It works “to provide access to high-quality care and improved health at lower costs” and has massive influence on the nation’s health system. CMS uses data and metrics to track and optimize outcomes in the U.S. healthcare system through electronic clinical quality measures (eCQMs).
That is where MADiE and its predecessors come in. Since 2011, the experts at CMS have used the Measure Authoring Tool (MAT) to encode eCQMs and the Bonnie application to test them. These systems were created to operate separately, but CMS determined through user research that it made more sense to integrate the two, creating the Measure Authoring Tool Integrated Environment (MADiE).
Restoring value through UX
When approaching the digital modernization of a legacy system, it’s important to understand its original business value as well as the characteristics of the application that users have come to expect. Even when a system is cumbersome or inefficient, users form a mental model of the system that drives their expectations about how it should work.
With MADiE, we had to learn what people really needed from the legacy systems so that we could take advantage of updated design patterns and facilitate adoption of the new system. We conducted 12 semi-structured interviews and demos with a substantial number of users to discover the most important tasks they had to accomplish, how they preferred to work, what they value from the existing systems, and what caused them problems. This base research validated that MADiE was aimed at solving the right problem but having two separate applications created excess context switching, a common usability problem that saps efficiency and can increase user errors.
We also conducted extensive audits of user interfaces and task flows, finding dozens of improvement opportunities. Even the best legacy applications usually exhibit outdated design patterns. They may rely on dated technology that cannot take advantage of the UX improvements offered in modern tooling, accumulating compromises, trade-offs, and design patterns that are obsolete by today’s standards. Upgrading front-end technology allows for UX improvements to mobile and touch-screen interfaces, high-resolution displays, micro-animations, and the latest technical standards and regulations for accessibility.
For MADiE, we built the user interface (UI) with the latest version of React, and we instituted a modern design system with 17 baseline components. This allowed the application to present a more consistent, integrated, and usable interface. To make sure we integrated and redesigned key features effectively, we tested and iterated on prototypes with numerous usability and user acceptance tests per year, taking input from a wide cross section of users. These tests ensured that the many changes we proposed to update visual style, use conventional interactions, and replace inaccurate terminology improved the overall experience without losing any of the original value.
Delivering a human-centered process
ICF prefers to follow this systematic process of researching the whole experience, prototyping iteratively, and testing. We strive to honor the original users’ goals and the legacy application’s solution by meeting users where they are today. We preserve existing design elements that work and update the ones that don’t—validating both through iterative development and testing. A closer look at one of MADiE’s key interfaces, the UI Builder (Figure 1), is a good example of the kind of improvements that are possible.
Figure 1: The legacy application, Bonnie, incorporated a wealth of information but was visually dated and relied heavily on long vertical scrolling (partially shown).
When we started our discovery, prototyping, and testing process, we found numerous problems. The interface had a dated style that is not consistent with the aesthetics of more recent applications built for CMS. Several components, such as the living status field, could communicate information more efficiently. The call to action (Cancel/Save) appears in the upper right rather than the footer where it is expected. The layout takes up prime locations with non-critical warnings and has a three-column design that is inefficient in organizing information.
The biggest opportunity, though, stemmed from how the interface incorporated the large amount of domain-specific information. Experienced users needed these data to set up effective tests of clinical quality measures, but the amount of data led to an extremely long scrolling page. Navigating up and down to access the right information at the right time led to lots of wasted time.
How MADiE fixes MAT and Bonnie UX challenges
The UX issues in MAT and Bonnie are common and accumulate naturally in software projects. Preventing or correcting them takes an intentional approach. Using the refreshed design system and contemporary visual styles helps drive consistency with more recent products at CMS.
We also worked to apply UI components more effectively. For example, the living status is now represented with a drop-down that makes both potential statuses visible at a glance. Fields that should not be edited, like first and last name, have their labels and input boxes removed to better indicate their lack of function and to save space. They are also relocated to allow the three-column design to collapse to a simpler and more intuitive two-column. Finally, the Cancel/Save buttons are relocated to the more typical lower-right position.
Although each of these changes is small, they accumulate and provide a big improvement in user satisfaction and efficiency. But the most significant gain came from addressing the usability challenge presented by the systems’ enormous amount of data. The proposed MADiE design (Figure 2) resolved this issue by applying a space-efficient tab interface. This allows users to find all the details they require with a single click—saving a lot of time. The new design also maintains the basic structure and terminology of the original. Users know implicitly where to look for what they need and can find it immediately. As one user put it:
“It's nice when the puzzle pieces are put together for you and presented in the way that makes the most sense so you can see it all together, versus having to scroll a million times over.”
Figure 2: The new version, MADiE, updates visual styles and incorporates a more structured tab container to improve usability while maintaining terminology, information architecture, and layout patterns from the original.
Discovering and validating key changes like these add up to big benefits for users:
"I'm really impressed. It looks like a lot of progress has been made. I really do like it, and I appreciate that you're doing it from a user perspective. That's really evident."
At the same time, the new design preserves many functions that might seem unusual at first glance. “Elements” still follow a rigid alphabetical order. The page is still rife with technical terms that could be switched to plain language. Data is still shown on the left while errors are in the right half of the screen. These choices are grounded in the aspects of the legacy system that are meaningful to the user population and cater to what they expect.
Early investments in UX pay long-term dividends
There are generally two approaches to overhauling legacy UX:
- Continue with the old design that has become convoluted over time as pieces and systems are added until the overarching design no longer serves its users well.
- Upgrade the product with a new and more intuitive design, hoping that users will adapt to the changes.
Effective digital modernization requires blending these two approaches. A good team will follow their users’ lead by:
- Spending time to learn and understand the history of the product and users’ relationship with it, picking up on cues for how the product can be improved.
- Merging what is learned with current UX design patterns.
- Making small changes and testing their outcomes to determine the best path forward.
But thoughtfully integrating UX updates can be a challenging sell for federal agencies. Instead of taking a human-centered design approach, many agencies go straight into development, citing time and cost factors. But in the long run, these agencies likely won’t get the value out of digital modernization that they otherwise would, as 94% of users do not trust outdated websites.
By including the design as part of a broader digital modernization effort rather than rushing past it, agencies can avoid dead-end projects and align agency staff toward a shared goal more efficiently. There is a significant return on the up-front investment of a digital modernization when the process restores a legacy system to relevance and value.
Interested in learning more about current trends in federal IT? Download our 2023 digital modernization report.
