See What One CSS Developer Did in Their Spare Time

A lone developer with a lot of CSS skills has managed to code an animated town using emojis. Not only did the programmer make the three-dimensional town, but it is also animated. The finished effect is fun and stunning in how it works. Many people use emojis in their posts on social media and texts to friends. What is unique about this emoji town is the way that it displays.

An unusual attribute of this three-dimensional piece of work is that its perspective of view can be rotated. You can look at it from above or any of the four sides. This allows you to see all of the parts moving and working together at once. It has a zoom in and zoom out feature, so you can see an individual house or character up-close if you want to.

This animated emoji town can be viewed in a variety of operating systems. It works as well on a smartphone that uses Android as it does for someone who uses the Firefox browser on a desktop computer. This is important because it demonstrates the ability to create fun effects that cross platforms and operating systems. Not all effects do that or do it well.

By showing the codes that were used in the development of the three-dimensional emoji town, the developer was able to initiate a conversation among other CSS developers. While some of those developers feel that it is too repetitive to add attributes to every block of code, others feel that a universal selector is obtuse. Each programmer seems to have his or her own idea of the best or most efficient programming techniques.

The coding for this was done in pure CSS. The developer did it just to see if it could be done. The entire project took about 20 hours of coding time. While it was done just as a skill-testing exercise, this sort of thing could be put to other uses, too. Currently, the project serves to provide inspiration to beginner CSS coders and people who are interested in adding fun visual effects on their websites. For more information click here https://codepen.io/GeorgePark/pen/MqVoYP.