BearTracks

An interactive 3D map for the Sheridan campuses, designed to consolidate scattered campus navigation info into one interactive and user-friendly platform.

Comment

Inspiration

When navigating the various Sheridan campuses, its easy to get lost or forget where some place is. After 3 years of studying here, we're still left scouring through various Sheridan websites or on Google when in need of directions, and we know there are many places that we have yet to discover. An interactive map web-app managed by fellow students sounded like a great all-in-one solution to this, and would help those new to Sheridan just as it would continue to help us third years.

What it does

BearTracks is a progressive web app using the Mapbox API to display categorized landmarks in a 3d environment around the Sheridan College campuses (we started with Trafalgar, and HMC). Based on what the user wants to see, they can select various landmarks like food places, offices, study spots, parking spots, and the list goes on. These landmarks can contain specific critical information like hours of operation or important links. The user can interact and play around with the map, discovering new places at school or planning out their visit in advance, all while enjoying the beautifully intuitive UI. If getting from place to place is still not clear, AI Bruno the Bruin will be there to explain in detail how to get to your destination.

How we built it

The app was designed using Figma. We built the front-end with React/Vite and used Auth0 for authentication. We used the Mapbox API as our main means of displaying 3d maps, and created JSON files for landmarks in both Trafalgar and HMC campuses to convert to GeoJSON for compatibility. The app leverages the Gemini API on an Express backend built with Node.

Challenges we ran into

We reached the deployment limit after our group had over 100 commits, and as such our deployment stopped working. We solved the issue by upgrading to a paid plan through a first month's free trial to ensure we could at least demo our deployment. We had challenges from making the landmarks appear in the correct locations, to things like responsiveness issues that needed to be addressed for the PWA. Many features we wanted to implement had no quick way to do so, like being able to highlight the focused wing building required each edge to be mapped manually. Our focus was predominantly in the front-end for the MVP, and so we were prepared for many front-end challenges.

Accomplishments that we're proud of

Creating a highly interactive UI that received overwhelming praise for its design, alongside our implementation of the map going beyond our expectations. Building a Bruno the Bruin chatbot to further improve the app's navigation effort was both purposeful and humorous. Creating quicker and more interesting user interactions with the help of the ⌘K command menu component. Animating the switch between different campus landmarks on the map.

What we learned

We delved deep into Mapbox, explored many location services, and made many considerations about PWAs while researching the viability of our app as a location-based social network for Sheridan students. We learnt about many things to use Mapbox the way we wanted to, like SunCalc and GeoJson (a location-oriented format of json that we needed to convert our data to to populate the map). We also employed ⌘K for the first time, and attempted to use Tempo Labs and Meshy.

What's next for BearTracks

As mentioned, we'd like to expand not only with more landmark data but by implementing more social features. We would like users to be able to share their live location to be found by friends and people looking to make new friends, helping to connect students from all programs among the divided Sheridan campuses. In addition, we'd like users to be able to post club events and activities along with their own landmarks. We also would have liked to make interacting with AI Bruno even more unique by enabling users to gain exp. to level up their personal Bruno whenever they contribute to the BearTracks app.

Built With

+ 10 more
Share this project:

Updates