Inspiration

Do you miss traveling? Us too. The COVID-19 pandemic has cancelled in-person experiences and the excitement of travel has been put on pause. Since the thrill of visiting a new city and learning all about its culture has been taken away, we decided to create Bridging Borders. This website educates people about diverse cities all over the world and how they can have similar experiences while staying home. Passionate about web development and web design, we wanted to showcase our skills in programming and creativity during this hackathon on a topic that we care so deeply about. Try it out.

What it does

The website opens on a home page and an explore page consisting of different cities around the world. You can click on "Explore Cultures" and it will lead to a page with a random city to learn more about. The page will give a description of the city’s distinctive features such as its people, history and culture that set it apart from other cities in the world. If you find something particularly interesting, there are links to learn more about it or otherwise immerse yourself further without ever leaving your house! 

How we built it

We started by mocking up the site's design in Figma as a prototype. We wanted to build an approachable website with a modern feel. We researched various cities and developed interesting content about their cultures and prime destinations. After that, we used HTML/CSS and Javascript to bring the designs and content to life. We worked collaboratively on GitHub to complete various aspects of the website.

Challenges we ran into

Since we are novice programmers who were unfamiliar with HTML/CSS and GitHub, we primarily learned how to code in these languages during the hackathon while meeting as a team to come up with a finalized product. Originally, in our Figma prototype, we were planning on making a quiz that would generate a city that aligned most with the options the user chose. However, we were unable to compute an algorithm like that in such a short span of time with limited knowledge in Javascript. To solve this problem, we decided to create a simple algorithm that generates a random city and leads the user to a new page after they clicked on "explore cultures". Furthermore, since we were inexperienced in GitHub, we had to accustom ourselves with pull/push and use the terminal on visual studio to be able to work collectively on the code.

What we learned

This hackathon was a great opportunity to familiarize ourselves with new languages and platforms. We now have a foundational knowledge of web development and the code behind websites in general. Attending workshops and learning from teammates who are more comfortable with the languages and platforms helped us build a more solid knowledge in HTML/CSS, Figma, and GitHub. We also learned how to work as a team remotely in various time zones and work under a time limit.