MarkingWithTech

• 

  Viewing a mark.

Inspiration

We were standing in line for funnel cake when we came up with this idea — a web platform where you could make your mark on the planet.

What it does

MarkingWithTech connects every person around the world through Marks, and messages that you drop on the map at your location. The Marks that you leave are there for the rest of the world to appreciate. Whether you are commemorating your trip or leaving a fun message, MarkingWithTech gives you the platform to share your thoughts and memories with the world. In addition, discover nearby Marks in Augmented Reality (AR) on your smartphone.

How we built it

We built MarkingWithTech using NextJS and ReactJS using the TypeScript language. The first feature we completed was the map view, which utilizes the Leaflet library to render OpenStreetMap data. Then, we implemented Marks functionality, using Material UI ReactJS components along the way. The Augmented Reality experience was built with WebXR.

Challenges we ran into

In the beginning stages of the MarkingWithTech, we ran into significant layout issues with the map rendering. After careful troubleshooting, this issue was resolved. Time management was also a challenge.

Accomplishments that we're proud of

We are proud that we have delivered a product that delivers the intended experience. Developing the project involved much effort that resulted in the completed product.

What we learned

We as a team learned how to collaborate with each other on a complex project such as this one. Some members of our team were new to ReactJS and web development in general. Building MarkingWithTech gave us valuable learning and experience with these technologies.

What's next for MarkingWithTech

We plan to enrich the user experience with additional features such as different Mark types. We plan to market MarkingWithTech to the world and build a userbase.

Built With

• css
• javascript
• leaflet.js
• materialui
• nextjs
• openstreetmap
• react
• typescript
• webxr