3D for the web has come a long way since the 90s! In this article I discuss 3D's history up to today's exciting technologies.
3D for the web made its first debut in the mid 90s in the form of corny animated GIFs (shown to the right). These GIFs were everywhere in the 90s web. The first debut of real-time 3D for the web was via Java applets. Applets never gained much popularity due to requiring Java and consuming quite a bit of CPU. This was an embarrassing time for 3D for the web.
In the early 2000's, Flash player took the Internet by storm with amazing fully animated presentations that we've never seen before. It wasn't long until there was a breakthrough: the release of Swift 3D (shown above). This program created the illusion of 3D in Flash by generating pre rendered 3D animation frames. Look at this sample movie - since Flash is vector based, Swift 3D's 3D had rather flat shading and mainly consisted of simple shapes.
Flash's in-house programming language is called ActionScript. In 2003 ActionScript version 2 was released and with it came the ability to 3D transform and 3D animate shapes. Finally in 2006 Papervision3D was born, an open source real-time 3D engine for the Flash platform. Papervision3D had a short life, though, as Flash was slowly diminished by the push for HTML5.
WebGL is awesome, so why don't we have stunning 3D websites by now? What's going on? First of all, Microsoft held everyone back by adding support for WebGL only recently, in 2013 for IE 11. Secondly, web designers learned their lesson from the Flash days that Flash intros and flashy interactive sites offered a poor user experience. When it all boils down, WebGL is only practical for games on desktop computers. Hopefully that will change.
Enter Unreal Engine
If you're a gamer you've likely heard of Unreal Engine. It's a popular engine for game development. In May 2013, Unreal Engine 3 was ported over to HTML5 for Firefox! Mozilla blew everyone out of the water with a 3D demo called Epic Citadel (watch on YouTube). As you can see, the quality of the engine is breathtaking when compared to WebGL. And they're still updating it! Unreal Engine 4 was ported over in March 2014 - check out this amazing demo video for it: Epic Soul. The engine still needs work, though. Currently it only runs at full speed in Firefox.
3D in Today's Everyday Websites: CSS3
There have been some incredible 3D feats with CSS3. Tridiv and Seen.js proved to everyone that it's possible to create and animate 3D models with CSS3. However it's rather CPU intensive, especially on mobile devices. Awwwards has some award-winning websites with nice 3D effects. And you must check out Keith Clark's amazing FPS demo.
The most impressive 3D animation for the web has always been seen in video. The popularity of doing so skyrocketed after Google bought YouTube in 2006. You don't have to worry about plugins, compatibility, or the user's CPU when your 3D is rendered to video. When it comes to mobile web browsers, video is currently the only way to effectively display any 3D presentation.
From corny animated GIFs to exciting WebGL real-time graphics, 3D for the web has come a long way! However it's still in its infancy. It's an exciting time to work with the web right now, don't you think? We get to see new technologies like this mature as our computers/devices evolve.