The assignment was to create a prototype pertaining to anything. The only requirements were that we had to use HTML5, JavaScript, Git revision control, a server-side framework, and at least 1 third-party API (Google Maps and Evently). We also had to have distinct desktop and mobile web user interfaces, and the project had to be deployed and hosted remotely (which we did on Heroku).
Problem Statement: People are staying indoors too often, and not going out to live real-world experiences. They are bored and want more spontaneity and adventure in their lives!
We solve this problem by showing them a number of events/activities that are near their current location. We incentivize users to visit these exciting places by implementing a points system.
Program Features:
- Map with live location updates
- Event markers, with distance away from current position, and event name
- Score: each time user is close enough to event, user will be able to click on the event icon (a balloon gif). Clicking on the icon will increment the user's score.
- Leaderboard: displays top 5 users and scores, of all time
- Signup/login: uses MongoDB to store user, password, scores, and uses JavaScript to perform various operations on the database collection of "users" (finding, inserting, managing server responses)
In addition to the interface, other experience-related features I worked on implementing included:
- making the map responsive, adjusting the layout of the map and leaderboard based on the user's window size.
- playing sound effect and changing animations for "popping" a balloon when the user visits an event location
The Adventure Points team on COMP-20 demo day!
(Emai Lai, Craig Neubieser, Julie Yeung, Matt Kim)