“Mini Hackaton”

Giovanna Shiroma
2 min readMay 15, 2019

During our last week of content at Iron Hack we had a one-day competition after a whole week learning about HTML5 and CSS. We were paired up randomly and given the following briefing: build a landing page with the theme vacation. We had from 9am to 5pm to come up with an idea, code and present to our teachers and colleagues.

Once again i had the chance to work with Constance, a great partner for working! We synced really well and were able to do everything very quickly. She already had an idea of creating a space for kids to hang out during their vacation, where they would find a lot of activities culture related to do.

From that idea we started to discuss the activities we would find there, like puppet shows, choir, story telling, etc. and the name of such space. We wanted to give a sense of security to parents and a playful look to children, which directed us to create the name “Lodge of little wolves” (i don’t know if that sounds as cute in English, but i guarantee you that in Portuguese it does haha).

These information were enough to create the website (as it was a simple landing page) so we started right away to pair code in html and css. There was no time to go on Sketch for high fidelity wireframes, we used paper and pencil and did the rest on screen, testing colors and font sizes while coding. We tried to use the most of what we learned during that week: media-query, animation, flex-box and so on.

Final result:

Section 1 (the fireflies are animated ❤)
Section (2)
Section (3)

At the end, we won the mini hackaton!! We were soo happy and we even got starbucks gift cards :D. Our colleagues did amazing work as well, one pair created a travel agency for young people and the other team came up with a company that rented vintage cars, both super cool ideas!

You can check out our code at GitHub!

Credits for the illustrations: forest and activity icons

--

--