IAPB - Vision Atlas - The Idea Bureau

Introduction

The International Agency for the Prevention of Blindness (IAPB) is an alliance for the global eye health sector that works together to end avoidable sight loss. They wish to ensure that everyone has access to affordable, accessible and inclusive eye care and rehabilitation services. Founded in 1975, they’re made up of more than 250 organisations worldwide, including those from international charities, eye hospitals, academic institutes, professional bodies, and organisations from the corporate sector. One of their overarching commitments is to make high-quality eye health data openly available, accessible and usable; they also actively support transparency and collaboration in eye health data collection and use – this is where the Vision Atlas comes in.

“Through interactive tools and accessible content, we aim to empower users [of the Vision Atlas] to explore trends, identify disparities and drive towards universal eye health”

IAPB Vision Atlas

We were approached by IAPB to work on this project, having been recommended our services by one of their consultants. They were impressed by our interactive maps projects for other charity and non-profit clients when searching for creative design agencies to work on the Vision Atlas project.

The Problem

The Vision Atlas is a tool that improves accountability within the eye health sector, bringing together the latest data from the Vision Loss Expert Group (VLEG), RAAB.world, other global eye health estimates, and country-level eye health data to inform action. It’s also a critical platform for supporting IAPB’s ‘2030 in Sight’ strategy.

IAPB already had a ‘Vision Atlas’ website in place when they approached us. The previous website iterations never fully realised their potential, and the IAPB team wanted to redesign the website to better suit their requirements. Their latest version of it – created in 2023 – was a prototype that the IAPB team had used for internal testing and exploring new technologies they could use to power the Vision Atlas. It was this version that helped to shape their brief and specification for what we’d come to collaborate on.

One of IAPB’s main aims of the project was for it to be a leading global example of sharing eye health data that’s simple and encourages more researchers to share their own data. They wished to achieve this by creating a comprehensive and relevant source of information that tells great data stories, and is beautiful, engaging and intuitive, and easy to use. It had to display country-specific data that can be sorted by theme and comparable across countries; it also needed to allow people to immerse themselves in the data, if they so desired. The team itself required the back-end of the website to be enhanced to simplify managing its existing data and adding new data.

Given that it sits within the eye health sector, it was highly important that accessibility was front and centre in both the design and build from the beginning. A visually striking design that fits within the WCAG AA / AAA standards would be imperative to make sure the Vision Atlas adheres to best practices for accessibility.

IAPB also had a strict deadline they needed the new version of the Vision Atlas to be ready for, as they wanted to launch it at their event, 2030 in Sight Live – Nepal.

“Ben and Tash did a great job bringing the new Vision Atlas to life. They were consistently responsive, detail-focused, and thoughtful in how they approached both design and technical challenges. Our collaboration with The Idea Bureau worked really well, and the launch of the Atlas has been extremely well received.”

Michael Morton

Consultant for IAPB

Our Solution

To create this new and improved version of the Vision Atlas, we’ve brought third party tools together with our technical expertise to build a high quality and reliable solution that IAPB are proud to share within their sector. Not only does this invaluable data repository set them apart as leaders in their industry, it’s now a product that will last, no longer requiring a redesign every couple of years.

This new version of the Vision Atlas uses accessible, user-friendly UI design and data visualisations to convey important eye health information on a worldwide scale. It’s now a tool that provides the IAPB team with much more control over their data – not many organisations can boast about such an invaluable resource.

Creating an improved design and front-end was crucial to really push the direction of the Vision Atlas forward. It was also imperative that accessibility-forward aspects, such as high contrast UI design and active highlighting, were included in the overall design.

The Vision Atlas project took 6 months to put together, from the feasibility phase through to completion. To begin, we held a Discovery Workshop with members of the IAPB team to ensure we fully understood their requirements for the project; we then created a proof of concept to demonstrate how the tools we’d selected would work together, giving confidence to the team that it would be successful.

Client:: IAPB – The International Agency for the Prevention of Blindness
Project Type:: Data repository website
Link::: visionatlas.iapb.org
Tags:: Data visualisation, Flourish, WordPress

How the Vision Atlas works

The Vision Atlas showcases compelling data sets from across 180+ countries, offering evidence that highlights the importance of eye health and helping to prove the IAPB’s case to governments, decision-makers and new stakeholders.

To enable IAPB to best promote its eye health information, we integrated a number of technologies to create this comprehensive online tool that visualises data at both global and individual country levels, and to compare it across countries on all device sizes. We used WordPress as a content management system (CMS) to underpin the general functionality and provide the overall site structure. We then designed a simple interface that gives users a strong and seamless way to consume this data via the Global, Country and Comparison pages in the form of data visualisations. The data for these dynamic visualisations is stored within a database tool called Knack – a tool that doesn’t require any coding knowledge, a very useful feature for the IAPB team.

To connect the Knack database with Flourish – a service that provides ‘no-code’ data charts, we created a custom API that allows the team to control the data and visualisation options themselves. This custom implementation means we can also offer real-time data filtering, language translations and comparisons. As the Vision Atlas is available globally, offering language translation options was an incredibly important feature; to do this, we used a third-party custom integration called Weglot that adds these translations automatically.

We also made use of Mapbox – a tool that we’ve used on previous projects – to facilitate the mapping features for the global sight loss prevalence data on the ‘hero’ map on the Vision Atlas home page.

The benefits of showcasing your impact with a bespoke interactive map

We’re here to show you the benefits that representing your impact with a bespoke interactive map will have for your organisation.

Learn more

“We proposed a non-standard tech stack, and Ben found smart, effective solutions that balanced flexibility with performance.”

Michael Morton

Consultant for IAPB

Working together

Keeping the IAPB team involved throughout the design and build was essential. To best understand the specific requirements the team had, we held a number of discovery workshops to identify what success would look like for the project. This gave them the opportunity to name the features and functionality they wanted for their new website; it was also a chance for the team to take us through their user types and help us get a better sense of the organisation as a whole. Together, we set the goals they had for the Vision Atlas based on their priorities for features – we did this using a system where we noted down the tasks and they voted on them anonymously.

Despite needing to work asynchronously, the IAPB team were incredibly hands on – they did a lot of the heavy lifting when it came to sorting the data for the visualisations.

They’re based in Australia and to managed the time zone difference, we utilised tools such as Loom and Notion to better work towards achieving the project milestones. Together, we did two rounds of user testing: one during the wireframing stage, where we demoed the wireframes to two ‘power users’ from IAPB and collected their feedback; there was then further user testing at the design stage. We also worked very closely with the team during the quality assurance (QA) and testing phase to ensure they were happy with everything for the ‘2030 In Sight’ launch event.

Bringing data to life with beautiful data visualisations

To ensure that the eye health information really came to life for the Vision Atlas’ users, we gave IAPB the means to put together a number of ‘scrollytelling’ data visualisations that help build a narrative. This way of presenting information allows people to scroll through the wealth of information in a way that’s interactive and engaging, while being shown interesting photos and charts, supported by ever changing copy that gives context as you move down the page.

The design of the visualisations is bright and distinctive, and the graphics change dynamically as users interact with the selectable drop-down filters to affect the data displayed within. They’re supplemented by detailed explanatory text and references to assist users in citing them if they include them in presentations and reports; they can also be shared to LinkedIn for use in posts and articles on the social media network.

“Tash did an excellent job translating IAPB’s new brand into a design that feels modern, attractive and user-friendly.”

Michael Morton

Consultant for IAPB

Comparing country-specific data

One of the most integral features of the Vision Atlas website is the ability to compare data across countries. This is such a useful tool, as it allows users to see the eye health disparity between nations – a wonderful way for researchers and eye health professionals to demonstrate the areas where improvement is needed.

IAPB’s audiences can select up to three countries to compare at any one time. The data is then affected by the selectable filters, for example: the measure that sight loss data is compared against can be altered to show the number of people affected, the prevalence of sight loss by age, and the crude prevalence overall.

As you continue down through the page, there is so much comprehensive data users can access, including the eye care integration within countries, the demographics affected in each country and how the country’s economics (e.g. schooling and productivity) are affected by sight loss. All of the data shown within these comparisons is displayed in real-time, a key feature, as with over 30,000 annual users, they need to have the most up-to-date information possible to affect change in their work.

“The Idea Bureau helped us with our ambitious project, and they were fantastic to work with throughout. We really valued the ability to collaborate directly with the developers and designers, which made everything more efficient. They communicated early when any issues were anticipated and helped us stay on track to meet our deadlines.”

Anthea Burnett

Head of Data & Evidence at IAPB

Conclusion

One of the biggest takeaways for us with this project was that it pushed us to improve our own accessibility going forward. As the client and their audience is so accessibility focused, we immersed ourselves in this thinking, and as such, found areas that we could build upon in our own work.

Overall, it was a good challenge for us. There were a number of new development technologies for us to get to grips with, particularly with the data visualisations and translations. They all had to work cohesively, as well, which was another challenge in itself. We wanted to build a reliable solution for the data visualisations that also produced beautiful results. There were so many moving parts that it made this quite a complicated endeavour; however, it was worth it for the incredible outcome.

We love that the Vision Atlas has been so well received, especially at IAPB’s 2030 In Sight event. Over 1,000 people visited the site as part of the launch and we’ve been amazed with the feedback we’ve received since then – it’s very fulfilling knowing that we’ve created a platform that’s going to last. Going forward, we’ll be continuing to work alongside the IAPB, as they join our Bureau⁺ support service; we’re also in discussion with them on further phases of the Vision Atlas, so that’s something we’re very excited about.

Related Work

Building tools to help Girls Not Brides better communicate the impact of child marriage around the world.

Read the case study

How we helped The Consortium for Street Children to create “The Legal Atlas for Street Children”