However this doesn’t help much if your updating from different coffee shops, or cities for that matter, on a regular basis. For an easy fix use WordPress “if user logged in” function.

if ( is_user_logged_in() ) {
//Also a good place to add scripts specific to logged in users.
} else {
//script code
 var _gaq = _gaq || [];
 _gaq.push(['_setAccount', 'UA-8062446-2']);
 _gaq.push(['_trackPageview']);
 _gaq.push(['_trackPageLoadTime']);

 (function() {
   var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
   ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
   var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
 })();
//script code
}

Now, no matter where, if you are logged in your constant reloads won’t affect your analytics.

1. Setting up SSH

I have setup the 2 Windows boxes on the render network with Cygwin, it has a lot of support online for troubleshooting and setup. Both machines are Windows XP but with some adjustment this should work on any version.

Head over to http://www.cygwin.com/ for the download and there are a few articles around on the commands and setup http://lifehacker.com/179514/geek-to-live–introduction-to-cygwin-part-i and there is also a solid setup by setup for setting up the SSH connection in Windows http://pigtail.net/LRP/printsrv/cygwin-sshd.html. I’ll go over the specifics for Blender setup and commands below.

There is a bit more setup to Cygwin for Windows as a network drive makes the whole process easier. You can map a network drive in Windows but when rendering through the command line Blender won’t see the that network drive, therefor drive needs to be setup through Cygwin. Startup a Cygwin prompt and use the

net use

command. By default the command will output what network drives are connected but with a few parameters we can use it to map a network drive. To connect to a drive type

net use f: '\/\/192.168.10.1\/sharename' '/user:192.168.10.1\/username' password

Your mileage might vary on the syntax but that should setup the drive to connect on startup.

2. Blender Node Startup Files

Blender setup for Windows have Python prepackaged and ready to go, however there we need to build a .blend file to use as the slave and master node startup files.

First enable the network render plugin under User Preferences > Add-Ons. This will enable the network render option in the dropdown at the top which is set to “Blender Render” by default.

After switching to the “Network Render” option at the top find the render options on the right, wherever your properties panel is, and select slave and fillout the network data as needed. Note the “Path” here is for temporary files, when starting the render the scene file sets the output directory. Save this file out as node.slave.blend.

A master node startup file is also needed but since all of the network settings are the same you can simply click the “Master” option and save out the file again as something like “node.master.blend.”

3. Blender Command Line

Now that you have Cygwin, Blender, and .blend files with for the nodes we can test the whole setup. For testing, you can startup all the Blender instances on the current machine; master, slave and client, using “localhost” for all of the addresses. The reference for the syntax is available here, but this changes a bit through Cygwin. To get the proper directory use the full path:

'C:/Program Files/Blender Foundation/Blender/blender.exe'

Followed by:

-b 'z:\/file.blend' -a

The -b switch for identifying the path for file.blend and -a indicating it’s an animation not a single frame. The full command is:

'C:/Program Files/Blender Foundation/Blender/blender.exe'-b 'z:\/file.blend' -a

Now that we have the syntax down we can startup our nodes.

Blender Master Node

For notes on what the master node does refer to my previous post on the overall Blender Networking setup . To startup the node use:

'C:/Program Files/Blender Foundation/Blender/blender.exe'-b 'z:\/node.slave.blend' -a

Blender Slave Node

Both the master and slave are launched and then left alone so they have the same command structure. (Note the examples are from a Mac terminal but the result will have similar information on all platforms.)

'C:/Program Files/Blender Foundation/Blender/blender.exe'-b 'z:\/node.master.blend' -a

Blender Client Node

The last step is to have the client send out the job. You can either send a file through the command line or you can send it from a running instance of Blender. Either way the important step is to make sure the file has the network information setup up and the file set to use “Network Render.”

That should do it for getting you renders out over the network, command line included. Next I’ll go over the same process for Ubuntu and OS X. In a future post I will also go over adding remote nodes to a network with tunneling and/or port forwards.

I altered the code a bit for my uses, however, as I’d still like the search engines crawling around my site so I stripped the code down to:

add_filter( 'the_category', 'add_nofollow_cat' ); 
function add_nofollow_cat( $text ) {
$text = str_replace('rel="category tag"', "", $text); return $text;
}

Now the W3 Validator has one less WordPress quirk to pickup on.

By default a material will not receive shadows based on the texture but on the geometry of an object. As seen here:

To fix this, go to the receiving material’s proprieties and click “Receive Transparent.”

Now the shadows are based on the texture:

A simple fix, but if you are coming from a 3d software using clip maps or settings on the texture this can be a bit difficult to find. I will be taking a closer look on how this effect is best used and if it affects render times in a later post.

The main objective with this setup is to have a remote render farm where work is offloaded from the main workstation and left to work without constant management; however, variations based on individual needs this setup should be easy to do. I will be covering everything from the OS setup for easy remote management to Blender install and setup to terminal commands. I won’t be covering hardware setup, OS installation or general use for each program; there are any number of guides these so no sense going over them again, I’ll be sticking to what you need to manage renders in Blender.

This first post is just about the over system setup. The next post will get into the details of setting up each OS then into the Blender setup.

Step 01: Find some computers
This step might be easy for some, but if you are having trouble scrounging up spare computers try craigslist and look for office closings or other giveaways. You can even check recycling centers or second hand shops. Although you can be too picky, I’d avoid systems with less than a 1Ghz processor and less than 1 Gig of RAM. For best results, try to find systems with a 1:2 ratio of Ghz to RAM (unless they are Dual or Quad core in which case 2-4 Gigs should be fine.)
Step 02: BIOS Setup
Since you are likely using semi-modern systems, the BIOS setup is simple. Find the power options and make sure Wake-on-Lan is enabled then test. This is essential for an offsite render network but also helpful for an onsite one as well. If one of your systems doesn’t have a Wake on Lan option, an old but gold system or basic laptop, there are solutions such as using Windows Hibernation, which will be covered later on. For a complete guide to Wake on Lan, Lifehacker has a handy article http://lifehacker.com/348197/access-your-computer-anytime-and-save-energy-with-wake+on+lan.
Step 03: Choose your OS
Since you are using a few random machines you’ll probably have a mix of OSes. No OS is flat out better than another for network rendering; even Windows can be setup with a remote command line such as SSH. Linux, in this case Ubuntu, does have advantages with cost and ease of setup; Ubuntu is free and most the changes we’ll be making to Windows are setup and running by default in Ubuntu. Another deciding factor is what addtional services you plan on running on the node. For this network, I have 2 Windows nodes so I can run the After Effects Network Renderer, which is not available for Linux. Also the system is controlled by a recent model Mac Mini which doubles as a web test environment and media machine. Mac Mini’s aren’t the best cost to power systems but one system can be used as a client machine for renders; more on this later.

Step 04: Network Setup
Any network where you can see each system from another will work, nothing too special about the network setup here. My only advice is to avoid wireless networks. Wireless works great for mobile devices but are too inconsistent for a series of render nodes. Hostnames, for instance, don’t seem to work as readily on wireless networks and rarely are transfer speeds optimal over the air.
Step 05: OS setup
Now the the actual setup. You have a few computers and need to get them setup and rendering together. Each of the systems needs these services:

1. SSH
2. VNC (Remote Desktop)
3. Network Accessed Drive (For both on and off site systems.)
4. Blender 2.5

VNC and a Networked Drive aren’t essential but are extremely helpful. Every now and then I send over a scene that needs a bit more setup. It is usually faster to touch up a scene over VNC than to reupload a large Blender file with cached physics and packaged textures.

One major note. Although it is nice to manage systems with a GUI, using a command line is often much faster and more than sufficient for getting renders through. This guide will go through command line instructions extensively.
Windows
For remote access to Windows I setup an SSH connection using Cygwin. The setup is a bit tedious but it makes sending remote commands easy and has worked well for me so far. There is also copSSH but I haven’t used it so this guide will cover the Cygwin method. The initial setup should be done at the system, rather then remotely, but if you have Wake-on-Lan tested and working you can do the Windows setup offsite.
OSX / Ubuntu
Setting up OSX and Ubuntu are easier, as SSH is included in the OS by default. OSX is the easiest to setup as setting up VNC is an option in the Networking panel and nothing special needs to be configured for headless use. Ubuntu requires more setup as not having a monitor connected means that the GUI isn’t loaded by default so you have to do some additional configuration to get Ubuntu a bit more remote session friendly. Also, where SMB works pretty well out of the box for OSX, Ubuntu needs a few additional commands to get the network drive working smoothly.

That’s it for the outline, look for the Windows guide in the next week or two.

I will be posting more on Blender and the short film soon, stay tuned!

Originally I built a system encoding the images into base64 and storing them in the localStorage with the shot data. At the time I was unaware of this massive headache I was gleefully writing into the backend of the system. Although the stored image swapping in and out of base64 worked well on a local server, when moving onto a remote server, even with a fully featured client browser, the system became uselessly bogged down for obvious reasons. Base64 images are 30% larger than their originals, multiplied by a hundred, you get the idea.

Frustrated, I turned back to the manifest. The manifest in the spec is not outlined as a dynamic cache as it must be set before page load. To get around this, I have a script (simple PHP) build the manifest before the app moves into the data sync and cache page. The preload page scans the /uploads and /structure directories then builds the manifest from the scans.


cacheList = array();
// The directories we want to scan.
$paths = array('./', './', './');
// Foreach directory, scan.
foreach($paths as $path) {
$files = scandir($path);
foreach($files as $file) {
if (preg_match('/\.(jpg|png|jpeg|gif|css|js|php)$/i',$file)) {
$cacheList[] = $path . $file;
}
}
};
// Name the manifest.
$manifestFile = 'your.manifest';
$writeTo = fopen($manifestFile, 'w') or die("Error, could not create manifest.");
$contentsCache = "CACHE MANIFEST\nCACHE:\n";
foreach($cacheList as $toCache) {
$contentsCache .= $toCache . "\n";
}
// Write it all out.
fwrite($writeTo, $contentsCache);
fclose($writeTo);


By building manifest dynamically the developer doesn’t have to continually update what gets cached and the user gets the whole app cached. The extra step is add the handy JavaScript reporter so the user knows what is happening on the backend Offline Web Applications. The entirety of this solution works on many platforms as the server, PHP building the .manifest, then the browser interpreting the .manifest is up to the client having a modern browser. Fortunately most browsers support these specs.

I have completed about half of the storyboards and I’ll begin plugging them into Animatic Builder so I can edit the film as I go through my day.

I came to this point on Friday when I realized I wasn’t going to finish my animatic in a weeks time. It was at that point I took a break and stood back from the work for a moment and relaxed. Now, a few days later, I have a better outlook on the project.

As I mentioned before the harder parts of the project are two sequences where the doll/avatar animates a couple of ideas. Both ideas are quick flashes, but even with their short screen time, I want to build a design and feel that would get a viewer pulled in. The concept is, these are the “good” ideas that flash in an artists mind, that could be something interesting but not exciting. Once the doll tosses these ideas aside, I want a moment where the viewer has to get reemerged into the actual film.

Right now I am adding and developing the pieces up until the main character, he needs a name it seems, makes an escape out of the room.

At this point I was hoping to have more done, but with so many projects in the works I am comfortable with moving a little slower on the film. I’ll update with the animatic soon.

Opening Shot

It has been a busy week but I managed to get through most of the storyboards for the film. Rather than try and make a series of thumbnails, a bad idea by the way, I decided to commandeer one of the sketchbooks I hadn’t used yet for the task. Although index cards are normally preferred, I’ve been running around too much to make a proper storyboarding wall. Instead I’ll scan the pages and put them into my app so I can edit the animatic on my phone.

The most difficult parts of the film to conceptualize are two “story within a story” sequences which need to be bold graphically and have very simple story arcs. The shot setup is a bit odd in that the doll has to flip the pages off then have the wind carry the pages behind the foreground so they can be framed over the doll’s shoulder. Then once framed the pages need to continue flipping through even when they are not being torn off the stack. I don’t have this sequence shown here, but I’ll make sure my animatic is shared at some point.

Look below for my “how not to storyboard” section and a few sample storyboards from the upcoming film!
How not to storyboardLooking Up

On the left are a collection of thumbnails from my sketchbook where I thought the layout, and action, were getting worked out pretty well. Not really. The main story is getting put down on paper but the thumbnails are so small it is tough to get the layout and even placed in a row they don’t have much continuity; the page is downright confusing.

On the right is just one, very simple, frame from that sequence. Even without much of a background the frame works much better because the character is fully developed and outlining the action in blue helps the eye know what is going to happen in the scene.

Walking Across

The above image is an even better example of a fully laid out shot. The layout is easy to understand and the action is fully thought out. All of these images need a bit more work to be fully fleshed out, but they at least provide enough information for an animatic.

Check back next week for the animatic!

Turn Around of the “Idea”

A new website, a year, and now a new film. I realized that my previous film was far to complex to finish on my own in a reasonable amount of time. The main problems with “Riot” are too many characters and an overly realistic design. In developing my new film I have outlined a single main character with only a couple sets. By building a story on a single place and a single character I can focus on the animation rather than many different characters and sets.

The “Idea” as I am currently calling it, is about an idea come to life from a stack of paper. Simple. Probably a film that has been done many ways before. My objective to do my own take on a common story and see if it draws and audience.

Here goes.

The main image of the post is a paint over 3D sketch of a stack of paper on my desk which will serve as the main set. The lighting is going to change a bit as I have shifted the time to an early morning but the spotlight effect will stay the same.

The “turn-around” sketch is a quick drawing I made before working on the final design for the main character. I decided that the film will be a self portrait so I used my logo as the characters face while his body is folded from a ripped out section of a page. The other two drawings are more sketches of the character.

More concept art, hopefully some finished storyboards, next week.

(It would be foolish to expect updates weekly seeing as how I tried that before, but then some mistakes are meant to be repeated.)

Shot and set design“Idea” Character Design

The Redesigned Animatic Builder timeline.

During the past few weeks I have been diligently updating Animatic Builder with new features and a completely new interface. Overall the main idea of the App hasn’t changed; building and maintaining a sequence over a range of any internet connected devices. What in the release makes that goal easier? Quite a bit.

From the start the whole App has been rebuilt with an AJAX, or asynchronous, connection so the user can modify the sequence without the delay of reloading page each time a change needs to be saved. Every on page change is made once a user focuses away from a changeable element. As well, each change effects the sequence immediately so a duration takes effect right as it is made.

The playback system has changed drastically as well. The most obvious alteration is the introduction of a self-centering elastic layout which keeps the current frame in the center of a browser window and when the browser is re-sized the whole layout expands around it to any size. Animatic Builder as on the iPhone. You can look at the app on an iPhone for editing then pull the a sequence on a projector and stretch the browser window to fill the screen. In regards to the playback presentation, I’ve added both a dimming effect and a series of hiding tabs so a user can reduce the whole layout to just the image in a frame. In this way, a user can play a sequence as a movie, seamlessly. Playing back a sequence in the browser feels just like a playing QuickTime movie.

Adding images to the sequence has also been simplified. By double clicking on an frame brings up an image change box where a user can choose from an expandable library. In this same dialog, images can be added, deleted, and collected from the uploads folder.

All of these changes are cross platform. The elastic CSS layout causes some problems on mobile devices however, they aesthetic not functional. More importantly, using Apple’s JS API, I have added gesture support so one can glide through a sequence easily. Mobile support is light, however, as the iPhone does not allow uploading from their devices but the image menu is available by clicking with two fingers. As well, the iPhone only supports vertical orientation at the moment and the layout need some adjustment. The layout is based on percentages to allow for flexibility across platforms, however when mobile Safari opens some elements get very distorted.

I have started a page on the site specifically for Animatic Builder and I will continue to update it as I use it for my film. To check out the latest version, editing enabled, head here. Animatic Builder version 1.0

And the new home of the app. whitneykrape.com/animatic-builder/

I have completed a couple of sites recently and one of those I have had the honor working on is that of Sarah Shipley, a copywriter and producer I met during my time working in New York City. Sarah was looking for a simple site to show her work. Many times an artist looking for a portfolio site will build an overly complex Flash site with too many bells and whistles. To show off one’s work, leave add-ons for sites that show off the web; your site is meant to show off you and your work.

Head on over and check out Sarah’s work!
Edit: Site is down.

The Animatic Builder timeline.
For this update I am going to give an overview of a new online application I have developed over he past couple of weeks to aid in pre-production, Animatic Builder. If you are unfamiliar with storyboards or animatics there are overviews here. Essentially where storyboards are the first visual organization of a film idea, an animatic is the next step adding a duration to each storyboard so the pacing of a film can be developed. Animatic Builder is designed to make creating storyboard and animatic sequences easier by keeping a sequence and it’s associated content in a central location accessible from virtually anywhere within an intuitive user interface.

The core idea of Animatic Builder is that a sequence can be timed out, played back and updated from a web browser without the need for movie compression, emailing large files and maintaining timeline files. With a concept and a set of images, a timed out sequence can be arranged and played back in just a few minutes. Animatic Builder is not meant to replace a non-linear editor such as Final Cut Pro but for planning out a scene or short movie during pre-production. The functionality of the app will be focused on building sequences with only pre-production information, keeping the app lightweight and accessible from any modern browser. Animatic Builder keeps a sequence and it’s necessary files contained for easy access.

Inserting a shot into the Animatic Builder timeline.

The idea is that keeping a physical storyboard on hand, whether in a sketchbook or a hand-full of index cards, is impractical in many situations. With Animatic Builder, shots can be laid out with metadata such as a description, title, and notes so they can be browsed and updated easily. The app comes alive when a duration is added to each shot, turning the storyboard into a playable animatic.

The only requirement for the app is a JavaScript enabled browser, which includes nearly every modern browser mobile and desktop alike. While JavaScript is a basic requirement each platform presents a unique set of challenges.

As the core idea feature of this app is portability, every possible platform will considered during development from modern browsers such as Internet Explorer and Firefox to mobile platforms such as iPhones, Blackberries and Android based phones and netbooks. For the moment the most advanced features will be found on standard browsers and on the iPhone with gesture support.

The concept is pretty simple so description does not do it justice, instead I recommend giving it a test run.

Launch Animatic Builder

For a complete look at the future of the app take a look at the development tree attached below. And yes a user interface rebuild is on the list. I am aware that the app is quite homely looking at the moment.

1. Animatic Builder – Development Tree

   1. Update System

      1. Shot reordering system
      2. Asynchronous connection
         1. Remove update lag
         2. Enable Image/Movie preview during upload
      3. Support for multiple sequences
      4. Multiple versions of a sequence

   2. User Interface

      1. Clean-up, Simplify and Beautify
      2. Re-tune to place focus on shots, especially during playback
      3. Make metadata collapsible
      4. Current shot detection and highlight
         1. Play from current
         2. Update current shot

         3. Consolidate playback controls

            1. Move shot/note controls to playback bar
            2. Only information in sequence
            3. Center controls in window
            4. Goto shot number

      5. Rebuild scrolling

         1. Disable scrolling

         2. Re-enable scrolling to match device

         3. Fixed position for iPhone
         4. Center and focus shot
         5. Build “breathing” transition between previewing and playback
      6. Investigate seamless camera operations, pan, zoom, rack

   3. Offline Support

      1. Portable version separate from server
      2. Reads/Writes text information to single file
      3. Uploaded and parsed by online version
      4. Save different versions of sequences
      5. Take advantage of device specific databases
      6. Download/upload zipped file of associated content

   4. Audio Engine

      1. Simple audio playback timed to shots
      2. Replace/add browser scroll-bar with both audio/video markers
      3. Keep audio/video timeline integrated

   5. A more creative/inspiring name than Animatic Builder

As the app currently resides entirely on a server, some skill is required to setup and maintain the system. Therefore, rather than taking the time to develop an installation for the app, I am keeping the server side source closed and the app only available for previewing. If you are interested in using the app please contact me with the form at the bottom of the page. At this point I am trying to gauge interest in the concept and see where the project goes.