Project Summary
The London Borough of Hackney, along with Tower Hamlets, City of London and Newham, required a software development company to create an interactive web application which would raise awareness of air quality issues and encourage behaviour change in areas with high levels of air pollution and socio-economic deprivation.
OpenKit exceeded all critical expectations with the successful delivery of the Air Aware web application. In addition, our AI services and solutions were put to use to integrate an AI chatbot assistant that could competently respond to user inquiries about air pollution.
Client Overview
Hackney Council (lead borough) along with City of London, Tower Hamlets and Newham (partner boroughs) have historically suffered some of the worst air pollution in the country, due to high levels of industrialisation. All partner boroughs are classed as AQMAs (Air Quality Management Areas) for exceeding one or more AQOs (Air Quality Objectives). Furthermore, the four boroughs of Hackney, City of London, Newham and Tower Hamlets are three of the most deprived authorities within England, according to the Office for National Statistics.
It has been shown that communities which have higher levels of socio-economic deprivation tend to be those which experience the highest levels of air pollution. Studies have equally found that communities with the highest levels of air pollution, deprivation, and clinically vulnerable groups tend to be those which are least engaged with previous Council initiatives to reduce people’s exposure to air pollution.
Following a growing interest in low air quality and its impacts on people’s health, a survey based on 254 residents showed that 4 in 5 residents of these London boroughs were concerned about the impact of air pollution on their health, but lacked more information on actual risks, the severity of pollution around them, and the resources available to help them.
Challenges
These London boroughs voted on the need to provide an informative, engaging web application to disseminate information about air pollution and promote behavioural change in their residents. To reach the target audience, this app needed to have a simple, intuitive interface inclusive to all users, regardless of age, cultural background or disability.
Since the main issue with air quality is a pervasive lack of information, this app would be instrumental in acting as a point of reference for users to discover the reality of air pollution, including its impacts on their health and their environment. The application would also foster personal engagement and sustained behavioural change, actively encouraging residents to learn more about air pollution, stay updated on local news, and attend their local air quality-related events.
1. Create a web application prototype used to gather community input, ensuring the application meets WCAG 2.1 AA guidelines
2. Develop a pilot web application combining community feedback and OpenKit’s technical expertise
3. Launch a final web application accessible to residents across all partner boroughs, establishing an air quality champions network and delivering community engagement activities and events
Our Approach
Strategy and Planning
Our team attended an inception meeting with each borough to gain insight into the project requirements and target communities. We understood that we needed to develop a web application in a format that would be accessible and understood by people with limited understanding of both digital tools and air quality. OpenKit opted to use Agile software development methodologies throughout the project, which allowed for rapid prototyping, continuous refinement, and iterative improvements based on user feedback.
Design and Workshops
We developed an initial wireframe and design mockup using Figma, a leading collaborative design tool. We received useful feedback on the layout and presentation of the application and integrated it to further improve the web application prototype. This saved us time by rapidly improving the user interface without any actual development. The next iteration was a clickable prototype, also made using Figma, which enabled us to collaborate with the local communities, the partnering boroughs, and our internal team members in real time, streamlining the design process and ensuring that the web application’s UX was tailored to the needs of the target audience.
Our team led multiple co-design workshops, three of them in person and four online, totalling to around 100 attendees. Throughout the process, we gathered crucial community feedback which allowed us to improve our prototype at every round. We discovered, for example, that we should let users find the homepage immediately, rather than pass through a login stage first. The community also prompted us to improve the general legibility and ease of navigation around the application. Analyses of versions 1 and 2 showed that users only ever interacted with the map page, hence our decision to make it the dedicated home view for all users in the final version.
Most importantly, our proposal for a multilingual Air Quality AI assistant, which could answer users’ questions related to air pollution, was our best-received feature, and aligned closest with our clients’ goal of informing and raising awareness. Pulling from trusted sources, including government articles and academic research conducted on air pollution, it showed the easiest way to allow residents of all backgrounds to learn about air pollution in a personalised manner.
Development
Taking into account all the feedback gathered from workshops, we proceeded to develop the pilot version of the Air Aware web application over a period of six months. The resulting UX design was intuitive, user-friendly, and effective in conveying the necessary information on air quality and pollution reduction techniques.
Features of Air Aware:
1.
A targeted AI solution, the Air Quality Assistant
The assistant is a state-of-the-art AI chatbot powered by the latest advancements in large language models, using the technology behind ChatGPT. This intelligent assistant is tailored to provide Londoners with expert-level insights into air quality, leveraging the power of AI to deliver real-time, historical, and predictive air quality analytics. Designed to cater to a broad audience, it offers seamless integration of complex data analysis and user-friendly visual learning tools, including infographics, images, and videos. The assistant can process natural language requests such as ‘When is air pollution lowest in Hackney?’ or ‘How did air pollution change in Newham over Christmas?’ by analysing real-time and historical data from multiple sources to return accurate, calculated answers.
It also has access to a range of reviewed, trustworthy sources such as DEFRA, British Heart Foundation, NHS and Asthma, Lung UK, or the open access PubMed repository, and present information to users in an accessible way. Additionally, the assistant stays up to date on air quality news and related events. It’s an invaluable resource for anyone looking to understand the nuances of climate change and environmental policies through the lens of cutting-edge AI technology.
2.
Air Pollution Map
The dynamic map shows pollution sensors from PurpleAir, London Air, AirQualityEngland and Powered by Breathe London that offer both real-time and historical data. It allows users to zoom in for granular details or observe broader trends across a 24-hour average air quality graph.
With functionalities such as location search, area-specific data visualisation, and pollutant-specific information, the page allows residents to monitor their local environment closely. The inclusion of health guidelines from the WHO and Defra provides context for the data, to better inform decision-making and improve health and environmental outcomes.
3.
Information Hub
The Air Aware Information Hub is a comprehensive resource designed to deepen the public’s understanding of air pollution and its consequences. It offers a wealth of articles that delve into various aspects of air quality, equipping residents with knowledge on how to reduce pollution, understand its causes, and grasp the significance of the issue.
In addition to educational content, the hub provides practical advice on reducing personal exposure to pollutants, empowering users to take actionable steps towards cleaner air. Each section is supported by references to original sources, both to ensure credibility and to allow users to explore topics in more depth.
4.
Community Hub
This feature acts as a space to stay connected with the latest happenings and developments in London’s fight against air pollution. It serves as a central point for residents to access up-to-date information on local events and news related to air quality. The events section, curated and updated by council members from each borough, showcases a variety of upcoming activities, inviting users to learn more and engage with their community.
The news section aggregates the most recent updates from reputable sources such as the BBC, The Guardian, and Air Quality News, ensuring that users are well-informed about the latest air quality trends and initiatives. The community page is designed for ease of use, with a simple navigation system that allows users to revisit the tutorial at any time, fostering a well-informed and active community dedicated to improving the air we breathe.
5.
Content Management System
The content management system was created to be used internally by council members only. The separate platform allows any registered member to create events for their respective borough. These events then show up chronologically on Air Aware within the community hub.
Additional outcomes
WCAG 2.1 Accessibility
We built Air Aware with a dedication to creating an inclusive online project compliant with WCAG 2.1 AA standards. Our platform is tailored to support users with a range of accessibility needs, such as those with poor vision and colour blindness. For those with visual impairments, we provide features such as adjustable text sizes and high-contrast settings, enabling users to customise their viewing experience for optimal readability. For individuals with colour blindness, our design incorporates a separate colour palette that is more easily distinguishable.
Dedicated Screens
Air Aware is freely available on dedicated screens placed in each of the involved boroughs, as well as in in certain Newham borough pharmarcies.
Testing and Feedback
Our finalised pilot application was tested in a series of two beta rounds, allowing us to further refine its features and functionality. First, we managed an internal beta release for council members. We were then ready for a public beta release, shared with our ‘air quality champions’, a group of dedicated locals who volunteered to support their borough’s Air Quality Awareness Programme in various ways, and provided us with extensive feedback before deployment.
Key Successes
Throughout the project, our team attended regular meetings to review progress, discuss challenges, and ensure alignment with the project’s objectives. We provided timely updates to coincide with DEFRA quarterly reporting requirements, ensuring transparency and accountability.
Activity
Air Aware has experienced a significant increase in user sessions, reaching 2,000 sessions over the first two months. This milestone underscores the growing interest and consistent user engagement with our services. Each session represents an opportunity for us to deliver value to our users and to refine our understanding of their preferences and needs.
Average session
During the average session, users actively engaged with our content, indicating a high level of interest. With a 5-minute average time on page and an 88% scroll depth, our targeted approach in curating content seems to resonate well with our audience. This level of engagement is a positive indicator of the relevance and value our platform provides
Engagement
Our platform has seen a notable uptick in user engagement metrics. The data indicates a robust interaction with our features, as evidenced by a high number of clicks and considerable time spent per page.
Analysis & optimisation
To further enhance user experience, we're analysing behavioral patterns and identifying areas for optimisation. The data shows potential in reducing the drop-off rate by refining the UX to focus on the high-interest areas evidenced by click and scroll behavior.
Next steps
Following the conclusion of the Air Aware project, our dedication to maintaining the integrity, upkeep and functionality of the web application remains. We will continue to utilise our established monitoring systems to ensure that the tool and its associated services perform optimally and without interruption. We have implemented robust mechanisms to address and resolve any concerns that may emerge.
Our approach to service operations combines proactive monitoring with a responsive support system. With the tool’s current stability, our focus has shifted towards a more reactive model, allowing us to efficiently address issues as they occur. Council members and users are encouraged to report any technical difficulties or service disruptions directly to us through a dedicated support channel at support@openkit.co.uk.
Who we collaborated with:
- Four London Boroughs (Hackney, Newham, City of London, Tower Hamlets)
- DEFRA
- NHS