This tutorial will help you create magical falling animations to add to your webpage. If you’re interested in floating animations, check out this tutorial here. At first glance, it may seem challenging or code-heavy to add falling animations to a webpage. However, we can easily add this effect in Hatch using our physics mechanics and…
Author: Lian A.
How to make floating animations on a webpage
This Hatch tutorial walks through the process of putting floating animations on a webpage. We’ll make our objects float up and down in the page as if they were suspended in the air. And we’ll do it with an easy, no-code approach! Just follow these instructions and watch your page come to life! To begin…
How to become an interactivity designer
How users interact with online media is constantly evolving, and the same could be said about design philosophy. As users explore different forms of creative and interactive content, their expectations grow. Thus the strategies employed by designers should reflect these new perspectives. Becoming an interactivity designer means making a mindshift from static design principles to…
2024 Web Design Challenge Showcase
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…
Here are the winning projects from our web design challenge!
It is with immense gratitude and excitement that we announce the results of our 2024 Web Design Challenge. We extend our sincere thanks to everyone who contributed their creativity, skill, and passion to make this event a success. We are privileged to have such a talented and vibrant group of creators as part of our…
Join our Hatch Web Design Challenge
Join Hatch and Design Buddies in a new web design challenge to build an interactive website with no code! Win a $1000 Amazon Gift Card for your original web design created in Hatch. With Hatch you can make a webpage an experience where visitors can explore and discover. Add no-code effects to your creative toolbox…
Use a page click to change an object’s behavior
In this walkthrough, we’ll explore how to change any object on your Hatch page, triggered by a click. By adding interactions to a page element, we can assign all kinds of behaviors to it. Click to change a color or size, make an object appear or disappear. The best part? You can set up a…
10 free web widgets to embed in your Hatch page
There are heaps of pre-built HTML and iFrame widgets you can add to your webpage or personal apps to enhance the design and functionality. Many of these widgets even have style customizations. Consider the interactivity you could add to your app with customizable widgets like weather, world clocks, countdown timers, calendars, 3D models, maps, calculators, social feeds, product catalogs, customer…
What’s new in Hatch
January 19, 2024 December 15, 2023 November 8, 2023 October 25, 2023 October 11, 2023 September 27, 2023 September 13, 2023 August 30, 2023 August 16, 2023 August 2, 2023 July 19, 2023 July 5, 2023 June 21, 2023 June 7, 2023
Make a hand-drawn webpage
With our new Draw feature available in the Hatch editor, you can create hand-drawn stickers and gifs, or make illustrated games and interactive stories. In this walkthrough, we’ll use Draw to make a hand-drawn webpage and get you started with this new tool. Drawing on the Hatch canvas Our landing page features a street down…