Halloween Costume ideas 2015
Articles by "time"
@dorothiar #arttips #interview 101 2 Column Template 2012 mentee 2013 2013 mentee 2014 2014 mentee 2014 Portfolio Winner 2014 SCBWI Portfolio Mentorship Winner 2015 mentee 3 Column Template 360 3d 3d print 3d printing 3delight 8bit Abbey McCulloch abstract acryla gouache acrylic action addon adobe Adobe Flash CS3 Adobe Illustrator Advanced Tutorials advection Advertising advice Agata Wierzbicka agents airplane Al Wiseman ALA Alan E. Cober Alan Lee Alex Ross Alexandra Compain-Tissier Alexandra Lekias Alexandra Levasseur Alexandre Korobov Alexis Winter algorithm alien ALT Amelie Hegardt Amit Shimoni amusement an Ana Aranda analog Andrea Hrjnak Andrea Hrnjak andrea offermann andreaoffermann andreazuill Andy Musser Angela DiTerlizzi Angelika Peißker animal logic animals animation animation nodes anime anisculpt Anja Kroencke Anna Higgie Anna Jensen Anna McKay Annabel Briens AnneBerry Anneke Krull Annu Kilpeläinen anstudy anthology António Soares ar arduino area armature arrange array array modifier arrow art art director art directors Art is fun! art reps art tools Artaksiniya arthictecture arthur rackham artists artwork ase Ashlyn Anstee Asian aspiring asset atom attribute attribute transfer audio Audrey Kawasaki augmented reality aurasma Aurelius Battaglia author illustrator automatic automation Autumn Whitehurst avatar Avrom Yanovsky AW14/15 award awards Babeth Lafon Babies baboon Baby Love Background background color bacteria bake baking ball Bamboo banner Banner images banner making Barbara Dziadosz barcode basic bbox beads beats Bec Winnel beginner Bel Johnstone Ben Denison Bernie Fuchs Berto Martinez Beth Krush better photos bge Bijou Karman Bike biscuit bishop black and white black and white art Blair Breitenstein blam blender blender game engine blender3d blending Blinkie Blinky blob blocks Blog Tips blogger Blogging Friends blogs Blonde blur effect in pixlr and photoshop blur images and pictures bmesh bmesh viewer bolognaragazziaward bombing bone bone modeling bones book book launch books boomerang bottle bounding box bowl bpy brian eno brian ormiston Brian Sanders brian won brick bridge Bridget Davies bright Brooke Boynton Hughes build modifier building burns business Buttons bvh cage Caitlin Shearer caldecott calibration camera camera settings camera tips Candle capcom card career Carole Wilmet cartoony Cassandra Rhodin cast Catherine Campbell Cecilia Carlstedt cell center pivot centipede cg cg photography chair challenge Chanel changin color in pixlr changing color chaos character Character Bible character development charcoal charles Charlie Dot Charlie Hebdo Children children's book illustration chocolate Christina Drejenstam christina forshay Christina K christinaforshay Christmas Cindy Derby circle circle dance city cityengine clock clones cloning cloth Cloud based clover CMYK Coco Chanel Cody and the Fountain of Happiness coffee collect collection Collections collision color color balance color cast color correction color mode color study colorful Commercial Use complexity component compositing composition computational thinking computer concept art Condensed Posts conference connect connect the dot connection Connie Lim Conrad Roset constrain constrast contagion content Contest contracts control converter copy copyright Corinna Luyken count Courtney Brims crack Craft craftsmanship Craig & Karl creative creativity creature cricket Cristina Garcia Martin critic criticism critique Crop Crop Tool cross section crowd csv cubism curve curve modifier custom Custom Blog Design Custom Blog Design Tutorial Custom Blog Designers Custom Illustration custom properties Custom Signature custom xml cut cutting plane cycle cycles dae Damien Florébert Cuypers Dan Hillier dance Daniel Egnéus Daniel Segrove Danny Roberts Daren Newman Dasha Tolstikova data data path David Blossom david diaz David Shrigley David Stone Martin Dean Hardscrabble Debbie debbie ohi debbieohi deform deformer degrees deleting background in pixler demo demoscene desaturation of images design design by numbers design process Design Tips dictionaries dictionary Different Text Writing in Pixlr digital digital paint Digital Scrapbook Freebies Digital Scrapbooking disk distance distractions distribute diversion DIY DIY Contest Dolf Veenvliet Doll Doll Bones dolls domino domino effect doodle Doodles door doraemon Doris Jackson Dorothia Rohner dots dpi draw drawing drill driven driver drivers dual versions dummy duplicate duplicates duplication dupliframe dvd dynamic dynamic paint dynamic text E Simms Campbell Easy easy pixlr Easy Tutorials Ed Graham Ed Vebell editing editing photos editors education effect effects ego Eleanor Dalton electric Elia Fernández eliza wheeler Elizabeth Mayville elizawheeler Emily Forgot Emma Zanelli emoticon happy-face Emotional storytelling empathetic characters empty entoforms envy epicycloid EPS Illustration Epson scanner erasers Erin Armstrong Erin Petson erinoshea ernest shepard Esra Roise euler evaluate line Eveline Tarunadjaja evenly spacing vertex event everywhere door exhibition Expandable Posts experiments explode exploded view export expression extrude eye eye color in pixlr eye trick eyeball face rig facial expressions facial setup factory Faiyaz Jafri Families fashion illustration fashion week fcurve feature Featured Fee Harding Feedback fence Fernanda Guedes fibonacci Fifi Lapin file File Types Finalists Finding Nemo fire fix photos Flash Tutorials flicker flip flip flop floor flop flow flower Flowers fnmatch focal point follow up font Fontaine Anderson Fonts food footage For Sale force form formula fractal fracture frame Frames Francois Berthoud Frank Bellamy Frank Furlong Franklin McMahon freckles Fred Steffen FrederiqueBertrand Free for Commercial Use Free for Personal Use Free Stock Photography Free transform tool Freebies Frenchillustration Fritz Siebel frosted mylar fruit ninja Fumi Mini Nakamura Fun function futurism FW2017 fx Gabriel Moreno Gabriella Ibarra game game animation gameart gamma gangnam style Garance Doré Gary Fernandéz gel medium generate generative generator geometric geometry Gerald Lazare Géraldine Georges GIF Gildo Medina Girl Giuseppe Castellano Giveaway glorar goals golden ratio google google docs Google Tools Grant Young graph graphite graphite transfer grease pencil grid group group node growth Gucci Guest Guil Godier gustave dore hair handbook Harper's Bazaar harpercollins Harvey Schmidt Haute Couture head Headers heat map Helena Hauss hexagon hexagonal grid Hiroshi Mizuno Hiroshi Tanabe Holiday Holly Black homology honeycomb hook horror houdini how to how to blur a face or an object in pixlr How to change eye color how to delete an object how to desaturate an image how to edit a image in pixlr how to erase an object how to fix red eye problem how to fix red eyes in pixlt How to fix the parts in pixlr in photoshop How to make a banner in pixlr How to overlap the nevus how to remove a object How to remove an object in pixlr how to remove red eyes How to Remove the Background of an Image in Pixlr How to remove the parts that you don't want in pixlr and photoshop how to replace color How to write a Patterned Text in Pixlr how-to Hsiao-Ron Cheng hsv hue humor Hyshil I love illustration magazine idea ideas Igor+André illusion illustrating illustration illustration board Illustration Books Illustration Intensive Illustration Now! Fashion illustration process Illustrations Illustrative Berlin illustrator Illustrator Intensive Illustrator Tutorials iloveillustration magazine image ediditing lessons Image Ready image sequences image theft imaginative import import text import vertex color improving photos inbetween index visualizer Info Ingrid Bockting ink inktober input Inspiration inspirational quotes install instance instance switching intensive interaction Intermediate Tutorials internet interoperability interpolation intersect intersect edges intersecting intersection interview introduction invoke subprogram io ipad Irana Doucer Isabella Hemmersbach islam islamic iteration Izzie Klingels Jack Hearne Jack Tremblay James Dignan James Gurney japanese Jason Brooks Jean Kim Jeanne Detallante Jen and Chris Creed Photography jen betton Jen Rofé Jenny Mörtsell Jeremy Combot Jeslyn Kate Jesse Auersalo Jessica Jessica Lanan jessicalanan jewellery jewelry jiggle Jim Schaeffing Joe Bowler Joe Cleary Joe Isom Joe Krush Johanna Goodman john maeda John Vernon Lord joint Jordan Sondler JPEG JPG jpop juana martinez-neal juanamartinezneal Judge Judit Garcia Talavera Judith van den Hoek Judy Byron Schachner Jules Julien Julian Beever Julie Verhoeven Jump Break Tool JW Anderson K-Fai Steele Kaethe Butcher Kareem Iliya karel zeman Kate van Harreveld Kathrin Kuhn Kathryn Ault Noble Kathryn Noble Katie Kath kdtree Kei Meguro Kelly Beeman Kelly Light Kelly Smith kelly sonnack Kelly Thompson keyframe keyframing kidlit kidlitartists kimberlygee Kirkus Review Kisoo Chai Kodak Konstantin Kakanias Korean illustration Kotaro Chiba Kozue Himi Kremos Ksenia Finogeeva KT Smail kuler Kustaa Saksi Lanan Laptop larry gritz lasso tool latte lattice Laura Callaghan Laura Laine Lauren Rille layer layering Layla Holzer layout leaf learning learning blender LED Leendert meets Ingrid lego length Leonard Starr lessons levels LFW A/W 14 liangzhu liero lightbox lighting lightning Lina Bodén Lina Ekstrand Linda Dorn line line connect line drawing lines Links Linky Love Linn Olofsdotter Lionel Gilbert Lisa Anchin Lisa Billvik Lisa Krannichfeld lisaanchin lisbeth zwerger Liselotte Watkins list list comprehension List First Last listing locator lofting logo Logo Design Lola Dupré London Fashion Week loop looping loops looptools Lorraine Fox lossless lossy lost weekend lostweekend lotte reininger Louis Glanzman louis vuitton Luciana Rondolini luciograph LULU* lv Lynnie Zulu Mac macgyver macouno maeda Magda Antoniuk magic Magnus Voll Mathiassen mailing mailings maker Makiko Sugawa making banners Malika Favre MAMP mandala manga map map range maplelam mapping Marcel George Maren Esdar Margot Macé Margot van Huijkelom Maribeth Olson Marie El-Ahmar Marilyn Conover Marina Esmeraldo Marine Marbleindex mario Marlies Niemeijer Marsha Riti Martha Rago Martin Krusche Martine Johanna mask masking material materials math matrix matrix apply matryoshka Matt Baker matte medium Matthew Woodson maya maze mdd Meagan Morrison measure megaman Megan Hess Meizhen Xu Mel Crawford memory mentee mentees mentors mentorship program Mercer Mayer Meridth McKean Gimbel mesh mesh cutter meshlab Meta Tags metal gear rising Meyoko Mia Overgaard Micca mice Michael Sanderson Michela Picchi middle grade midi miku Milan milipede minidom Minima Mio Matsumoto mirror cut Misc Miss Blackbirdy miss maple's seeds Miss Take Mitchell Hooks mixamo mixing Mobile Apps mocap mod model modeling modifier modular modulation modulus mold molecule molly idle Molly Ruttan Molly Ruttan Illustration money monitors monkey mono-zero monster monster university morph morpher mosaic mosquito motion motion capture motion capture mouse motion trail moto360 mountain muji Muriel Wood Murray Tinkelman mushroom Music and Podcasts My dead pony Nadia Flower Naiad Einsel Naja Conrad-Hansen Natalie Brockett Natalie Foss nathan vegdahl nautilus Nav Bar navigation needle-felting negotiating Neil Boyle neon nescbwi14 nested New Blogger Questions New Blogger Template Tutorials new user pixlr new year new york New York Fashion week Newbery nicholas nicholas bishop Nicholas Hong Niki Pilkington Niso Ramponi nla No Software node node-based nodebox noise non linear animation Non-Web Font normal Noumeda Carbone npr number NURBS NYFW object object color change object info octopus offset Ola Volo Olaf Hayek old formats opaque projector open movie open shading language open source openshadinglanguage opensoundcontrol optical organization origami original art show Ornaments osc Oscar Schlienger osipa osl outline outliner output Pages paint paint weight painting painting on illustration board painting on wood painting with movie painting with numbers Pair pandas panorama Paper paper lantern parabola parametric parent parenting particle particle info node particles pat david Pat Zietlow Miller pattern Patterned Text Paul Faassen Paul X. Johnson Paula Sanz Caballero PC pdb pebbles pencil Pencil Sketch pencils Penguin perfume perlin Peter Helck Photo CD.8B photo editing software Photo Reference Photobucket photographing art Photographs photography photomerge photoshop Photoshop Brushes Photoshop CS3 Photoshop elements photoshop pixlr desaturaion Photoshop tips Photoshop Tutorials Picture Book Builders picture books Pierre Louis Mascia Piet Paris Pietari Posti pingpong pinnochio pipes pixar pixel pixel art pixel generator pixlr Pixlr advanced Pixlr blog pixlr desaturate keep a colorful part pixlr editting pixlr express Pixlr forum Pixlr free transform Pixlr Lesson Pixlr lessons Pixlr mobile Pixlr resizing images pixlr shortcuts Pixlr tools pixlr tutorial pixlr tutorial with pictures Pixlr Tutorials pixlr white black pixlr.com plant plot plotting ply PNG PNG Illustration podcast point point color pointilism polka dots polyCut polygon Pomme Chan pop-overs portfolio Portfolio award portfolio showcase portfolio-advice portrait position Post Dividers postcard poster Posting pot powdered graphite powerhousemuseum Prada presentation print printmaking Prize procedular procedural process processing programming projection Promotion property prototype PSD psy publishing pulse puppet puppetry pydriver pydrivers pyhandler pyhandlers pyramide python quad quick select set quick tips qumarion Rabbit Moon Rachel Ryle radians radius ramp random random motion randomization randomize range float raspi Ray Houlihan reading reading XML READY-TO-WEAR realflow Rebecca Clarke rebecca dautremer Rebecka Skog rebuild recursive recursivedrawing red eye remove reducing glare reference referencing release remesh modifier remix removal remove remove red eyes remove unwanted objects Removing backgroung render rendering renderman repeat repeater repeating replace replacement replacing color representation rerouter resample resampling research Resizing image resolutions retopology retro review revolve rgb rib Ricardo Fumanal Richard Scarry rig rigging rigify Rikke Jorgensen ring ripple roadkill Robert Heindel Robert J. Lee Robert McCloskey Robert Shore Roberta Zeta Robin Rosenthal robot robotic rocks Rodolfo Montalvo Roller Coaster rotation Rousseau rsl Rubin Pfeffer ruler tool Russ Mills russian rut S/S14 S/S15 S/S16 Sabine Pieper sadako Saftey Pins Sainte Maria Sale Sam Weber Sanda Suy Sandy Kossin santoso Sara Andreasson Sara Singh Sarah Jacoby saturation artist tools scan scanners scanning scatter scbwi SCBWI 2015 mentee SCBWI conference scbwi germany SCBWI mentorship scbwi-la scratch scratchboards screensaver screw screw modifier script scrub sculpting seamless Seamless Patterns Search Engines select by material select by name select by type SEO sequence series set keyframe set keyframes shader shading shadow Shannon Stirnweis shape grammars shape key shapekeys shapes shards shatter Sheilah Beckett shell ship shipping shipwright Shoes SHOWstudio shuffle Sid Barron Sidebar Titles Signature Silja Goetz silkworm Simon and Schuster Simon Varela simple simplicity simulation sine Site Engine Optimization Sjoukje Bierma sketch Sketches sketching skin skin modifier skinning slice slicing slides sloth slow parent smoke smoothstep SN snake Sneek Peek snippet Snow Snow White Snowflakes soccerball social media Social Media Buttons Social Networking society of illustrators Society6 soft body softbody Sonia Menti sound sound wave space spaceship sparta special spider spiderman spiderweb spin spiral Spiros Halaris Spiros Halaris x Urban Decay spline Spot Healing Tool spreadsheet SS16 stack stacking stair stamp Stan Galli star starfish stencyl step Steven G. Dobson still Stina Persson stone stones storytelling strand strand info strands street art string stripes structure studies studio style stylistic summary Summary Posts Summer sun supplies surface Susan Farrington suzanne Suzanne Kaufman sverchok swatch switch sydney system table table of contents take out background Tal Drori tangent tangled Taschen teaching teapot Template Templates tentacle Tess Jacobson Tex Avery text text editor Text Formats Text Styles in Pixlr texture texturing The Cartorialist The Grudge Keeper The Purple Book thinker1 Thomas B. Sawyer thread TIFF tile tilecam tiling time time code Tina Berning Tina Kugler tips tips for artists Toby Neilan Tom Baxter Tom Bjarnason tombow tomie depaola tool tools topology tower Tracy Turnbull Train transfer drawing transferring sketch transform transformation transit travel triangle wave Tricia Springstubb trigger tris tristan lock tube tubes Tutorials twitter type tool typeface typography unbake unity3d universal unquad utah uv valentine Valentino Valerie Servais vanilla variable variation variety vase vector vectorized Velwyn Yossy venus Veronica Ballart Lilja vertex vertex color vertex group vertex paint vertex weight VFX Victoria Boysen video Videos viewer Vintage virtual virtual studio visualization vivid vividfestival VOGUE volumetric voronoi Vote voxel voxelated voxelation walking teapot Walter Einsel wand tool water soluble graphite watercolor wav wave we need diverse books web webbing Week Themes weight welcome Wendy magazine Wendy Plovmand what casues red eyes What is Pixlr Wherever You Go Wide Awake Bear wiggle Will Davies Winner Winnie Fitch Winnie Truong Winter wire wired wireframe wolfram Woman wood woodwork wool wooly wordpress work workflow World writing writing XML www.pixlr.com XML YA yayoi kusama Yelena Bryksenkova yoda Yoko Furusho Yuliya zaha hadid zen zsphere

3D Time Clock DIY Using Blender and Animation Node


Quicky Digital Clock

Blender Animation Node O'Clock

Above screen shot is another quick snippet experiment I did yesterday.

Understanding and appreciating time is crucial for both animator and programmer, and people in general. Making a LIVE clock is a nice exercise to learn AN and Python programming, I reckon.

I will write my step by step notes to make clock using AN and programming logic. I will use AN Script node for this case. You will see why.

DIGITAL CLOCK

My brain said that a real clock should be a TIME that we can customize and then run from that point. That is something that I would like to think to do at some point using Modulus.

However, for our convenience, we will just use Python "current time". I found a hint from this link at Blender Artist forum:
http://blenderartists.org/forum/archive/index.php/t-99106.html


Great! I think we can use Python "time" module!

There is one super convenient AN node we can use to "copy paste" script or to write our own Python script and it will do the processing and running looping calculation on the go: SCRIPT node.

I fall in love with this node, the moment I understand how it works.

A bit about this Script node...

Firstly, you create a Script node in AN node tree. Then you create a Text inside Text Editor. And you can start typing Python script.

You may notice that nothing really happens, NOT UNTIL you actually "summon" the actual script.

NOTE: AN has this kind of "behind the screen" LEGO brick. Maybe you can call it the thinking block of script for you to customize, then later to use that brick you actually call it.

Supposed I want Script node to continuously printing "hello" in the console like below.


The script will not run, until you call the script.




You got the idea? Now, let's try using Python "import time" module.


Here, I assign the output of time.localtime() into a variable called "mytime". You can use any variable name for this.

time.localtime() will return a list of tuple and each element is correspond to: year, month, and so on.

How do we use these DATA? We can just use Script node convenient INPUT and OUTPUT slots creations. On the fly!

We just need OUTPUT for now, and I will use "Integer" data value for each output slots:


It will not work yet, but we have provided an empty containers output to pass our "time" data. You can use Python quick unpack and assign value like below:

NOTE: I accidentally make mistake here and assigning "minute" variable twice :) Correction below


We have 7 variables and we are assigning 7 different values from time.localtime() into those variables. Now, everything is actually already working. We can close Text Editor and "forgot" about the running processing in the background. Remember that our "time" is LIVE program.

DATA OUTPUT: Text Object(s)

Let's spit out the time as Text Object. And we can use AN to pass our text/string data into it. Starting with "year" variable.


Everything is pretty straight forward, but I want to just mention a couple of useful things. Ensure that for each Text Object, you only pipe in one data, otherwise you have things clashing. But don't worry, you are allowed to make mistake.

At the moment, the output will be all numbers:

There are a couple of things:

  • Perhaps for months and weekday, you want to use your own text in your own language? Yes, you can.
  • Maybe you want the HH MM SS always displayed as 2 digits.

EXTRA: Display as 2 Digits

You could use Python to zfill the number into X digit you want. 2 Digits: 01, 02, 03, ....

But I just use AN Fill node for Text String to do the job. Just simply fill with "zero" on the left:




EXTRA: Display Useful Text Instead Of Number

For 7 days of the week / weekday, we should show it as:
Monday, Tuesday, Wednesday, Thursday, Friday, Saturday, Sunday (In English).

What important here is THE ORDER of the list. From our Python time script, weekday started from Monday (index 0) until index 6, and back to index 0.

0 => Monday
1 => Tuesday
2 => Wednesday
3 => Thursday
4 => Friday
5 => Saturday
6 => Sunday


I think it's pretty cool how SIMPLE all of these become using Animation Nodes AN in Blender!

The rest you can "decorate" and design layout your clock. Perhaps using different fonts? Perhaps make a falling rain clock?



ANALOG WATCH

For analog watch, we can simply use Map Range node. For example, we know that our "number" for our second goes from 0 - 59 (60 ticks), and so we just need to map range those to 360 degree.

Below, I am using Suzanne's long CHIN as pointer for "second".




If you are using your own "TIME" like FRAME to create clock, you can use Math MODULUS or Repeat Time node. Sometimes that is preferrable, and easier to offset time as you need.

TIME CODE GENERATOR

One more thing: AN has built in Time Code Generator. Which is also something that one may create themselves. Handy to use for animation.





Icospherical Suzanne Clones.
Positioning monkeys into Icosphere Vertex position.

If you are following this blog, or just randomly browsing the articles, you might notice that I have strange interest over node-based procedural modeling and animation method. I like the idea on how we can crunch numbers and data to the computer, and let the computer does some complex processing for you. And I also have big interest on data visualization. So whenever there is an opportunity to explore such tools in Blender, I jump on it.

By now, there are already quite a few node-based add-ons for Blender as for today. Eventually, they will be unified under one Blender node tree, I have that believe in Blender. I am quite picky on which node-based add on to choose. So far, I found Sverchok and recently Animation Nodes (AN).

The tools I pick based on my familiarity with Maya, Houdini, and a bit of Softimage ICE. I think node-based system shoud be user friendly and does it the Blender way, yet universal.

Sverchok is one Blender add-on that I have seriously explored in the past for its node-based procedural ability. I believe Sverchok was originally designed for procedural 3D modeling, however, Sverchok also can "move" and "animate" mesh and later on can animate objects thanks to Sverchok developers that allow animation to happen.

Animation Nodes (AN), is yet another add-on that allows us to create procedural animation in Blender by creating and connecting nodes, and let the data flow do the animation job.

One can think of procedural node-based worklow just like creating, modifying, and transforming a non-destructive ways, similar to Blender's own Modifiers. For example, there are Mesh Modifiers and Animation Curve Modifiers (inside Graph Editor, allowing you to generate, tweak and modify animation curve without destroying anything).


1. Generator Modifier inside Graph Editor.
2. Adding Noise Modifier on top of Generator Modifier, and Multiplying them together.


Few words of cautions, when dealing with node-based system, you may need to be comfortable with some programming concepts, such as:

  • Data types (float, integer, string, vector, matrix, etc)
  • Data conversion
  • Arrays and Lists
  • Loop and Iteration
  • Functions
  • Variables
However, unlike typed programming language, node-based is usually more visual and less abstract. In fact, node-based is can be really very advantageous and helpful for "non-technical" computer artists to have this ability to clearly see what is going on without worrying about the complexity of language. You could create a complex setup and modify certain setup for own purpose just by understanding the logic.

In my own word and understanding, a node is really a container that hides complexity and reveal functions, so we may care more about the data input, data output and data flow to get the final result. How all the functions work together. A bit like LEGO bricks, we kind of need to know what each block can do and how it can attach together to build a structure.

Understanding the concepts is more important than memorizing complex node-tree. You will find really quickly that there are many possibilities to achieve the same result. Some are more elegant, simpler, some are complex underneath, but beautifully presented. Sometimes a complex node-tree is good for some matters, but the more specialized, the harder to customize. 

Now, AN probably does not have a full complete set of animation nodes at this point, but it is growing and the number of nodes will continue to increase as it is continue to mature. Keep in mind also that nodes might change over time, this is the nature of the tool, once again I have to mention.

What really intrigues me with tool like AN, is the openness and potential both for learning and development. If you have enough skills you can eventually create your own nodes that you can share with other artists. And when we collaboratively create node-tree of certain setup, ideally we can re-use and build more complex tools.

So in this article thinking about Animation Nodes, I am trying to map out our learning areas. So I will be jumping around from topic to topic.

Enough preaching, let's explore this Animation Nodes add-on together! 


THINKING ANIMATION PROCEDURALLY

Manually animating in computer graphics involves keyframing values of attributes in different frames. The animation will then be created when the computer interpolate or create in betweens for those values that we specified when we playback the time. The speed of acceleration and the weighting of the interpolation (animation curve) can be adjusted manually via Graph Editor, whether we have linear motion, slow in slow out, stepped, etc.

NOTE: For character animation, usually animating involving posing the character controllers (!) and animator worried more about the actual emotion or story to tell. We will get there, but at the moment, we go to the most basic first.

In reality we are really controlling the motion of object using f-curve over time. Simple enough concepts that takes a while to understand. Make sure you understand that concept first.

Procedurally animating is pretty similar, just that user is a little bit more exposed into smaller components. We still be dealing with VALUES over TIME, and then CONTROL-ing how the values get interpolated.

Procedural animation is great for something that involves repetitions. Every so often, we would like to apply similar animations to a bunch of objects, with slight offsets or variations. Perhaps it is a building with lots of windows that we like to open at slightly different time, or maybe it is the lights that need to turn on not at the same time, but in a slightly offset kind of way (more interesting).

What can we control or animate? Ideally we want our node based to control everything. Animation Nodes seems to be able to do so already, even at this stage. If there are missing tools, one can always write Python code for it or request the developers.


1. Objects (tranform of objects: Translate, Rotate, Scale, Visibility)
2. Text
3. Mesh (vertices) or Curve
4. Color
5. Attributes
6. Others

Usually Motion Graphics animation deals a lot with these kinds of animations. It's good idea to look around for inspiration on YouTube or Vimeo for this kind of things.

Before dealing with complex nodes and array of multiple objects and exciting stuffs like loops, we should really start by building simple node-tree setup that does something to an object.

This is when you are free to experiment yourself by observing NODES and guessing what and how they function with the rest of nodes. Do make mistakes, but find out why and figure out how to resolve it.

In fact, if I think of "storyline" of learning curve for AN, it is going to go like this:
1. Positioning static object(s), eg. in flat map coordinate or spherical
2. Arranging object(s)
3. Animating object
4. Working with multiple objects
4. Other stuffs.

GENERATING SIMPLE MOTION RECIPE

Node Recipes:

  • Time Info (!)
  • Combine/Separate Vector
  • Object Transforms
There is ONE really special value that we can use for animation, and that is TIME, and it is commonly shown as Frames or Subframes when playback is run (Ctrl+A hotkey).

Time at the very basic means we are aware of Start Frame, End Frame, playback length or durations. Later on, you will find out that we can have "multiple timelines" for each object. It's one of biggest driving force of animation.

In AN, time value is accessed via "Time Info" node. When you run the playback or scrub in timeline, the Time value is also changing. Time Info node spits out Frame number value as Floating value (fractional).

So at the very basic, we could in theory plug that single value to control Translate XYZ, Rotate XYZ, and Scale XYZ of Object Transform.


Above, you see I plug a single value output from Time Info node into X of "Combine Vector". Then, I plug the Vector (3 values) into the position of Object Transform node to DRIVE the default "Cube" object in 3D scene.

You may notice that moving object one unit per frame is too big of a step, so we can reduce the speed for example by multiplying the value with 0.1. This results in Time that is 10 times slower (1/10). Below is how I figure it out.

I use Debug node already here. This is a quick way to see the OUTPUT VALUES at any point in the node tree. There are few debug nodes here, we will sure be looking at them time to time.


Now that you are familiar about Time value output, you can try pluggging this into Scale, this time below I plug it into Scale XYZ so it will "grow" the scale of "Cube" overtime.

If the value is the same for all 3 values Vector, you can use "Vector from Value" node, instead of plugging 3 noodles into "Combine Vector" slots.


You can also try plugging the value into Rotate XYZ.


Noticed that you have this automatically created "Vector to Euler" node. And you also have option to use Degree.

In degree, 360 degree is a full rotation. In Euler angle, .... well I do not know, maybe you know. But we can SEE the result in 3D. I use Suzanne the monkey object so I can tell if it hits 360 degree rotation.

NOTE: Later on this Vector business is important to indicate the direction axis of an object, especially when dealing with Matrix. A bit too advanced for now, I supposed.


Knowing that we can use values to control many things using nodes, we need to think of DRIVE and DRIVEN values.

Straight from top of my head, procedural motion can be driven using:
- Generated Values / Numbers
- Other Objects (master and slave)
- F-Curve via keyframing
- Math (with formula or expressions over time)
- Sound > Curve

NODE: VECTOR WIGGLE

Vector Wiggle is an interesting node. When we feed Time Info node (frame) into the Evolution, it will spit out smooth Vector positions over time and can drive an object so it is moving just like insect fly in the air.

I believe this Wiggle is also called 3 x Noise values (XYZ). Unlike Random that gives a random values resulting in a jumpy values between frame, Noise will give values that are closer to each other, meaning smoother motion.

Okey, so far, we know Time and Vector Wiggle can drive the motion of objects. Vector Wiggle itself is a specialized node that is based on Math Formula and Expressions. I might cover and explore this are more in depth. But looking at Math through procedural animation is a lof of fun.

Complex procedural motions can be created using Physics, Dynamics, and perhaps Particle simulations and behaviour animation like used in games. Actually if we get creative, maybe we can already use Blender's dynamics to work together with AN node.

MOTION BY COPYING OTHER MOTION



Above will result of 2 x Suzanne to be always on the left and right side of Cube object, 3 units apart.


MOTION BY F-CURVE

When we hit I to keyframe an object transforms, we are very likely creating minimum of 9 f-curves for translateXYZ, rotationXYZ, and scaleXYZ.

I believe we could "sample" and modify animation curve using AN nodes. I have not yet looked into this, but this could be interesting.


JUMP AHEAD: F-CURVE ANIMATION OFFSET SNAKE MOTION via TEMPLATE

AN add-on gives a bunch of really useful templates to use and to study. Feel free to try them. Personally I found the templates to be pretty complex, however, can be broken down.


When I tried to create this snake motions, I was doing it like below. The differences between above and below is that:

ABOVE: From the template, we are able to create this Master and Slaves very quickly. One object is animated using f-curve, and then all the rest of objects, become slaves clones of another object / same object as the master.

BELOW: Here the node tree is using a simple Loop system that simply delay the motion of clones to follow one master. I am doing it in a way that I understand it.









AN MATH NODES


Reciprocal Number node contains lots of basic Math Formula that you can use for noding. Maybe it should be called Math Formula node? :)

Expression node allows you to more easily type formula and creates your own input variables and plugging your own numbers.


Sine wave + Cosine wave = Circular Motion (translation)



AN TEXT OBJECT

AN add-on seems to be capable of dealing with Blender Text Object quite elegantly. There are few AN nodes that are dealing especially with text/string type of data and output it into Text Object.

In fact, I have a feeling that we can talk and play with Text Object. String type of object is really very interesting. If you know Python scripting a bit, Python is pretty amazing when slicing, combining text, list of text, etc, etc.



You create Blender Text Object and use the eyedropper thing to source the Text Object on Text Object Output node. THEN, you activate that Text Input button thingy and input your own text.


Random Text node generates string of text characters.




Create List node & Get List of Element node

You will get this really often with AN nodes especially when you started to dealing with multiple inputs. You supply some list of data/values and then you pick an element based on "Index".

In Python, let say we have list of text:
mylist = [ "Apple", "Banana", "Papaya", "Durian" ]

mylist[0] => "Apple"
mylist[2] => "Papaya"



String of Text can be totally awesome, I cannot emphasis this more.

Imagine if we supply text like this:

  • 010001000100
  • 010101010101
  • 000100010001

Those text can easily become like audio beats to procedurally control animations!

OTHER RECOMMENDED LANGUAGES

I really do not want to overload you with programming theories, however if you are serious about node and procedural workflow, you may want to also side-learn creative programming languages below that are available and open source.

  • ChucK (audio programming)
  • Processing (creative visual programming, based on Java and Javascript p5.js)
  • Python (Blender scripting language and also language that is used widely in computer graphics and many areas).

You can learn it in tandem, but if too hard, you pick one below while learning tool like Animation Nodes (AN). The idea is to understand the logic and concept of programming and the flow of data, not so much about the language itself.

MKRdezign

Contact Form

Name

Email *

Message *

Powered by Blogger.
Javascript DisablePlease Enable Javascript To See All Widget