Codementor’s First Ever Hack Day: New Ideas, One Hack at a Time
We recently held our first hackathon 🎉. Hack Day has been on our bucket list for a while. Not only was it a great opportunity for our team to explore our creativity, but it also provided a way to improve our product and internal tools. Earlier that week, our dev team hosted a brainstorming session, and our entire team pitched ideas. It was truly amazing — you could feel the creative energy flowing around the office!
After a round of voting, our dev team broke off into separate teams and chose the following ideas:
The rest of this post will illustrate the four hack ideas and our developers’ process:
Why Look at Datasheets When You Have a Real-Time Globe
Our team was tired of looking at numbers 😅. Instead, we wanted to have real-time map visualization of user activity to help us better understand our users. We were thrilled to see users from around the world using the platform — also, real-time data visualization is just super cool!
We used Three.js for WebGL rendering, and Firebase for real-time data and events. The world map tracks chat activity, transactions, and live sessions. Here’s what the colors mean:
- Red = Sender
- Green = Receiver
- Blue = Message going through
- Yellow = Payment
FYI: the bigger the yellow surface area on the map, the more money is being generated from that location.
Surprisingly, we spent less than three hours building the data visualization. That’s why teamwork is important! I honestly think we were only able to do this so quickly because we split the work to play to everyone’s specializations 😎.
Goodbye Standard 404 Page
Do you remember that running dinosaur error page for Google Chrome? Well, we just created something on that level 😏. We thought it was time to switch up the standard error 404 page, which can sometimes cause minor stress for our users, to something that was more interactive and fun!
We found a coding script of a game called EaselJS that was 80% completed and adapted it to fit our needs. In the original game, players had to shoot stones using an arrow-shaped mouse. We changed the mechanics so that our users had to keep their spacecraft away from meteorites. We chose a space concept because we thought it was a better fit for the 404 page — I mean, you’re pretty much “lost in space.”😂
Check out our new 404 page here.
Ring Ring - Good News Alert
By Yang Hsing
Originally, my plan was to create a physical alert, such as having a red light flash whenever something good happened (i.e. reaching a monthly revenue goal, releasing a new feature, etc). However, because of how challenging it was to find the appropriate components for the device, I decided to switch gears and create an alert system that does not include flashing lights 😅.
I used Slack’s platform and programmed our #random channel to spin the figurine whenever someone types
/cm-alert. I did find the project challenging, initially, because it was my first time connecting a physical object to an online platform. However, I had a lot of fun and enjoyed starting from having no working knowledge to overcoming the problems I faced 💪.
Transform Standard Messages into LED Messages
My interest in creating LED messages was inspired by Google’s Interactive Wall 😂. Since it was my first time making LED messages, I decided to create something a bit simpler and used Webduino, a way to use Node.js to control Arduino.
From the video, you can see characters passing through the display screen one at a time. Even though the amount of precision involved in connecting each wire to the appropriate channel was quite high, I had fun working with something new.
What Should We Work on for Our Next Hackathon?
Hack Day is a great way for team members to spend time on projects that they wouldn’t have otherwise worked on! Not only did our devs enjoy the opportunity to work with new technologies, but this experience also boosted our team morale 😍.
We loved sharing the results of our Hack Day with you! Have you participated in a hackathon before? Do you have any ideas for our next Hack Day? Let us know in the comments or in your own post!