hacksmap

Inspiration

We wanted to show hackers their journey in hacking, and how they've grown to be better in their field. We also wanted to create something that will give a sense of pleasure to our hacker community, by getting a sweet summary of their hackathon journey, and seeing their hackathon partners on the map based on where do they live. We hope that people enjoy it !!

What it does

It has two options. Users can either open up their hackathon map where they'll see the map of teammates they've participated with, with the teammate's profile picture as the location markers. We also added some cute small transitions to it. Secondly, users can see their journey wrap, basically how their hackathon journey has been so far, including the projects they did, their best performing projects, the number of times they won, the number of teammates they participated with, oh and, we all have that one hackathon soulmate, with whom we do every other hackathon, that's also visible in the wrap. The wrap is a cute carousel with parts of video and personalized photo cards, with a downloadable summary card at the end, you can try it out at http://hacksmap.tech/

How we built it

• To create the basic web application, we used python's library flask as a framework. The UI part was done in normal HTML-CSS.
• To get the publicly available data, we used bs4 library.
• For implementing exact logic and methods for wrapped portion, we edit template videos and photos using Alight Motion and Canva, then edited them accordingly using python's amazing libraries like Pillow and MoviePy.
• For plotting the location of teammates we used a JavaScript library called Leafletjs.
• To deploy, we used heroku and domain.com to get the domain name.
• To design the web app we used Figma.

Challenges we ran into

• Collecting the required information from hacker's profile.
• Marking the location of all the teammates on the map with custom markers.
• We initially wanted to make a proper video, but that crossed the slug size limit on heroku, so we had to shift our idea slightly and optimize it in a way, so that last moment change was very challenging

Accomplishments that we're proud of

We encountered many small issues throughout the hackathon like getting things to properly work, optimizing it nicely and more, but we are proud to complete hacksmap in time, and make hackers remember their projects and achievements, which indeed, according to us, is very inspiring and happy.

What we learned

Getting and working with form data in flask.
Marking locations on map using javascript library.
Learnt editing photos in python
Learnt making custom carousel in CSS with flask data

What's next for hacksmap

We have a lot of plans for hacksmap. We initially wanted it to be a proper video thingy, so we would try to make it more optimized and eventually get it to perfection if we can. We'd also like to shift to AWS EC2 instead of heroku because of slug size limits.