Inspiration

Cities are getting hotter, and that changes how people move through them.

During extreme heat, even a short walk can become uncomfortable enough that people choose to drive instead. That creates a frustrating cycle:

hotter cities → less walking → more driving → more emissions → hotter cities

Shade Navigator started from a simple observation: two sidewalks only a block apart can feel completely different depending on trees, buildings, and the position of the sun.

Most navigation apps optimize for only distance and time. But on a hot afternoon, the shortest route is not always the best route.

We asked:

What if navigation understood heat and shade?

Shade Navigator is a climate-adaptive navigation system that finds walking routes designed to maximize shade while still keeping trips practical.


What it does

Shade Navigator analyzes the urban environment and assigns each section of the pedestrian network a shade profile.

The system considers:

  • Tree canopy
  • Building shadows
  • Sun position
  • Time of day
  • Vegetation density
  • Route distance
  • Nearby cooling and hydration resources

Instead of simply choosing the shortest path, Shade Navigator can recommend a slightly longer route when it provides significantly better shade coverage.

For example, instead of saying:

"This is the fastest 12-minute walk."

Shade Navigator can help answer:

"This route takes 14 minutes, but keeps you in shade for much more of the trip."


Satellite-based tree detection

Trees are one of the most important sources of urban shade.

We use Google Earth Engine and satellite-derived vegetation indices including NDVI, NDWI, and GNDVI to identify vegetation and estimate tree locations.

Our Philadelphia prototype identified and mapped 703 trees that can contribute to route shade.

This allows Shade Navigator to use environmental information that is not normally represented in a navigation graph.


Dynamic shadow modeling

Shade changes constantly throughout the day.

A building that shades a sidewalk in the morning may leave the same sidewalk completely exposed several hours later.

Shade Navigator calculates shadow behavior using:

  • geographic coordinates
  • sun position
  • date and time
  • building footprints
  • estimated building heights
  • tree locations

The resulting shadows are projected onto the pedestrian street network.

This means the routing system is time-dependent: the best route at 9 AM may be different from the best route at 4 PM.


Shade-aware pathfinding

We use OpenStreetMap data to construct a walkable street graph.

Traditional routing can treat the cost of traveling across a street segment as simply:

$$ Cost(e)=Distance(e) $$

Shade Navigator instead uses environmental information as part of the routing decision:

$$ Cost(e)=Distance(e)+HeatPenalty(e)-ShadeBenefit(e) $$

Using NetworkX and custom graph-weighting logic, the routing engine can balance walking distance against shade coverage.

This turns navigation into a multi-objective optimization problem rather than a simple shortest-path problem.


Buildings + trees

Tree canopy alone does not tell the full story.

In dense cities, buildings can produce enormous areas of shade. Shade Navigator therefore combines both natural shade and built-environment shade.

We use OpenStreetMap building footprints and available height information to estimate how building shadows move as the position of the sun changes.

This allows Shade Navigator to recognize streets that may have very few trees but still become comfortable walking corridors during certain times of the day.


Heat-aware waypoints

Sometimes the best route is not simply the route with the most shade.

Shade Navigator can also incorporate useful intermediate locations such as:

  • water fountains
  • convenience stores
  • indoor spaces
  • refreshment locations

These waypoints are connected to the pedestrian graph so they can be incorporated into a route without creating unrealistic detours.

The prototype also supports environmental information such as temperature and UV conditions.


How we built it

Shade Navigator combines remote sensing, geospatial analysis, graph algorithms, and web development.

Frontend

The interactive mapping interface was built using:

  • React
  • TypeScript
  • Vite
  • Leaflet

Leaflet renders routes, geographic information, shade data, and interactive map elements.

Backend

The backend is built with Python and FastAPI.

Our geospatial stack includes:

  • Google Earth Engine for satellite imagery analysis
  • OpenStreetMap / OSMnx for pedestrian networks and urban data
  • NetworkX for routing algorithms
  • GeoPandas for geospatial processing
  • NumPy and Pandas for environmental data processing
  • Folium for geographic visualization and experimentation

Our pipeline looks roughly like this:

Satellite imagery
        ↓
Vegetation analysis
        ↓
Tree detection
        ↓
Tree shadow estimation
        ↓
                         → Combined shade model
        ↑
Building footprints
        ↓
Building shadow estimation
        ↓
Street-edge shade profiles
        ↓
Shade-weighted routing graph
        ↓
FastAPI
        ↓
React + Leaflet interface

Challenges we ran into

Too much geographic data

One of our biggest challenges was actually having too much data.

An early version of the system generated roughly 5 GB of JSON containing detailed geographic polygons for buildings, trees, and shadows.

Trying to display all of that information at once caused severe performance problems.

We had to rethink the architecture and experiment with:

  • preprocessing expensive calculations
  • graph segmentation
  • caching
  • reducing polygon complexity
  • smaller serialized datasets
  • separating offline computation from interactive rendering

This taught us that environmental accuracy is only useful if the resulting system is fast enough for someone to actually use.

Incomplete city data

Another challenge was that real-world geographic data is not perfect.

For example, OpenStreetMap often provides building footprints but does not always include accurate building heights.

Since building height affects shadow length, we had to design fallback strategies using whatever metadata was available rather than assuming a perfect dataset.

This was one of the biggest lessons from the project: climate-tech software has to work with uncertainty.


What we learned

Building Shade Navigator pushed us into several areas we had never worked with deeply before.

We learned about:

  • remote sensing
  • satellite imagery
  • vegetation indices
  • geospatial coordinate systems
  • solar geometry
  • computational shadow projection
  • OpenStreetMap
  • graph theory
  • geospatial optimization
  • large geographic datasets
  • performance optimization

The biggest conceptual lesson was that navigation does not have to mean finding the shortest route.

Once environmental information is added to the graph, routes can instead be optimized for things such as:

  • heat
  • shade
  • air quality
  • accessibility
  • pollution
  • safety
  • energy expenditure

That completely changed the way we thought about navigation software.


Accomplishments that we're proud of

We were able to build an end-to-end prototype combining multiple environmental systems into one routing experience.

Some of the accomplishments we are most proud of include:

  • Detecting and mapping 703 trees
  • Processing satellite-derived vegetation information
  • Generating tree and building shadow estimates
  • Profiling pedestrian street segments based on shade
  • Creating shade-aware route optimization
  • Integrating OpenStreetMap pedestrian infrastructure
  • Adding useful environmental waypoints
  • Building an interactive map interface
  • Turning very large geospatial datasets into something practical enough to use

Most importantly, Shade Navigator shows that climate adaptation does not always require entirely new infrastructure.

Sometimes software can help people make better use of the trees, buildings, and shade that already exist around them.


Environmental impact

Shade Navigator addresses two connected problems: urban heat and car dependency.

As cities experience more extreme heat, walking becomes less attractive. If technology can make walking more comfortable, some short trips that might otherwise become car trips can remain pedestrian trips.

The same environmental data can also help cities understand where their infrastructure is failing pedestrians.

By analyzing the shade coverage of entire street networks, Shade Navigator could identify shade deserts: pedestrian corridors with consistently poor protection from the sun.

That could help cities make better decisions about where to place:

  • new trees
  • shade structures
  • cooling stations
  • water fountains
  • pedestrian improvements

Shade Navigator can therefore support both:

People: Find cooler routes today.

Cities: Build cooler streets for tomorrow.


Existing project disclosure

Shade Navigator began as ShadeNav, originally developed during PennApps XXVI in September 2025.

Before NextStep Hacks 2026, the project already included the initial Philadelphia prototype, satellite vegetation analysis, tree detection, building and tree shadow modeling, OpenStreetMap graph generation, shade-aware routing, waypoint routing, a FastAPI backend, and a React/Leaflet frontend.

For NextStep Hacks, we are transparently continuing the project rather than representing the original implementation as newly created during this hackathon.

Our goal is to evolve Shade Navigator into a broader climate-adaptation platform focused on heat-aware mobility, urban shade analysis, expanded geographic coverage, and tools that help cities build more walkable communities.


What's next for Shade Navigator

We want to expand the system in several directions.

Multi-city support

Extend Shade Navigator beyond Philadelphia to cities experiencing severe urban heat, such as Dallas, Phoenix, Houston, Miami, and Austin.

Shade desert analysis

Build a city-level dashboard showing areas where pedestrians have very little access to shade.

Strategic tree placement

Use graph importance and shade deficits to identify locations where planting a tree could improve the largest number of pedestrian routes.

Extreme-heat routing

Combine shade with:

  • heat index
  • UV exposure
  • air quality
  • cooling centers
  • hydration locations

to create routes designed specifically for dangerous heat conditions.

Accessibility-aware routing

Combine climate-aware routing with information about wheelchair accessibility, crossings, sidewalk conditions, and mobility needs.

Community reports

Allow users to report newly planted trees, temporary shade, unavailable fountains, construction, or unusually hot areas so that the environmental model can improve over time.


Our vision

Navigation apps transformed the way people move through cities, but most of them still treat the environment surrounding a route as irrelevant.

Climate change makes that assumption increasingly unrealistic.

The shortest route is not always the most comfortable route.

The fastest route is not always the safest route.

Shade Navigator imagines a future where navigation understands the physical environment around us.

A future where a map doesn't just know where you are going, but also understands what it will feel like getting there.

Our goal is simple:

cooler streets, more walking, and cities designed around people instead of heat.

Built With

Share this project:

Updates

Submission history