Menu Search
Jump to the content X X
The Smashing Book #5

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. new Smashing Book 5 features smart responsive design techniques and patterns.

Beautiful Motion Graphics Created With Programming: Showcase, Tools and Tutorials

Advertisement

When you hear the word “creative”, what type of profession comes to mind? Maybe a graphic designer, painter, sculptor, illustrator, or writer? It’s unlikely that you would consider a “programmer” when thinking of creative fields of work. But programmers have the potential to be creative and come up with ideas or concepts that will impact others in positive ways.

We often turn to programmers to solve mathematical-related problems, but the concept of mathematics in programming is what powers programmers to innovate. When you think of mathematics you imagine numbers, expressions, and equations. But what about art, music, or even beautiful visuals? Those numbers and equations that we often view as mundane and overly-formulaic can generate beautiful visuals and music. This article will present dozens of examples of motion graphics and interactive visuals created with computational code, along with some useful references and resources.

Beautiful Motion Graphics Created with Programming Link

First we’ll look at some examples of beautiful and inspiring motion graphics created by programmers. Some of these are audio-reactive whereas others are data visualization.

Metamorphosis1 by Glenn Marshall692952

Screenshot3

Swan Lake – Zeno Music Visualiser4 by Glenn Marshall692952

Screenshot6

Black Hole7 by 360angles8

Screenshot9

Flightpattern10 by Gwen Vanhee11
These beautiful motion graphics were created using ActionScript.

Screenshot12

Disco Maths 113 by Stefan Goodchild14

Screenshot15

Magnetic Sphere16 by flight40417

Screenshot18

Air Doom19 by Rui Madeira6620

Screenshot21

Audio Reactive Bubbles22 by Matthias Dörfelt.23

Screenshot24

Visualization in 7/425 by Eamae Mirkin26

Screenshot27

Music Is Math28 by Glenn Marshall692952

Screenshot30

Audio-generated landscape31 by flight4046359473832

Screenshot33

okdeluxe XMAS card 200834 by okdeluxe35

Screenshot36

Solar, with lyrics.37 by flight4046359473832

Screenshot39

Bubbletrouble_240 by Leander Herzog41

Screenshot42

House of Cards43 by Radiohead44
In Radiohead’s video for “House of Cards”, no cameras or lights were used. Instead, 3D plotting technologies collected information about the shapes and relative distances of objects. The video (directed by James Frost) was created entirely with visualizations of that data.

Screenshot45

Magnetic Ink46 by flight4046359473832

Screenshot48

Shifty49 by Pedro Mari50

Screenshot51

Advanced Beauty 13 of 1852 by Universal Everything53

Screenshot54

I Am David Sparkle – Jaded Afghan55 by Eduardo Omine56

Screenshot57

Relentless, The REV58 by flight4046359473832

Screenshot60

Aphex Twin – Rhubarb by Simon Geilfus61

Screenshot

Magnetosphere Revisited62 by flight4046359473832

Screenshot64

Vortex65 by Rui Madeira6620

Screenshot67

The Nest That Sailed The Sky68 by Glenn Marshall692952

Screenshot70

GoodMorning!71 by Jer Thorp72

Screenshot73

Sunflower74 by VS*75

Screenshot76

Interpol – Rest My Chemistry Video77 by Aaron Koblin78

Screenshot79

Free Applications for Creating Visuals with Computational Code Link

Processing Link

Screenshot80

Processing is a popular and powerful application for generating visuals using programming. It’s free and open source and uses Java as its coding language. It’s been used in professional, educational, and scientific environments and is available for GNU/Linux, Mac OS X, and Windows. It can also be used for web by embedding as Java applets or through the use of Processing.js81, which uses JavaScript to draw shapes and manipulate images using the HTML5 Canvas element. Processing is also available for Java-based mobiles (Mobile Processing).

  • Open Processing82
    Share your sketches online.
  • Useful Processing Applet Source Codes83
    A collection of free Java applet source codes.
  • Processing with Eclipse84
    If you are an avid Java programmer and have been using Eclipse for your daily routine this would be best way to use Processing, making your workspace comfortable and familiar. Another benefit that Eclipse adds is that you can harness the power of the latest Java IDE.

Quartz Composer Link

Screenshot85

Popular among Mac developers and VJs, Quartz Composer is the simplest application for creating still as well interactive motion graphics. It uses a node-based sequencing visual programming language that takes advantage of the Open GL, JavaScript, Core Image and Core Video devices and other technologies built into Mac OS X. It’s intended for non-programmers and is used by developers to construct user interfaces in conjunction with Cocao and other developer tools bundled in Xcode. It’s also used to create iTunes Music Visualizers.

Using third-party tools like Effect Builder AE86 and QC Integration FX87 you can turn your Quartz compositions into plug-ins for professional video editing / motion graphics applications such as Apple Final Cut, Adobe After Effects, Apple Motion, etc., without writing a single line of code. Many professional applications like Pixelmator use Quartz Composer on Mac to generate graphics and this is one of the reasons why some graphics processing application are available only for Mac OS X. As you probably guessed, Quartz Composer is only available for Mac OS X. Users of Mac OS X 10.6 or later can utilize OpenCL in Quartz Composers.

OpenFrameworks Link

Screenshot96

OpenFrameworks97 is a tool for creating interactive visuals, and is widely used among creative programmers. The user interface is simple and similar to that of Processing. Similar to Processing, it uses libraries, but it’s difficult to find third-party libraries and requires knowledge of C++ programming.

NodeBox Link

Screenshot101

NodeBox102 is similar to Processing and OpenFrameworks with the only major difference being the programming language used, which is Python. Although NodeBox has a small number of libraries in comparison with Processing, they are of good quality. NodeBox supports PDF, QuickTime movies, fonts and uses the Mac OS X Core Image library for image manipulations (blend modes, color changes, filters etc). NodeBox is available only for Mac OS X.

VVVV Link

Screenshot104

VVVV is usually used in large media environments like concerts and art installations for real-time motion graphics, video and audio processing and interactive motion graphics. Unlike Quartz Composer, VVVV comes with audio synthesis, 3D Mesh manipulation, and real-time video synthesis built in. It is a powerful application for generating visuals in real-time, even at very high resolution and high frame-rates.

Another important feature of VVVV is that it can make use of multiple computers behaving in sync. All programming and editing can be done on one server computer, while all client computers execute their respective tasks. You can easily use the CPU and GPU power of each computer to do some amazing effects at a cheaper cost. Since VVVV uses DirectX, it’s only available for Windows.

eMotion Link

Screenshot

eMotion is a new free application which can generate real-time as well as offset graphics. It has an awesome text and particle engine which is driven by real-world physics. It is available only for Mac OS X.

Creating Interactive Visuals with Computational Code Link

Here are some examples demonstrating adding interactivity into visuals.

Sonic Camera107 by Dmtr.org108

Screenshot109

Graffiti Analysis 2.0110 by Evan Roth111

Screenshot112

Amoeba Dance is built using Quartz Composer. Its not a pre-rendered visual but works totally in real-time mode, controlled using VDMX113 and is reactive to the audio input.

Screenshot

The Beauty of Fluid Dynamics114 by Jens Heinen115
Beautiful live interactive visual performances. Also watch Lichtfaktor vs Optix116 and Reincarnation117.

Screenshot118

Interactive Projection at GAGA Gallery155119 | Laser tag120
This project uses powerful lasers to virtually in-script graffiti on tall buildings. The laser is tracked and the graphics are projected in real time. Also check out the Eyewriter121 project which uses the same technology for helping physically disabled graffiti artists to once again bring their talent back to life. You can take a look at how-to and source code122, too.

Screenshot123

Digital Graffiti Wall + Stencils124 by Alex Beim125
Another similar version, also built with OpenFrameworks.

Screenshot126

Digital Wallpaper127 by Gregor Hofbauer128
Uses VVVV to generate graphics which are then projected and mapped to the wall.

Screenshot129

Body Navigation130 by Ole Kristensen131
Amazing example where interactive visuals are projected on to a wall. To add interactivity, everything is tracked using infrared light and cameras.

Screenshot132

Hand from Above133 by Chris O’Shea134
An amazing installation built with openFrameworks and openCV. Pedestrians are tickled, stretched, flicked or removed virtually in real-time.

Screenshot135

Quadrature136 by Griduo137
The walls of the building are virtually stretched, broken and reconstructed. A similar installation:

555 KUBIK138

Screenshot139

Castel Dell’Ovo140 by Quy & N1ente141
A stunning audio-visual performance created by mapping an entire building in a virtual world.

Screenshot142

Body Paint143 by Memo Akten144
Beautiful interactive installation which allows performers to paint on a virtual canvas with their body, interpreting gestures and dance into evolving compositions.

Screenshot145

Lights on146 by thesystemis147
Created for the Ars Electronica museum, which has a facade that contains 1085 LED controllable windows. The window colors are changed in real time with music that is broadcast on speakers surrounding the building. Visuals are created using openFrameworks.

Screenshot148

Vinyl Workout149 by Theo Watson153150
A giant record is projected on the floor and it can be played by running around its surface in the direction you want it to go. The speed of playing music is in sync with the speed of the moving person.

Screenshot151

Funky Forest – Interactive Ecosystem152 by Theo Watson153150
Funky Forest is an interactive installation for children. They can play with the water on floor, grow trees and water it and interact with various creatures. Built using openFrameworks. Also see these other amazing installations: Interactive Mural154, Interactive Projection at GAGA Gallery155119, Guten Touch156, Jellyfishes157 and Interactive Dancers System158.

Screenshot159

Reverse Shadow Theatre160 by Gabor Papp161
Amazing example in which the code powers the real-time puppet animation. Uses multiple software – Processing, Eyesweb and Animata. Both Eyesweb and Animata162 are open source, as is Processing. Here Eyesweb handles the motion tracking while Animata takes in the input data from Eyesweb and does the real-time animation. Also watch Jazz Pub163.

Tutorials Link

Screenshot166

DIY 3D Scanner167 by Kyle McDonald168
Another great application of computational code.

Screenshot169

DaVinci170 by Razorfish – Emerging Experiences171
Apart from producing amazing visual and real-time animations, computational code can give new meaning to human-computer interaction. If you like Microsoft Touch Screen Table then you are sure to like DaVinci. You can interact with a virtual world through a user interface that uses object recognition, real-world physics simulation, and gestural interface design.

Screenshot172

London Digital Week173 by seeper174
Multi-touch music sequencer.

Screenshot175

Books for Reference Link

Programming Interactivity: A Designer’s Guide to Processing, Arduino, and Openframeworks176 by Joshua Noble and Noble Joshua

Screenshot177

Learning Processing: A Beginner’s Guide to Programming Images, Animation, and Interaction178 by Daniel Shiffman

Screenshot179

Processing: Creative Coding and Computational Art180 by Ira Greenberg

Screenshot181

Real-Time Motion Graphics with Quartz Composer: A Hands-On Guide to Learning Quartz Composer182 by Graham Robinson and Surya Buchwald

Screenshot183

Processing: A Programming Handbook for Visual Designers and Artists184 by Casey Reas and Ben Fry

Screenshot185

Algorithms for Visual Design Using the Processing Language186 by Kostas Terzidis

Screenshot187

Visualizing Data188 by Ben Fry

Screenshot189

Resources Link

(ll)

Footnotes Link

  1. 1 http://vimeo.com/1747316
  2. 2 http://vimeo.com/user656427
  3. 3 http://vimeo.com/1747316
  4. 4 http://vimeo.com/2027825
  5. 5 http://vimeo.com/user656427
  6. 6 http://vimeo.com/2027825
  7. 7 http://vimeo.com/2726147
  8. 8 http://vimeo.com/threesixtyangles
  9. 9 http://vimeo.com/2726147
  10. 10 http://vimeo.com/7174318
  11. 11 http://vimeo.com/revoid
  12. 12 http://vimeo.com/7174318
  13. 13 http://vimeo.com/2712195
  14. 14 http://vimeo.com/stefangoodchild
  15. 15 http://vimeo.com/2712195
  16. 16 http://vimeo.com/174357
  17. 17 http://vimeo.com/flight404
  18. 18 http://vimeo.com/174357
  19. 19 http://vimeo.com/1693639
  20. 20 http://vimeo.com/ruimadeira
  21. 21 http://vimeo.com/1693639
  22. 22 http://vimeo.com/711364
  23. 23 http://vimeo.com/user320217
  24. 24 http://vimeo.com/711364
  25. 25 http://vimeo.com/994502
  26. 26 http://vimeo.com/user475471
  27. 27 http://vimeo.com/994502
  28. 28 http://vimeo.com/1593564
  29. 29 http://vimeo.com/user656427
  30. 30 http://vimeo.com/1593564
  31. 31 http://vimeo.com/2094557
  32. 32 http://vimeo.com/flight404
  33. 33 http://vimeo.com/2094557
  34. 34 http://vimeo.com/2574845
  35. 35 http://vimeo.com/okdeluxe
  36. 36 http://vimeo.com/2574845
  37. 37 http://vimeo.com/658158
  38. 38 http://vimeo.com/flight404
  39. 39 http://vimeo.com/658158
  40. 40 http://vimeo.com/354751
  41. 41 http://vimeo.com/lennyjpg
  42. 42 http://vimeo.com/354751
  43. 43 http://www.youtube.com/watch?v=8nTFjVm9sTQ
  44. 44 http://www.radiohead.com/
  45. 45 http://www.youtube.com/watch?v=8nTFjVm9sTQ
  46. 46 http://vimeo.com/615344
  47. 47 http://vimeo.com/flight404
  48. 48 http://vimeo.com/615344
  49. 49 http://vimeo.com/3092499
  50. 50 http://vimeo.com/defetto
  51. 51 http://vimeo.com/3092499
  52. 52 http://vimeo.com/1200976
  53. 53 http://vimeo.com/universal
  54. 54 http://vimeo.com/1200976
  55. 55 http://vimeo.com/1912921
  56. 56 http://vimeo.com/eomine
  57. 57 http://vimeo.com/1912921
  58. 58 http://vimeo.com/2120027
  59. 59 http://vimeo.com/flight404
  60. 60 http://vimeo.com/2120027
  61. 61 http://vimeo.com/simongeilfus
  62. 62 http://vimeo.com/169308
  63. 63 http://vimeo.com/flight404
  64. 64 http://vimeo.com/169308
  65. 65 http://vimeo.com/3550384
  66. 66 http://vimeo.com/ruimadeira
  67. 67 http://vimeo.com/3550384
  68. 68 http://vimeo.com/3245120
  69. 69 http://vimeo.com/user656427
  70. 70 http://vimeo.com/3245120
  71. 71 http://vimeo.com/6239027
  72. 72 http://vimeo.com/user313340
  73. 73 http://vimeo.com/6239027
  74. 74 http://vimeo.com/2016712
  75. 75 http://vimeo.com/vs
  76. 76 http://vimeo.com/2016712
  77. 77 http://vimeo.com/2320742
  78. 78 http://vimeo.com/aaronkoblin
  79. 79 http://vimeo.com/2320742
  80. 80 http://processing.org/
  81. 81 http://processingjs.org/
  82. 82 http://www.openprocessing.org/
  83. 83 http://www.thepixelart.com/useful-processing-applet-source-codes/
  84. 84 http://backspaces.net/29/processing-with-eclipse/
  85. 85 http://developer.apple.com/graphicsimaging/quartz/quartzcomposer.html
  86. 86 http://www.pixlock.com/
  87. 87 http://www.chv-plugins.com/cms/FxPlug/QC-Integration/QC-Integration.php
  88. 88 http://developer.apple.com/documentation/GraphicsImaging/Conceptual/QuartzComposer/qc_intro/chapter_1_section_1.html
  89. 89 http://developer.apple.com/mac/library/releasenotes/GraphicsImaging/RN-QuartzComposer/index.html
  90. 90 http://www.quartzcompositions.com
  91. 91 http://www.thepixelart.com/quartz-composer-tutorials/
  92. 92 http://vimeo.com/809083
  93. 93 http://kineme.net/
  94. 94 http://www.zugakousaku.com/
  95. 95 http://www.samkass.com/blog/page4/page4.html
  96. 96 http://www.openframeworks.cc
  97. 97 http://www.openframeworks.cc
  98. 98 http://wiki.openframeworks.cc/index.php?title=OF_Start_Up_Guide
  99. 99 http://www.openframeworks.cc/forum/
  100. 100 http://wiki.openframeworks.cc
  101. 101 http://www.nodebox.net
  102. 102 http://www.nodebox.net
  103. 103 http://nodebox.net/code/index.php/Library
  104. 104 http://www.vvvv.org
  105. 105 http://www.strukt.com/
  106. 106 http://vimeo.com/3765704
  107. 107 http://vimeo.com/41193
  108. 108 http://vimeo.com/dimitre
  109. 109 http://vimeo.com/41193
  110. 110 http://vimeo.com/7283422
  111. 111 http://vimeo.com/fi5e
  112. 112 http://vimeo.com/7283422
  113. 113 http://www.vidvox.net
  114. 114 http://vimeo.com/4377703
  115. 115 http://vimeo.com/visionlabz
  116. 116 http://vimeo.com/5966947
  117. 117 http://vimeo.com/3047446
  118. 118 http://vimeo.com/4377703
  119. 119 http://vimeo.com/262063
  120. 120 http://www.theowatson.com/site_docs/work.php?id=40
  121. 121 http://vimeo.com/6376466
  122. 122 http://muonics.net/blog/index.php?postid=15
  123. 123 http://www.theowatson.com/site_docs/work.php?id=40
  124. 124 http://vimeo.com/7260240
  125. 125 http://vimeo.com/tangible
  126. 126 http://vimeo.com/7260240
  127. 127 http://vimeo.com/6378943
  128. 128 http://vimeo.com/gregorhofbauer
  129. 129 http://vimeo.com/6378943
  130. 130 http://vimeo.com/1362832
  131. 131 http://vimeo.com/olekristensen
  132. 132 http://vimeo.com/1362832
  133. 133 http://www.chrisoshea.org/projects/hand-from-above/
  134. 134 http://www.chrisoshea.org
  135. 135 http://www.chrisoshea.org/projects/hand-from-above/
  136. 136 http://vimeo.com/5756657
  137. 137 http://vimeo.com/griduo
  138. 138 http://vimeo.com/5595869
  139. 139 http://vimeo.com/5756657
  140. 140 http://vimeo.com/7541297
  141. 141 http://vimeo.com/user1953754
  142. 142 http://vimeo.com/7541297
  143. 143 http://vimeo.com/5094780
  144. 144 http://vimeo.com/memotv
  145. 145 http://vimeo.com/5094780
  146. 146 http://vimeo.com/4706049
  147. 147 http://vimeo.com/thesystemis
  148. 148 http://vimeo.com/4706049
  149. 149 http://vimeo.com/3871236
  150. 150 http://vimeo.com/muonics
  151. 151 http://vimeo.com/3871236
  152. 152 http://vimeo.com/3872687
  153. 153 http://vimeo.com/muonics
  154. 154 http://vimeo.com/4177026
  155. 155 http://vimeo.com/262063
  156. 156 http://vimeo.com/3288753
  157. 157 http://vimeo.com/1017469
  158. 158 http://vimeo.com/3922752
  159. 159 http://vimeo.com/3872687
  160. 160 http://vimeo.com/706938
  161. 161 http://vimeo.com/gabor
  162. 162 http://animata.kibu.hu
  163. 163 http://vimeo.com/664556
  164. 164 http://animata.kibu.hu/tutorials.html
  165. 165 http://originalhamsters.com/blog/2008/12/15/animata-osc/
  166. 166 http://vimeo.com/706938
  167. 167 http://vimeo.com/3193063
  168. 168 http://vimeo.com/kylemcdonald
  169. 169 http://vimeo.com/3193063
  170. 170 http://vimeo.com/3635423
  171. 171 http://vimeo.com/razorfishee
  172. 172 http://vimeo.com/3635423
  173. 173 http://vimeo.com/7063106
  174. 174 http://vimeo.com/seeper
  175. 175 http://vimeo.com/7063106
  176. 176 http://oreilly.com/catalog/9780596154158
  177. 177 http://oreilly.com/catalog/9780596154158
  178. 178 http://www.learningprocessing.com/
  179. 179 http://www.learningprocessing.com/
  180. 180 http://www.friendsofed.com/book.html?isbn=159059617X
  181. 181 http://www.friendsofed.com/book.html?isbn=159059617X
  182. 182 http://www.amazon.com/Real-Time-Motion-Graphics-Quartz-Composer/dp/0321636945/
  183. 183 http://www.amazon.com/Real-Time-Motion-Graphics-Quartz-Composer/dp/0321636945/
  184. 184 http://www.amazon.com/Processing-Programming-Handbook-Designers-Artists/dp/0262182629/
  185. 185 http://www.amazon.com/Processing-Programming-Handbook-Designers-Artists/dp/0262182629/
  186. 186 http://www.wiley.com/WileyCDA/WileyTitle/productCd-0470375485.html
  187. 187 http://www.wiley.com/WileyCDA/WileyTitle/productCd-0470375485.html
  188. 188 http://oreilly.com/catalog/9780596514556
  189. 189 http://oreilly.com/catalog/9780596514556
  190. 190 http://opencv.willowgarage.com/wiki/
  191. 191 http://www.arduino.cc/en/Main/Software
  192. 192 http://www.thepixelart.com/best-software-for-visual-performance-artist/
  193. 193 http://www.flickr.com/groups/processing/
  194. 194 http://www.flickr.com/groups/_aa/pool/
  195. 195 http://www.flickr.com/groups/vvvv/
  196. 196 http://www.flickr.com/groups/vjing/
SmashingConf Oxford

Hold on tiger! Thank you for reading the article. Did you know that we also publish printed books and run friendly conferences – crafted for pros like you? Like SmashingConf Oxford, on March 15—16, with smart design patterns and front-end techniques.

↑ Back to top Tweet itShare on Facebook

Vailancio Rodrigues is a web ninja who bakes semantic muffins. Apart from that he is also interested in Motion Graphics, Visual Effects, Photography and knows little bit of Physics due to his college education . He is from Goa - a beautiful tropical paradise in India.

Advertisement
  1. 1

    Thank you Vailancio Rodrigues!
    I have not heard much about this art.
    by the way I love it

    0
  2. 2

    What a beautiful article!! Simply amazing!!

    1
  3. 3

    Very Useful Collection Guys :)
    Do check out some powerful motion graphics plugins for some hollywood effects.
    http://www.appsheriff.com/software/motion-graphic-plugins-to-create-hollywood-special-effects/

    1
  4. 4

    Wow. Some of those examples just blew me away… I’m a 3D Arist (well, student) but I’ve done programming before (C++, Java, and Actionscript though none extensively). Can’t wait to give this a try!

    1
  5. 6

    Very cool, I quite enjoyed this in depth look to many areas of motion from programming.

    1
  6. 7

    As already said above: Wow! Thanks for collecting all these in one place

    1
  7. 8

    Hi guys I more into Web than any other thing my brother is really into processing, he told me some cool things can be done for the web with this tool, like interactive an animation stuff you a check out his site is full of information about it an also about programing for architecture and 3d modeling http://designplaygrounds.com

    1
  8. 9

    Very very nice work.

    1
  9. 10

    I am kind of surprised that ActionScript 3 with Flash Player 10 did not make it into this article. There are many programming artists out there that are using this platform to create some amazing interactive art pieces. The nice thing about AS3 is you do not need Adobe Flash IDE to program it. Flash Develop is an open source IDE that has better functionality than the Flash IDE but it is free!

    1
    • 11

      Vailancio Rodrigues

      February 6, 2010 10:46 am

      Yes ActionScripts should have been here. But we thought of excluding it because it is very common. Everybody knows about it and lot of info is already available on it. We want to give our readers something new. But we did include one example of actionscript which was really interesting and hardly anybody had seen it before.

      If you like to have something on ActionScripts in future then you can leave a reply here.

      1
      • 12

        Yes I think it could be a great article. Most people think of Flash as interactive websites but there so much more there with the power of AS3 and Flash Player 10. People like http://blog.stroep.nl/category/generative-art/ are taking Flash to a new medium. I think Flash has a better home in these areas of motion art than on the web because of lack of SEO in Flash sites, though that is improving but not any where near what good semantic HTML/CSS can do.

        Thanks

        0
  10. 13

    looks really nice………

    0
  11. 14

    Wow, these are awesome!

    0
  12. 15

    This is such an amazing medium as it brings the experience of art to a new level. I was just in Seoul where there were many motion graphic pieces located in public spaces around the city and it made me wonder why other cities do not engage the public like this! Thanks for the article!

    1
  13. 16

    This is amazing ………….

    0
  14. 17

    Oh wow. I’d heard about this programming language, a friend of mine is doing his Honours study on it, but I hadn’t seen any examples. Fantastic.

    1
  15. 18

    Wow, very very inspiring artical. I know wat i’m going to do today…

    0
  16. 19

    Davide Della Casa

    February 7, 2010 6:38 am

    Hi,

    with a group of friends we have been working on a pretty cool site that allows people to collaboratively create generative art like the examples above using the Processing language – but in a very immediate way and without requiring any downloads: users can browse/copy/edit/share sketches with unprecedented immediacy – all within their browser without downloading a thing.

    Some of the works in the gallery are very nice!

    The site it’s here, make sure to check it out!

    http://www.sketchpatch.net

    0
  17. 20

    “It’s unlikely that you would consider a “programmer” when thinking of creative fields of work. But programmers have the potential to be creative and come up with ideas or concepts that will impact others in positive ways.”

    Programming is actually a highly creative activity. It’s a design activity (as opposed to building activity).

    1
  18. 21

    Also a nice projection with architecture integration
    http://vimeo.com/2669170

    0
  19. 22

    Now get us some amazing source code written by designers ; ]

    1
  20. 23

    This is an absolutely invaluable article. Thank you so much!!

    1
  21. 24

    Long time ago i read about processing, but in that time i wasn’t programmer,
    now I’ll give it a chance

    2
  22. 25

    Very nice posting…….keep posting more

    0
  23. 26

    Wow, this is one of the best posts ever!

    Really enjoyed it :)

    0
  24. 27

    I love processing. I used it for my senior project… so not as cool but I thought I’d share:

    http://www.karinlindstrom.com/animagic

    0
  25. 28

    Stunning info. I was searching for something like this for a long time.

    Thank you, you saved my life :)

    1
  26. 29

    If anyone wants to play with the onedotzero identity then you can download the app and the source from -> http://code.google.com/p/onedotzero-ident/

    thanks

    0
  27. 30

    Those looking to create high performance iTunes visualizers might want to check out VizKit. It works on both Windows and Mac. Here’s the homepage:
    http://www.imagomat.de/vizkit/

    The sample viz that comes with it isn’t all that impressive but you can build some crazy stuff. I used to make a visualizer I call Manifesto. It lives at:
    http://blog.insightvr.com/?page_id=57

    and examples of its 3D mode is at:
    http://www.vimeo.com/4033579

    and one of the 2D modes is at:
    http://www.vimeo.com/4033579

    Of course running it on your own machine always looks better than the screen captures.

    My goal for the system was to make it as “reactive” as possible to the music. So if nothing is happening audio wise the visualizer shouldn’t be don’t anything new, and all the changes in color, spin, etc should be determined by the music.

    0
  28. 32

    Great collection. Thanks very much. My Vimeo likes collection just expanded considerably.

    1
  29. 33

    Truly amazing visuals from code and math! Makes a programmer like me happy!

    1
  30. 34

    Frederik De Bleser

    February 9, 2010 2:18 am

    I’d like to point out that we’re actively working on NodeBox 2 which has a node-based interface, like Quartz Composer and vvvv. You can create work using existing nodes or adapt built-in nodes using Python.

    http://beta.nodebox.net/

    0

↑ Back to top