Global Evaluation Platform – UX Redesign for Impact

Introduction:

This platform serves a broad user base, including Country Offices, headquarters units, and multiple partner agencies, all relying on it to plan, track, and report on evaluations and management responses worldwide. Our task was to revamp the homepage and enhance the search functionality to improve access to global evaluation activities, making the platform more user-friendly and efficient.

Revamping an established product is a complex endeavor that requires thorough research, careful planning, and multiple iterations. We began the project by collaborating with key stakeholders to define business objectives, clarify functionality requirements, and establish a timeline for deliverables.

Initial Phase: Discovery & Analysis

The first step in the redesign process was conducting a thorough analysis of the existing website. This included reviewing user feedback, conducting usability tests, and identifying pain points in the current design. A kickoff meeting with stakeholders set the stage for the project, outlining key goals and functionality needs, while also allowing us to define the project timeline.

The existing homepage featured an interactive world map that displayed countries with evaluation coverage. However, several usability issues emerged during testing that needed addressing, particularly around the map’s visual hierarchy and navigation.

Key Challenges & Insights

Through research and user testing, we identified the following issues:

1. Difficulty Differentiating Activities: Users had trouble distinguishing between countries based on evaluation activities due to insufficient visual cues. The map’s design did not effectively communicate the varying levels of engagement in different regions.
2. Navigation Issues: Users had difficulty resetting the map to its default view after interacting with it. This suggested that the map’s navigation controls could be improved for better usability.
3. Lack of High-Level Overview: Users wanted an easily accessible summary of key metrics, such as the total number of evaluations and the number of countries covered by the platform. The existing homepage did not provide this high-level insight, making it difficult for users to quickly gauge the platform’s global impact.

Methodology

The primary objective of this redesign was to improve the homepage's user experience, especially around the global map and data presentation. Given that the target audience consisted of high-level organizational officials who needed quick access to global evaluation data, we decided to conduct usability testing with them to gain insights into their pain points. Based on these insights, we iterated on the design to enhance usability and meet the users' needs.

Design & Prototyping in Figma: All the design work for this project was executed in Figma, where I created wireframes, interactive prototypes, and high-fidelity designs to visualize the proposed changes. Figma allowed for seamless collaboration with stakeholders, enabling real-time feedback and iterative adjustments throughout the design process.

Design Iterations

Original Homepage

The initial homepage featured a map that displayed countries with evaluation coverage. Users could filter the map by various criteria, but the design lacked clarity and did not provide a streamlined way for users to interpret the data. Additionally, the map lacked intuitive reset functionality, and users struggled to regain the default view once they had explored specific regions.

Testing Insights

From the usability tests, we gathered the following insights:

• Global Reach Visibility: The map effectively conveyed the global scope of the NGO’s activities but needed a clearer visual language to differentiate between countries with different levels or types of evaluation coverage.
• Navigation Challenges: The inability to easily reset the map or return to the default view was a significant usability issue.
• Desire for Summarized Metrics: Users wanted a concise summary that would immediately inform them of the total number of evaluations, the number of countries covered, and other high-level metrics.

Revised Homepage

From our usability tests, we gathered several key insights:

• Global Reach Visibility: While the map effectively conveyed the global reach of the platform’s activities, users found it challenging to understand the types and levels of evaluation coverage in different countries.
• Navigation Challenges: Users struggled with returning to the default map view after using filters, pointing to a need for clearer map controls.
• Desire for Summarized Data: Users expressed a need for an immediate overview of key metrics, such as the total number of evaluations and countries covered, without needing to apply multiple filters.

Design Updates in Figma

Based on the feedback, I iterated on the homepage design in Figma, implementing the following updates:

1. Color-Coded Activity Levels: I introduced a color-coded system to represent different types and levels of activities on the map. This made it easier for users to distinguish between countries with different evaluation statuses and provided better visual clarity. Each color was mapped to a specific type of evaluation activity (e.g., completed evaluations, ongoing evaluations, etc.).
2. Reset Button: I added a prominent “Reset” button at the top right corner of the map, allowing users to return to the default view quickly. This was a key improvement based on usability feedback. The button was designed in Figma for optimal visibility and ease of access.
3. Timeframe Display: I included a data timeframe display that showed the range of years for the data being viewed (from 1997 to 2024). This was integrated into the design to provide additional context, even when no filters were applied.
4. Key Metrics Dashboard: A summary dashboard was incorporated into the homepage to display key metrics, such as the total number of evaluations and the number of countries involved. This allowed users to quickly understand the global scope of the platform’s activities without needing to explore the map in detail.

These changes were designed and prototyped in Figma, where I created interactive, clickable prototypes to simulate the user experience. This allowed stakeholders to experience the design firsthand and provide real-time feedback before final implementation.

Results & Conclusion

The redesigned homepage successfully addressed the key usability issues identified during testing. The color-coded system provided clearer visual cues, making it easier for users to understand evaluation activity levels across different regions. The “Reset” button and data timeframe display streamlined the user experience and ensured that users could quickly reset the map or understand the context of the displayed data.

Incorporating the key metrics dashboard gave users a quick, high-level overview of the platform’s global reach, improving their ability to assess the platform’s impact at a glance. The final design, created and iterated on in Figma, was highly appreciated by stakeholders for its improved clarity, usability, and intuitive navigation.

The project was a success, with the redesign leading to a more user-friendly and efficient homepage that met both functional requirements and user needs. By leveraging Figma for design, prototyping, and stakeholder collaboration, we were able to streamline the process and create a solution that was both effective and user-centered.