Creating Coding across Screens

Creating Coding across Screens

An awareness talk about creative coding platforms and tools for the FITC Screens conference that took place November 11 & 12 in Toronto, Canada to an audience of about 50 attendees ranging from designers, developers, to creative coders.

D4e6eb8ffdbc19c6394eec58895509a9?s=128

Scott Janousek

November 11, 2011
Tweet

Transcript

  1. @scottjanousek #SCREENS, #FITC Wednesday, November 16, 11

  2. Creating Coding across Screens at FITC Screens taking place Nov

    14-15 2011 in lovely Toronto Wednesday, November 16, 11
  3. Agenda Intro Screens Creative Coding Creative Tooling Processing, OF, Cinder,

    more? Outro Wednesday, November 16, 11
  4. INTRO Wednesday, November 16, 11

  5. Hello @scottjanousek Former Mobile & Device “Veteran” “Analog and Digital

    Artisan” Innovation Architect @ Isobar Wednesday, November 16, 11
  6. Web Interactive Mobile & Devices Physical Computing Wednesday, November 16,

    11
  7. Wednesday, November 16, 11

  8. FITC MOBILE 2009 Wednesday, November 16, 11

  9. Recent FITC Events ... Wednesday, November 16, 11

  10. FITC Toronto 2011 “Sifteo Cubes” @ Influxis Voodoo Lounge Wednesday,

    November 16, 11
  11. Riaunleashed 2011 Physical Computing + Android Wednesday, November 16, 11

  12. Google Android ADK & OA Wednesday, November 16, 11

  13. Cool stuff you should check out ... Wednesday, November 16,

    11
  14. Wednesday, November 16, 11

  15. Conferences! Wednesday, November 16, 11

  16. Wednesday, November 16, 11

  17. Wednesday, November 16, 11

  18. @seb_ly Creative JS world tour! Wednesday, November 16, 11

  19. Wednesday, November 16, 11

  20. Wednesday, November 16, 11

  21. Wednesday, November 16, 11

  22. Wednesday, November 16, 11

  23. Wednesday, November 16, 11

  24. Wednesday, November 16, 11

  25. Wednesday, November 16, 11

  26. @blprnt Jer Thorp Processing Workshop Wednesday, November 16, 11

  27. Work Wednesday, November 16, 11

  28. Kinds of work we do Custom Touch Table (for Reebok)

    Wednesday, November 16, 11
  29. Kinds of work we do Custom Touch Table (for Reebok)

    Wednesday, November 16, 11
  30. Let’s play ... “Weird stuff in Scott’s office!” Wednesday, November

    16, 11
  31. Research & Development Wednesday, November 16, 11

  32. Parametric Speaker Array. :) Wednesday, November 16, 11

  33. Robotic Claw! Wednesday, November 16, 11

  34. “Lit Plexi” Wednesday, November 16, 11

  35. Light Globe “Thingy Ma-Bob” Wednesday, November 16, 11

  36. RF-ID, & arduino Wednesday, November 16, 11

  37. “Umbilical” Cord for a “project” Wednesday, November 16, 11

  38. Other Stuff I’m engaged in ... Wednesday, November 16, 11

  39. Makerbot & “Fab” Wednesday, November 16, 11

  40. MakerBot! Wednesday, November 16, 11

  41. “Spatial & Gestural UI” space Wednesday, November 16, 11

  42. CREATIVE CODING Wednesday, November 16, 11

  43. Tools & Frameworks Wednesday, November 16, 11

  44. SCREENS Wednesday, November 16, 11

  45. Visual Spectrum Wednesday, November 16, 11

  46. Target Screens Desktops, Laptops & Netbooks SmartPhones & Pocket Devices

    Tablets TVs Tables, Kiosks, Billboards Projected Displays Wednesday, November 16, 11
  47. Mobile Impact In my mind, there is no question these

    are the clear winners ... but what is the “next race”? Wednesday, November 16, 11
  48. Some Devices ... Wednesday, November 16, 11

  49. What’s next with Screens? Wednesday, November 16, 11

  50. Projected Light UI Wednesday, November 16, 11

  51. Projected Light UI Wednesday, November 16, 11

  52. CREATIVE TOOLING Wednesday, November 16, 11

  53. What are we talking about? “... Computer Programs in art

    such as real life art installations, interactive video, large-scale public projections, computer vision projects, interactive sound recordings, & more ...” OR ... into the realm of ... PHYSICAL COMPUTING. Wednesday, November 16, 11
  54. What do we want in our tools? “Performability” Portability Extensibility

    & more ... Wednesday, November 16, 11
  55. Timeline (Rough) 1990’s 2000’s 2010 Processing OpenFrameworks Cinder PolyCode Flash

    Shockwave HyperCard Wednesday, November 16, 11
  56. Languages Discussed Today C++ (most of our focus) Java ActionScript

    Lua JS Wednesday, November 16, 11
  57. Going Native “A native development kit (NDK) is a software

    development kit (SDK) based on a native application programming interface (API) which allows computer software to be developed directly on a computing platform, rather than via a virtual machine. Creating software on a virtual machine is often easier than on a native development kit. However, the advantages of using an NDK is that it allows developers more options, and can yield higher performance.” Wednesday, November 16, 11
  58. C++ Fast Powerful Strict (& unforgiving) Extendable Reliable Wednesday, November

    16, 11
  59. Wednesday, November 16, 11

  60. Processing Wednesday, November 16, 11

  61. Genesis aka (LEFT) Casey Reas and (RIGHT) Ben Fry -

    The Co-creators of Processing Wednesday, November 16, 11
  62. “Processing is an open source programming language and environment for

    people who want to create images, animations, and interactions.” Mission Statement Wednesday, November 16, 11
  63. Ben updated it ... Wednesday, November 16, 11

  64. “Today, there are tens of thousands of students, artists, designers,

    researchers, and hobbyists who use Processing for learning, prototyping, and production.” Why Processing? “Initially developed to serve as a software sketchbook and to teach fundamentals of computer programming within a visual context, Processing also has evolved into a tool for generating finished professional work.” Wednesday, November 16, 11
  65. Processing Wiki Wednesday, November 16, 11

  66. vimeo.com/28117873 Processing 2.0 Wednesday, November 16, 11

  67. People to Follow ... @ben_fry @reas @blprnt @shiffman and more

    ... Wednesday, November 16, 11
  68. processing.org Wednesday, November 16, 11

  69. Wednesday, November 16, 11

  70. Java - the language Wednesday, November 16, 11

  71. FYI Processing 2.0 alpha 3 is recently out! * *

    As of November 2011 Wednesday, November 16, 11
  72. Environment Wednesday, November 16, 11

  73. “Sketch” (i.e. app) void setup() { // define the window

    size & enable anti-aliasing size(200, 200); smooth(); // Set "ink" color, font, and alignment for rendering text. fill(0); // Black // setup the font (system default sans serif) textFont(createFont("SansSerif",18)); textAlign(CENTER); noLoop(); // draw() executes only once } void draw() { // Draw text to screen using the previously set font. text("Hello World!", width/2, height/2); } Wednesday, November 16, 11
  74. Examples Wednesday, November 16, 11

  75. Libraries Wednesday, November 16, 11

  76. Generative Art Experiments Wednesday, November 16, 11

  77. Wednesday, November 16, 11

  78. Wednesday, November 16, 11

  79. Wednesday, November 16, 11

  80. Wednesday, November 16, 11

  81. Wednesday, November 16, 11

  82. Wednesday, November 16, 11

  83. Wednesday, November 16, 11

  84. Wednesday, November 16, 11

  85. Wednesday, November 16, 11

  86. Wednesday, November 16, 11

  87. Wednesday, November 16, 11

  88. Wednesday, November 16, 11

  89. Wednesday, November 16, 11

  90. Wednesday, November 16, 11

  91. Wednesday, November 16, 11

  92. Wednesday, November 16, 11

  93. Wednesday, November 16, 11

  94. Wednesday, November 16, 11

  95. Wednesday, November 16, 11

  96. Wednesday, November 16, 11

  97. Wednesday, November 16, 11

  98. Data Visualization Wednesday, November 16, 11

  99. Wednesday, November 16, 11

  100. Wednesday, November 16, 11

  101. Wednesday, November 16, 11

  102. Wednesday, November 16, 11

  103. ` Toxilibs “toxiclibs is an independent, open source library collection

    for computational design tasks with Java & Processing developed by Karsten “toxi” Schmidt (thus far).” Wednesday, November 16, 11
  104. Toxilibs “The classes are purposefully kept fairly generic in order

    to maximize re-use in different contexts ranging from generative design, animation, interaction/interface design, data visualization to architecture and digital fabrication, use as teaching tool and more.” Wednesday, November 16, 11
  105. Targets Wednesday, November 16, 11

  106. Desktops Wednesday, November 16, 11

  107. Web - JS Export Wednesday, November 16, 11

  108. processing.js Wednesday, November 16, 11

  109. Mobile - iProcessing Wednesday, November 16, 11

  110. Mobile - Android Wednesday, November 16, 11

  111. Mobile Processing Recent Event Wednesday, November 16, 11

  112. Cons Performance is not 100% native Some fragmentation on devices

    Java is powerful, but legacy Wednesday, November 16, 11
  113. Pros Simple to install & run Simple, yet powerful language

    Nice learning curve Decent libraries Fast prototyping! Wednesday, November 16, 11
  114. Future? Processing is a multi-versatile tool Community driven 2.03a brings

    power & > targets Stellar tool for data viz! Wednesday, November 16, 11
  115. Wednesday, November 16, 11

  116. openframeworks.cc Wednesday, November 16, 11

  117. Mission Statement Wednesday, November 16, 11

  118. Some of the OF Dev “Crew” Wednesday, November 16, 11

  119. OF “GANG SIGN” Wednesday, November 16, 11

  120. OF Forums Wednesday, November 16, 11

  121. “007” release Wednesday, November 16, 11

  122. Dev Environments Wednesday, November 16, 11

  123. Code Basics #include "ofMain.h" #include "testApp.h" #include "ofAppGlutWindow.h" //======================================================================== int

    main( ){ ofAppGlutWindow window; ! ofSetupOpenGL(&window, 1024,768, OF_WINDOW);! ! ! // <-------- setup the GL ! // this kicks off the running of my app ! // can be OF_WINDOW or OF_FULLSCREEN ! // pass in width and height too: ! ofRunApp( new testApp()); } Wednesday, November 16, 11
  124. Code Basics #include "testApp.h" void testApp::setup(){} void testApp::update(){} void testApp::draw(){}

    void testApp::keyPressed(int key){} void testApp::keyReleased(int key){} void testApp::mouseMoved(int x, int y ){} void testApp::mouseDragged(int x, int y, int button){} void testApp::mousePressed(int x, int y, int button){} void testApp::mouseReleased(int x, int y, int button){} void testApp::gotMessage(ofMessage msg){} Wednesday, November 16, 11
  125. Code Basics #pragma once #include "ofMain.h" class testApp : public

    ofBaseApp { ! public: ! ! void setup(); ! ! void update(); ! ! void draw(); ! ! void keyPressed (int key); ! ! void keyReleased(int key); ! ! void mouseMoved(int x, int y ); ! ! void mouseDragged(int x, int y, int button); ! ! void mousePressed(int x, int y, int button); ! ! void mouseReleased(int x, int y, int button); ! ! void windowResized(int w, int h); ! ! void dragEvent(ofDragInfo dragInfo); ! ! void gotMessage(ofMessage msg); }; Wednesday, November 16, 11
  126. OF API Wednesday, November 16, 11

  127. OF Core Objects Application Graphics Video Utils Sound Player Sound

    Stream Math Serial Arduino Wednesday, November 16, 11
  128. Addons “openFrameworks addons are additional third party libraries that can

    be added to your projects to extend their functionality.” Wednesday, November 16, 11
  129. Provided Addons ofxDirList ofxXmlSettings ofxOsc ofxOpenCv ofxNetwork ofxThread ofxVectorMath ofxVectorGraphics

    ofx3dModelLoader Wednesday, November 16, 11
  130. New Addons Site Wednesday, November 16, 11

  131. Examples Wednesday, November 16, 11

  132. Targets Wednesday, November 16, 11

  133. Desktop Wednesday, November 16, 11

  134. Mobile - iOS Wednesday, November 16, 11

  135. Mobile - Android Wednesday, November 16, 11

  136. Face Tracking Example Wednesday, November 16, 11

  137. Cons Long version cycles Smaller, niche community C++ learning curve

    Lack of libraries* * check out recent site: ofxaddons.com Wednesday, November 16, 11
  138. Pros Innovative Dev Community Native Performance Audio & Visual Capabilities

    Computer Vision Physical Computing Wednesday, November 16, 11
  139. Future? OF is gaining momentum. OF is prime for Physical

    Computing. Wednesday, November 16, 11
  140. Wednesday, November 16, 11

  141. cinderlib.org Wednesday, November 16, 11

  142. “Cinder is a powerful, intuitive cross-platform toolbox for programming graphics,

    audio, video, networking, image processing and computational geometry. “ CinderLib Wednesday, November 16, 11
  143. “Cinder is a community-developed, free and open source library for

    professional-quality creative coding in C++.” Mission Statement Wednesday, November 16, 11
  144. Event Handling, Screensavers, Internet I/O, I/O from flat files, memory,

    resources, & networks, C++ Core, iOS Support & Multitouch, UI Events, XML Parser and more! Support Wednesday, November 16, 11
  145. Contents Wednesday, November 16, 11

  146. Environments Wednesday, November 16, 11

  147. Basic Code Wednesday, November 16, 11

  148. Tinderbox Wednesday, November 16, 11

  149. Examples Wednesday, November 16, 11

  150. Kinect Library Robert Hodgin’s “Body Dysmorphic Disorder” Wednesday, November 16,

    11
  151. Kinect Library Robert Hodgin’s “Body Dysmorphic Disorder” Wednesday, November 16,

    11
  152. Planetary App Bloom.io - iOS music visualizer app Wednesday, November

    16, 11
  153. Targets Wednesday, November 16, 11

  154. Desktop Wednesday, November 16, 11

  155. Mobile - iOS Wednesday, November 16, 11

  156. Cons Slow to release updates Smaller, niche community C++ Learning

    curve Lack of libraries Wednesday, November 16, 11
  157. Pros Innovative Dev Community Native Performance Audio & Visual Capabilities

    Computer Vision Physical Computing Wednesday, November 16, 11
  158. Cinder is still experimental. Last push was Summer 2011. Lots

    of promise. Hopeful it sticks around! Future? Wednesday, November 16, 11
  159. Wednesday, November 16, 11

  160. adobe.com/flash Wednesday, November 16, 11

  161. Mission Statement Does Adobe even have one for Flash? Roadmap

    URL? ... Video, 3-D, Games I suppose ... Wednesday, November 16, 11
  162. Recent News Wednesday, November 16, 11

  163. Thoughts Wednesday, November 16, 11

  164. Thoughts Watch @seb_ly’s “What the Flux?” preso Wednesday, November 16,

    11
  165. Recent Project Custom Touch Table Wednesday, November 16, 11

  166. Recent Project Custom Touch Table Wednesday, November 16, 11

  167. Environment Wednesday, November 16, 11

  168. HYPE Framework Wednesday, November 16, 11

  169. Sample Code Wednesday, November 16, 11

  170. Targets Wednesday, November 16, 11

  171. Desktop Wednesday, November 16, 11

  172. Mobile - iOS Wednesday, November 16, 11

  173. Mobile - Android Wednesday, November 16, 11

  174. Mobile - Blackberry OS Wednesday, November 16, 11

  175. Cons Too Versatile? Flash Player for Devices Not native performance*.

    Proprietary Runtimes. Wednesday, November 16, 11
  176. Pros Multi-versatile. Cross Platform (on the Desktop). Easy to pick

    up ActionScript. Fast Prototyping. Wednesday, November 16, 11
  177. Future? Parts of Flash are Deprecated. Flash is targeting video,

    games, 3-D. Adobe is getting back to its roots? Wednesday, November 16, 11
  178. Wednesday, November 16, 11

  179. polycode.org Wednesday, November 16, 11

  180. Creator Wednesday, November 16, 11

  181. Basic App Wednesday, November 16, 11

  182. Mission Statement “Polycode is a free, open-source, cross-platform framework for

    creative code. You can use it as a C++ API or as a standalone scripting language to get easy and simple access to accelerated 2D and 3D graphics, hardware shaders, sound and network programming, physics engines and more.” Wednesday, November 16, 11
  183. PolyCode “On top of the core C++ API, Polycode offers

    a Lua- based scripting system with its own set of compilation tools. The Lua API mirrors the C++ API and can be used to easily create prototypes and even publish complete applications to multiple platforms without compiling C+ +. Polycode is completely open-source and available under the MIT license and was designed and developed by Ivan Safrin” Wednesday, November 16, 11
  184. Modules 2D/3D Physics and Collision UI Networking LightMaps GLSL CgShading

    Terrain Kinect Wednesday, November 16, 11
  185. API Wednesday, November 16, 11

  186. Basic Code Wednesday, November 16, 11

  187. Environment Wednesday, November 16, 11

  188. Examples Wednesday, November 16, 11

  189. Gallery Wednesday, November 16, 11

  190. Targets Wednesday, November 16, 11

  191. Desktop Only Wednesday, November 16, 11

  192. Cons Fairly New. API limitations. Smaller, niche community. No mobile

    targets (yet). Wednesday, November 16, 11
  193. Pros Native Performance. Easy to get started. Lua or C++.

    Turning out to be good at 2 & 3D. Wednesday, November 16, 11
  194. Future? Polycode is still early in development. Lua is gaining

    popularity within developer circuit. Alternatives are always good. Wednesday, November 16, 11
  195. TAKE AWAYS Wednesday, November 16, 11

  196. “Be passionate about your work, but do not get emotionally

    attached to your tools ... Tools can, and will be replaced.” TAKE AWAY #1 Wednesday, November 16, 11
  197. “Whenever possible, use the right tool for the right job.”

    “Using a Hammer to screw in a nail doesn’t lead to good results.” TAKE AWAY #2 Wednesday, November 16, 11
  198. GO FORTH ... EXPERIMENT AND TINKER! HAVE FUN! TAKE AWAY

    #3 Wednesday, November 16, 11
  199. OUTRO Wednesday, November 16, 11

  200. Resources Wednesday, November 16, 11

  201. Book Wednesday, November 16, 11

  202. Book Wednesday, November 16, 11

  203. creativecodingpodcast.com PodCast Wednesday, November 16, 11

  204. Q & A Wednesday, November 16, 11

  205. Thank you. Wednesday, November 16, 11

  206. Links www.creativeapplications.net processing.org cinderlib.org openframeworks.cc polycode.org adobe.com/flash Wednesday, November 16,

    11