Inspiration

We saw the Hack for Miami with Microsoft challenge and we were drawn to it the most out of all of the challenges. When deciding whether to focus on the history or a challenge Miami is currently facing, we decided that we wanted to focus on the founding of Miami and have users learn about it in an interactive way

What it does

This website allows a user to look into 3 of the most vital locations and developments in Miami’s history through Mia, the tour guide. As the user goes to each location, there is a short trivia quiz attached to the page to make the website more interactive. Once the user answers all of the trivia questions correctly, they can uncover a fun fact about that location.

How we built it

We worked with HTML, CSS, and javascript through visual studio code. The javascript was mainly used to transition into the different web pages and also for creating the quizzes while the HTML and CSS were used to style the pages.

Challenges we ran into

We initially wanted to make a website that is similar to google maps where once you click on a location, you can complete a mini-game and then learn about the history of that location. We wanted to create minigames such as Frogger and Pac man but after talking with a mentor, we realized that we might not have enough time to implement everything that we wanted to. So, we decided to scale down our idea and start smaller focusing on simpler interactive components such as a trivia quiz.

Accomplishments that we're proud of

We are really proud of being able to incorporate the trivia quizzes and having interactive elements on the website.

What we learned

Having never created a website before, we learned the basics of HTML, CSS, and JavaScript. Through this website, we had many times where we had to backtrack and reorder the way our elements and pages were interacting with each other so we learned how to problem solve as we were adding in elements.

We also learned the importance of testing as we go. Once we incorporated one element, we made sure to test it before we added in the other one to make sure that it was fully working

What's next for Travel with Mia

For the next steps, we want to be able to use React to incorporate a better UI. We would also love to work towards our initial idea of building something similar to google maps where a user can click on a location, play a game, and then learn the history of that site.

Share this project:

Updates