Summary of Achievements

Requirements Achievement Table

ID Requirements Priority State Contributors
R1 Database with accessibility-focused data layers (at least wheelchair services and zebra crossings), with support for multiple resolutions (0.5mx0.5m, 3mx3m). Must Levon
R2 API functionality to receive coordinates, object type and reliability flags of data points and load them into the database. Must Levon
R3 A widget where selected data layer geolocation points are represented on a Google-maps like background with markers. The widget must be easily integratable into websites. Must Lenart, Levon, Amir
R4 Add what3words grid overlay and colour the cells the datapoint cover to depict spatial information. Must Lenart
R5 Functionality that locates the user and locates the closest points, ordered by Manhattan distance. Must Lenart, Amir
R6 Dark and yellow mode to improve accessibility. Must Lenart
NR1 Efficient handling of data retrieval and storage for fast real time API requests. Must Levon
NR2 Clear documentation for API and widget integration. Must All
R7 A visual webpage representation of the database where data can be downloaded and uploaded in a JSON format. Should Junwoo
R8 Data points in widget should have icons for better user experience. Should Lenart, Amir
R9 Widget should have dynamic options that the developer can specify. Should Levon, Amir
R10 Link to navigate to any datapoint via Google Maps. Should Lenart
R11 Widget should have text-to-speech and speech-to-text functionality for hands-free navigation. Should Lenart, Levon
NR3 Clear documentation for uploading / downloading data on the database website. Should Junwoo
R12 Users of widget can report additional accessibility features of data points through a form. Could Lenart, Levon
R13 Database website has an intuitive UI with icons and drag-and-drop functionality. Could Junwoo, Amir
R14 Data layers such as traffic lights and an obstacle layer (tables in front of cafes, bollards) are added. Could -
NR4 Telemetry data for API monitoring performance and usage. Could -
NR5 Scalable system for easy addition of more data layers. Could All
NR6 Mobile support for the widget. Could -
R15 We will not develop our own navigation technology. Won't -
NR7 The database will not allow any other format than the specified one to be received (like photos). Won't -
Key functionalities 100% Completed
Optional Functionalities 50% Completed

Important Note:

Throughout the course of the project our focus slightly shifted from these stated initial requirements. After talking with members of the visually impaired community, our partners, and representatives of charities, we shifted our focus to not only show accessible data, but to also make the widget as accessible and easy-to-use. That is why we added features such as focus mode, dyslexia font style, marker clustering and different font sizes.

Individual Contribution Tables

Work packages Lenart Levon Junwoo Amir
Project Partner Liaison 30% 30% 30% 30%
Requirements analysis 25% 25% 25% 25%
HCI 15% 15% 35% 35%
Research and experiments 20% 25% 15% 40%
UI Design 45% 20% 15% 20%
Backend 10% 90% 0% 0%
Frontend - Widget 60% 25% 0% 15%
Frontend - Database Website 0% 5% 90% 5%
Organizing User Testing 30% 30% 30% 10%
Testing 30% 35% 20% 15%
Report Website 25% 25% 25% 25%
Blog and Monthly Video 10% 10% 10% 70%
Overall contribution 30% 30% 23% 17%

Note: We weighed some components of the table more important than others which is why the Overall Contribution percentages do not completely add up.


Known Bugs

  • In our development process, we mostly kept track of bugs in our groupchat. Major bugs were fixed immediately, while some lower priority bugs were put aside in favour of more important features, such as making our API and backend more scalable / adding more accessibility features such as voice support. We have not managed to fix the following three bugs, however, they are low priority and do not affect the user experience significantly.

  • Bug 1: Reported additional accessibility feature appears in the info window only after reloading that data layer
    When you report an additional accessibility feature for a specific data point, a "Thank you" message appears, confirming that te feature has been reported. However, it is not updated in the data point info window description until the data layer is refreshed. We figured that the presence of the "Thank you" message makes it very unambiguous that the feature has been reported, making this bug low priority.

  • Bug 2: Grid depicting objects spatially is not perfectly aligned
    When clicking on a specific data point, some cells in the grid are coloured to depict the object's spatial information. When looking closely, we can see that the coloured grid cells do not perfectly align with the what3words 3m x 3m grid underneath, mostly due to the fact that the what3words API does not allow you to colour specific cells, which meant that we had to create the coloured grid cells ourselves, leading to location inconsistency (see Figure 1 below). However, as all our current data layers represent very large objects, a discrepancy of about 40 cm is not crucial. Hence, we also classify this bug as low priority.

  • Grid Bug

    Figure 1: Grid Bug


  • Bug 3: Focus Mode
    When users use focus mode, the functionality only enlargens the map part of the widget. Due to this fact, when users use the cursor to move to the non-enlargable sidebar, the widget experiences some relatively small flickering behaviour in the corner. When they move the mouse away, this behaviour stops. Due to a relatively uncommon use case with minimal damage, we also classify this bug as low priority.

Critical Evaluation of the Project

Our end product was predominantly made with accessibility in mind. This is why it was crucial that we tested regularly with end-users while also consulting professionals in the field of accessible technology. We also ensured we were following the accessibility standard WCAG 2.2.

We had weekly meetings with industry professionals (GDI Hub, SoundScape, Esri UK) who had been developing with accessibility in mind for years. We also got help from a blind user at the beginning of the project to help us establish requirements, and also had 2 testing sessions (predominantly UI-focused), first with non-visually impaired and then also with 8 visually impaired users. The visually impaired users found the design clear and intuitive, and especially found the focus mode and the dark theme very useful. The general feedback was very good, as the users found the high costumizability incredibly useful, while at the same time not finding the design too cluttered due to our "hide sidebar" feature. Even when asked to be very critical, the testers gave our design an average score of 8.2 / 10. We also got great feedback on this front from our partners who specifically complemented the clean and familiar design, and user-friendly features such as marker clustering.

With this in mind, we give our User Interface a score of great.

We successfully implemented all functionality according to our MoSCoW requirements. Our widget has touch-screen and voice-activated functionality, while also having a variety of customizable accessibility-friendly end-user tested features that allow easy use (high-contrast dark theme, yellow theme, focus mode, dyslexia-friendly font, marker clustering, what3words support). The integration with what3words also allows the users of the widget to quickly talk about their location in case of an emergency. We also have a community-run feature where users report additional accessibility information, enriching our datasets.

Furthermore, the geolocation API automatically finds the user's location, while the integration with GoogleMaps's API allows for street view and navigation.

With this great variety of functions, we give ourselves the score of great.

Throughout the development cycle, our team followed strict testing conventions for the backend, ensuring the database and the API were properly tested with Unit tests. We also noticed no performance issues with larger amounts of data.
As the most important part of our product is a frontend component, most of the testing was done by manual user testing. This was conducted weekly by the team and clients, and also three times by the end-users. All the bugs we discovered in these sessions were addressed.

With this in mind, we are confident in our system's stability and give ourselves a score of very good.

The system is very efficient and works perfectly also on less capable devices. We took care too call the GoogleMaps, Azure Speech and what3words APIs only when necessary to avoid any latency problems. We also ensured that only data within 10 miles of the user is displayed on the widget, ensuring fast load times. However, when deploying on Azure, we had to settle for a cheaper plan to save cost, which could be a problem if in the future the traffic to our API becomes too large.

We give ourselves the score of very good.

Our widget can be easily integrated into any webpage as a React component and adapts to fill the designated area on websites that support React. Our database migration functionality also allows for backward compatibility of the system. However, note that the widget is more suited for devices with the landscape view rather than portrait view.
We recognize this as quite a significant shortcoming, as it allows users to plan their journey at home on laptops, but only allows users with tablets to actually use the widgets on the go. Furthermore, when testing with different browsers, we realized that even though the widget works perfectly on the most popular browsers (Chrome, Safari), however, the text to speech does not work on Firefox. Even though this is not our fault, but the Azure Speech SDK - which is the UCL preferred web service, it is still a shame.

Neither mobile support nor packaging the final product as an npm package were in our Must-haves or Should-haves. However, as the project developed, we realized that in order to have a very usable product, we would have to package it up. Unfortunately, due to numerous type errors when trying to package the widget, we were unsuccessful. Because this was our priority, we also did not manage to implement mobile support. Because of this, we give ourselves only the score of adequate.

We took great care to make the backend as scalable and maintainable as possible. That is why we implemented database migrations which would allow storage of even more accessibility-related features for each datapoint in simple way. We also developed a sophisticated API framework that allows us to easily issue new API keys of different access level. This ensures maintainability of the system when both the number of users and features grows. The backend adheres to good coding practices and is well documented.

However, there is room for improvement, especially in the widget code. Even though adding new data layer functionality is relatively simple, the code should have been documented better and more effectively split up into individual files for clarity.

We give ourselves the score of good.

The project was well-managed with regular updates and clear communication between team members. We conducted weekly half-hour meetings with our partners every week before our lab sessions. This allowed us to get constant feedback throughout the project, while also forcing us to have something new to demo and show every week. The convenient time of the meeting before our sessions also allowed us to split the workload for the next week after getting feedback. We had a developer groupchat where internal deadlines were set and specifics were discussed. We also used GitHub's issue tracking functionality for major changes.

While we did manage the project well, the whole process could have been improved by also opening GitHub issues for smaller additions for better clarity. We also did not enforce internal deadlines harshly enough, which meant that workflow was significantly more congested close to deadlines.

That is why we give ourselves the score of good.

Future Work

  • If we had more time, we would first focus on implementing the following features.

  • Extension 1: TOP PRIORITY - npm package for widget
    This is the most important feature that we failed to integrate. Even though it wasn't in our original requirements, we internally agreed to package the widget into an npm file for seamless integration. Implementing this would allow developers of partner websites to integrate the widget much more easily than what the process is now, see Implementation Manual. Because we focused more on adding the required features than on integration, we ran out of time to fix the widget code's many compile-time type errors.
  • Extension 2: Mobile Support for the widget
    This is the most important Could Have functionality that we didn't manage to achieve. Implementing this would allow users of the application to see the widget clearly on a phone screen, where the design would be more fit for a vertically-orientated screen. Ideally, the sidebar would actually be on top of the widget and be collapsable to ensure maximum map area. This would allow users to easily interact with the system on the go.

  • Extension 3: Verification of User Reports
    Our widget and website allow anybody to report accessibility features / upload new data into the database. For now, we do not require any verification from these users, and we also only have functionality to manually approve / disapprove the suggestions. In the future, we would want to improve this by granting certain entities the future, we would want to improve this by granting certain entities privilege (such as charities who we can believe have reliable data), or to require a photograph as proof of additional accessibility features.

  • Extension 4: Saved User Preferences
    Implement functionality where accessibility user preferences are saved whenever users revisit the visit. This would be especially useful for visually impaired users who need high contrast mode to even properly see the options. Possibly implement with cookies.

  • Feature Extension 5: Temporary Object Data Layer
    Create functionality where certain obstacles / warnings have some sort of functionality for temporary obstacles / warnings. Data points like puddles / construction could be added and then with time become "less relevant".

  • Feature Extension 6: Enhanced accessibility features
    Increasing accessibility of the widget by further enhancing the speech interface to also allow users to set their accessibility preferences hands-free (currently the speech interface only has functionality for finding data points). Keyboard shortcuts are an accessibility standard and could be added to enhance the experience for people who cannot see the display very well.

  • Feature Extension 7: More data layers
    Collaborate with more charities and get accurate data layers other than just wheelchair services and zebra crossings. Potentially use Team 15's Sightlinks when their technology will allow to process other data points as well. It would be unrealistic (and completely out of the scope of this project), though, to implement our own system that would leverage AI to get more data.
  • Feature Extension 8: Integration with better navigation technology
    Integrate with more accessible navigation technology such as Soundscape, instead of Google Maps, which was found to have a relatively low usage among the members of the visually impaired community.