What's Blender and Why Does It Matter to Web?


PublishedPublished August 3, 2014

Tags3D > Blender

A screen shot of Blender

A screen shot of Blender's interface with a work-in-progress 3D model

Did you know you can produce Pixar quality movies for free? It's true! You can do it with Blender, found at www.blender.org. Blender also has high potential to become an essential program for web designers. So how is Blender so awesome and why is it important? I explain everything below.

What's Blender?

To begin with, what is Blender? The short explanation: Blender is a free 3D modeling and 3D animation program. Wikipedia explains it as:

Blender is a professional free and open-source 3D computer graphics software product used for creating animated films, visual effects, art, 3D printed models, interactive 3D applications and video games. Blender's features include 3D modeling, UV unwrapping, texturing, raster graphics editing, rigging and skinning, fluid and smoke simulation, particle simulation, soft body simulation, sculpting, animating, match moving, camera tracking, rendering, video editing and compositing. Alongside the modelling features it also has an integrated game engine.

So yeah, Blender can do a lot! You might be thinking “I don't know... that's great Blender can do so much, but it's free. I'm sure it's not that great.“ That's an understandable reaction since free software usually doesn't compare to premium software. Blender, however, is one of the few free & open source programs out there that can compare to premium software! Blender is such a high quality program that it can produce Pixar quality films. Don't believe me? Watch these Blender movies and you be the judge:

Is Blender hard?

At this point you might be thinking “That's great that Blender can produce awesome films like that, but I highly doubt I'll ever be able to do anything like that in my lifetime. I bet Blender must be really hard to use.” Blender is hard if you want it to be. When you look at Blender for the first time it's going to look complicated. But the complexity is not far from say, learning Photoshop or Illustrator. Photoshop looks complicated the first time you open it, too. Just like learning to use any other program, it takes some patience and dedication. Most importantly, you have to want to learn it.

Realistically, what could you do?

To further show you that Blender isn't so hard, I'm going to get realistic. What could you, a normal person, do with Blender? I'll use myself as an example. I'm just an average guy, far from producing any kind of stunning realistic art. I just casually use Blender every now and then. I'll show you some of the average things I've done with Blender, starting from the beginning and my improvement from practice.

Blender is the future of web?

As I discussed in my article, The State of 3D for the Web, it's possible right now to create real-time 3D graphics for web browsers via WebGL. And what program can you use to create 3D models for WebGL? Why Blender, of course! Real-time 3D in websites isn't common right now, but I believe it will be. Blender is the best option because of two reasons:

  1. The cost of premium 3D software is in the thousands. I posted the exact amounts below. Employers typically only provide web designers with the Adobe suite. If they're lucky they have the new Creative Cloud, but they're more than likely stuck several versions behind with CS4 or CS5 due to their employer being cheap. With such circumstances, employers would never buy thousand-dollar 3D software for their web designers.
    • 3ds Max - The most popular for video game production. Costs $5,775.00, or $185.00 a month.
    • Cinema 4D - Very popular for motion graphics. Costs $3,695.00.
    • Maya - It used to be #1, but still very popular. Costs $5,775.00, or $185.00 a month.
  2. Adobe doesn't have a fully featured 3D modeling program, nor do they have plans to ever do. Yeah Photoshop and Illustrator can produce some 3D, but it's very basic and nowhere near what a fully featured 3D program could produce.

A sample WebGL experiment: Aquarium.

How is Blender used for web?

The workflow is simple. You make a basic model in Blender and export it as an object file (.obj). Then you use a WebGL framework such as Three.js or Babylon.js to manipulate your object file in the web browser. It's hard to say which framework is better. Both frameworks have really impressive examples in their official sites. This article breaks it down well: Three.js and Babylon.js: a Comparison of WebGL Frameworks. The following is my brief breakdown.


Three.js is an older library that originated from ActionScript back in the days when 3D via the Flash Player was all the rage. It can render 3D with SVG and HTML5's canvas element in addition to WebGL. Check out the Three.js tutorials on YouTube to learn how it works.


Babylon.js is a newer library by Microsoft that originated from Silverlight. Its strength is in game development, with features like collision detection and antialiasing. Check out the Babylon.js tutorials on YouTube to learn how it works.

Hope for the future

Does all this look complicated? I predict that it won't seem complicated for long. Once it becomes commonplace to use real-time 3D in websites, people will release JavaScript libraries to make it easier. After all, people created jQuery to make JavaScript much easier. And look what happened: jQuery revolutionized the web and took it to a new level. I think it'll just be a matter of time until a similar feat happens with WebGL.

x3dom made the first step to make bringing real-time 3D to the web easy (for free). With their Blender plugin and scripts, within minutes you can transfer your 3D model into a web page! The only drawback is that you're limited to their template. Blend4web is another company aiming to make the 3D-to-web process easy by providing a (free) Blender plugin and framework.

Blender Resources

Blender has been around since 2002! Naturally, a free program of this age has attracted a great deal of support.

And I recommend the following books.

Blender Foundations: The Essential Guide to Learning Blender


See, Blender is awesome. It's a sweet deal to have a free program that can do everything a $3,000 program can. Blender could be taken in so many directions:

  • You can be like me and be a casual 3D hobbyist.
  • If you're aspiring to become a film producer and you're tight on funds, you can use Blender for all of your special effects.
  • Graphic designers and web designers could use Blender to create 3D models to be exported in 2D as PNG with a transparent background. They could also convert animations to animated GIFs.
  • Do you love 3D animated movies and you're skirting with doing it professionally? Try Blender!

Tags: Blender

comments powered by Disqus