Our 2024 Web Design Challenge was a great success and we’re thrilled to share more details about the winning projects. Get inspired by these portfolios, games and interactive spaces, made only in Hatch!
3rd Place: songs by @propsongs
Our third place winning Hatch project features an entire music album. The artist known as props shared ten songs on individual pages with the details behind each song. The whole collection provides a unique insight into the creative process of a musician.
Each page features unique gifs and animations, making it a visual and auditory treat.
2nd Place: Dress Game by @eyvagamboa05
The 2nd place entry is a super cute dress-up game! You have a lot of clothes to choose from, as well as different hairstyles and skin colors. Try to mix and match until you find the perfect outfit!
Try remixing this project (which will open in the editor) to learn how to make cool trigger interactions. The project features some simple yet ingenious ways to display different elements across the page. It’s a great way to get started in Hatch.
1st Place – Lollopunk’s World by @lollo
In first place we have a delightful interactive room brimming with imagination. Lollo filled every corner of the space with surprises and things to explore. You can tell there’s a story behind every little element in the page.
Check out how the eyes of the fox plush follow your cursor around. Try clicking on the controller or the movie stack. Try to find the collectible items- they’ll show up on the shelf on the top right.
Along with the design of the room and the individual interactions, the whole page holds an amazing secret. Here’s a hint, there’s a key hidden behind one of the plushies. Can you solve the puzzle?
Along with our placed winners, we also have four Honorable Mentions.
Honorable Mention: Table Recipes by @lupe
Lupe brought some culinary expertise to this Hatch project. Browse the picnic table and click on a dish that catches your eye. The recipe for that dish with appear. There’s even a little bee friend that follows you around! This is a great example of how creative web design can transform information into an opportunity for interactivity.
Honorable Mention: Lucia’s Room by @jasm1nii
Lucia the Android is recovering after her last big battle. As her friend, you really shouldn’t be snooping around her things, but here we are! By hovering over different objects on the screen you can learn more about this mysterious figure. This project highlights how an original character can be introduced in a unique, immersive way.
Honorable Mention: Typewriter by @willowtree
Up next we have an immersive story with the feeling of a minigame and some lovely animations. Watch your screen come to life as you type in each letter. Watch how the typewriter carriage moves and types along with you. Soon you’ll leave the city behind and be transported to an imaginary world.
Honorable Mention – Light Waves by @ulytheunicorn
Uly has a visual treat in store for page visitors! The GIF above doesn’t do the project justice, so we recommend you check it on your own. Clicking on any dot will result in a colorful chain reaction that evolves in complexity as you click on more. Get some cool patterns going by clicking in various places.
Check out some more submissions in our community gallery here.
Hatch will be running more events like this throughout the year. Register with us to be notified of the next web design challenge: hatch.one/register We look forward to continuing this journey of creativity and collaboration with you all.