Engage AR Map

Modernizing Urban

Navigation & Engagement

• Eliminated invalid routes Removed all cases where paths terminated inside buildings or passed through unwalkable areas, making navigation feel reliable and production-ready. • Enabled true accessibility-first navigation Introduced wheelchair-safe routing that avoids stairs and inaccessible entrances, ensuring users are never sent onto impossible paths. • Resolved multi-entrance ambiguity Accurately routed users to the most appropriate building entrance instead of the building centre, reducing confusion and missed destinations for large venues. • Improved user trust in navigation Clear entrance targeting and instant route updates when constraints change, so the system behaves the way real-world spaces do. • Established a scalable navigation foundation Created an architecture ready for indoor routing, multi-floor navigation, and access-controlled paths without requiring future rewrites. • Shifted the product from prototype to production quality The system now adheres to the same architectural principles employed by commercial navigation platforms, enabling real-world deployment rather than demo-only usage.

This project was part of building a custom, city-scale navigation experience using Next.js 14 and MapLibre GL JS. The initial implementation functioned as a basic point-to-point routing prototype, suitable for demos but not real-world use. As the scope expanded to support dense urban environments, large buildings, and accessibility requirements, limitations in the original architecture became clear. The system lacked proper handling for building entrances, accessibility constraints, and real-world walking behavior, resulting in unreliable routes and poor user trust. The goal of this project was to refactor the navigation system into a commercial-grade architecture—comparable to modern navigation platforms—while keeping it flexible enough to support future features such as indoor navigation and multi-floor routing.

The existing navigation system was built as a simple point-to-point prototype and did not reflect how people navigate real-world urban environments. Key challenges included: • Routes passed through buildings Paths were calculated to building centroids, causing routes to visually and logically cut through unwalkable areas. • Destinations were ambiguous and unreliable Large buildings with multiple entrances were treated as a single point, often directing users to inaccessible or incorrect sides of the building. • No accessibility support The system had no way to avoid stairs, escalators, or inaccessible entrances, making it unusable for wheelchair users. • Tight coupling between UI and routing logic Business data, navigation targets, and graph logic were intertwined, making the system fragile and difficult to extend. • Prototype-level assumptions blocked scalability Adding features like indoor navigation, multi-floor routing, or access-controlled paths would have required a full rewrite. The core challenge was transforming a visually functional map into a trustworthy navigation system that respected real-world constraints while remaining scalable and maintainable.

1. Audit & Problem Framing I began by auditing the existing navigation system to understand why routes felt unreliable and “prototype-level.” Key issues identified: • Routes terminated at building centroids, not real entry points • Paths visually passed through buildings • No architectural support for accessibility • No way to handle multiple entrances for large buildings I reframed the problem from “drawing paths between two points” to “resolving real-world destinations the way commercial navigation systems do.” 2. Research & Benchmarking I studied how commercial navigation platforms (e.g. Google Maps–style systems) handle: • POIs vs entrances • Walkable graph construction • Accessibility-aware routing • Entrance selection for large buildings This revealed a key insight: navigation systems never route to a place — they route to an access point. That insight drove the entire architectural redesign. 3. System Architecture Redesign I redesigned the navigation system around clear separation of concerns: • Business (POI) → visual & search only • Entrance → physical access point with metadata • Graph Nodes & Edges → pure routing logic This removed ambiguity and made the system scalable. Entrances became first-class entities instead of hidden heuristics. 4. Accessibility-First Routing Logic I introduced an Accessibility Mode as a real system constraint, not a UI toggle. Design decisions: • Entrances are filtered by accessibility before routing • Graph edges carry isAccessible metadata • The pathfinding algorithm strictly forbids inaccessible paths (e.g. stairs) • Routes recalculate instantly when the toggle changes This ensured wheelchair users are never routed onto impossible paths. 5. Graph Validation & Data Integrity Instead of detecting collisions at runtime, I focused on graph correctness: • Nodes exist only on walkable surfaces • Edges are curated to skirt buildings • Buildings act as implicit “no-go zones” By enforcing correctness at the data level, runtime routing becomes fast, predictable, and safe. 6. Dynamic Entrance Resolution For buildings with multiple entrances, I implemented dynamic entrance selection: • Evaluate all valid entrances for a destination • Choose the closest viable entrance based on user position and constraints • Apply hysteresis logic to avoid constant entrance switching during movement This mirrors real-world navigation behavior and removes user confusion. 7. UX Integration & Feedback To make the system understandable and trustworthy: • The UI clearly shows which entrance the route targets • Accessibility state is visible and meaningful • Routes update immediately when constraints change This bridges complex system logic with simple, human-readable feedback. 8. Future-Proofing The architecture was designed to scale: • Indoor navigation (entrances as bridge nodes) • Multi-floor routing • Staff vs public access rules • Additional mobility constraints No core refactor would be required to support these features later. Outcome This process transformed the project from a visual map demo into a production-ready navigation system, demonstrating systems thinking across UX, data modeling, and algorithm design.

I redesigned the navigation architecture using industry-standard principles: 1. Separation of Concerns • Businesses (POIs) are now purely visual (map pins & search results) • Entrances are explicit routing targets, each linked to a walkable graph node • Graph nodes & edges contain no UI logic, only navigable geometry 2. Entrance-Based Routing • Each building supports multiple entrances (Main, Accessible, Service) • Navigation dynamically selects the best entrance based on user location and preferences • Prevents routing users to building centres or inaccessible loading docks 3. Accessibility-Aware Pathfinding • Introduced an Accessibility Mode that: • Avoids stairs and escalators • Selects accessible entrances automatically • Recalculates routes instantly when toggled • Accessibility constraints are enforced directly in the A* pathfinding algorithm 4. Clean Graph Design • Routing graph curated so paths never intersect buildings • All geometry validation happens at graph-creation time • Runtime routing remains fast, predictable, and deterministic