ShadeFindr

Walk smarter, stay shaded. Our platform generates optimized shaded routes to help you travel from point A to B while minimizing UV exposure.

Comment 2

Inspiration

Ultraviolet (UV) radiation exposure poses significant health risks in North America, particularly concerning skin cancer and eye damage. 1 in 73 Canadian women and 1 in 59 Canadian men will develop Melanoma. Additionally, more than 2.5 million Canadians are living with cataracts, that number is expected to rise to 5 million by 2031.

We've created a mapping and analysis tool designed to promote UV protection and sun exposure awareness.

What it does

ShadeFindr assists individuals with UV sensitivities in finding the most optimally shaded route from point A to B. Users can enable “Dev Mode” to track extra steps taken for shaded routes and see the percentage of sun exposure avoided. Additionally, the app offers real-time UV index updates and estimated sun exposure times for safer, more informed route planning.

How we built it

Our frontend is a webpage built with Next.js and React. We used Tailwind CSS, Recharts, and shadcn/ui for the styling and user interface, as well as the Google Maps API to display the map, the directions, and the autocomplete on the text fields. A Python script was written to convert the tree data into JSON which could be plotted on the map. The user’s trip history is stored in the browser’s localStorage.

Our shadiest-path finding algorithm was done by Dijkstra’s on an undirected, weighted graph using the Python package NetworkX. We constructed our graph by having edges weighted by how much shadow from trees and buildings covers the edge. Our shade calculation involved finding the time of day, the angle of the sun’s rays, and the geometries of the trees and buildings. We invoked API calls to OpenSourceMap to determine the locations/geometries of trees and buildings. Finally, the backend API endpoints for finding the shadiest path were implemented in Flask, responding to HTTP GET requests.

Challenges we ran into

With a team working so proactively on this project, and committing so frequently, we had merge conflicts that took away time from actual building and diving into the minutiae of Git.

The conversion of the map into a graph of nodes and edges was tricky, as this was a 2D map, not an obvious network of nodes and edges. In the end, we generated a graph based off of allowable areas by walking, within a bounding box. The calculations of the shadow covering the graph were especially tricky, as it involved approximations and sun angle calculations, depending on the day.

Accomplishments that we're proud of

  • Animating the widgets on the dashboard
  • Colour palette to create light and dark modes with accessible contrasts.
  • Shade calculations from buildings and trees, done on Dijkstra’s

What we learned

We learned how to use the Google Maps API for navigation and UI.

What's next for ShadeFindr

ShadeFindr could expand its focus by optimizing pathways that allow sidewalks to accommodate groups of three or more people walking side by side, ensuring no one gets left out. Additionally, it could enhance indoor route options for those navigating from point A to B during harsh Canadian winters, providing warmer, sheltered paths to improve comfort and accessibility. The future of ShadeFindr is bright, while we keep things comfortably shady.

Built With

Share this project:

Updates