The Responsive House Animation

The Responsive House Animation


A few months ago, Gal Shir posted this lovely and impressive animated GIF titled Responsive House on Dribbble. It features a slider that when moved from right to left, the house above it goes from 6 Rooms to 5 Rooms to 4 Rooms and then to 3 Rooms. It’s quite fascinating to look at that animation, so go ahead and check it out before reading any further.

Gal also posted a video on his YouTube channel as to how he sketched the house on paper and then turned it into a digital version using Sketch. That video is embedded below.

What’s even more impressive is that Gal’s fun little animation was actually recreated by David Khourshid in HTML/CSS/JS on Codepen. Check it out here.

How awesome is that?

[Via @r0unak]


Preshit Deorukhkar is the former Editor-in-Chief of Beautiful Pixels. He is now a Freelance Consultant, Principal at iXyr Media & SharpShutter Media. You can reach him on Twitter @preshit