Let The Dog Out – Instagram Mosh!

Here’s a new processing experiment, my first try to make a messy dirty rendering, it was very relaxing and fun to program since the only thing you want to do is fuck things up as much as possible!! The original inspiration come from that post

Video below (please watch it in HD on Vimeo)
**********************************************************************************************
Warning: these film contains flashing images which may be harmful to some viewers.
**********************************************************************************************

And those are the screenshots.

Same images with higher resolution on Dropbox

Except the music, everything on that video is generated on the fly by processing and it shows very different result each time you run the sketch, this is just one version uploaded here. Quick overview of What the program’s doing:
1) Batch download a bunch of files from Instagram API based on a list of hashtags (you can see the list at the begining of the vids, or at the end of this post)
2) Save all info (user, hashtags, photos)
3) Start showing the photos at an incremental speed
4) Display “random” text (generated from an array) + GLSL shaders
5) Glitch the whole thing up!

The ‘speeding’ effect is achieved with a sin function that keeps oscillating faster and faster during the 2 mns duration of the song (the angle of the sinus is incremented using a exponential function). A “luck factor” is also incremented while the program’s running triggering more and more titles, GLSL shader and glitches as time goes by.

That’s about it really, the music is from Venetian Snares “Fuck Canada, Fuck America“. On the tech side, I used Processing 2.0b7 (the neat integration of openGL GLSL shaders by Andres Colubri make it so much fun to play with!), the http library to easily load data from Instagram API, GlitchP5 lib works pretty smoothly as well (even though it would be nice to implement it further to add more control over the effect, especially to control the color noise level which is too wild sometime),  minim for the sound, Geomerative to convert text into shape (to apply shaders on them). Some of the GLSL shaders come from GLSL sandbox from Mr.doob and others, and Inigo Quilez‘s Shader Toy.

As for sources I will share them here later on but feel free to hit me up if you like to have them, be warmed though that’s it’s a mega mess right now so use at your own risk, also the program is crashing the system pretty often, which is a rather good sign for a glitching experiment… FYI it looks like the most stable Processing settings so far are 2Gb of memory and run it in 32bit mode… voila.

Hashtags: #CuteFeet, #Babyfeet, #Snacks, #Park, #EmptyPlate, #Torso, #Cloudscape, #Quote, #JumpingForJoy, #Braid, #Beach, #Sunset, #CupCakes, #Concert, #TribalTatoo, #Leftovers, #KissFace, #Latte, #NewShoes, #Selfportrait, #Frappuccino, #BloodyHands, #Seashell, #topFace, #CuteDog, #CuteCat, #Meat, #Flesh, #AngryDog, #Canines, #BurgerPorn, #Blood, #Meat, #Intestine, #Dogfight

Photos sources:
@igfeets @igfeets @igfeets @igfeets @igfeets @toeprincess @xsagii_baybeex @girlsfeet @_justfeet @lissysfeet @briellelynnebabe @_dranksinatra @kailapaige_ @orgmets @sebb_ @deeandpenny @ashiee90 @mdheard87 @justineana05 @itskringkringdorko @surfer_4life @stanou26 @stanou26 @alous92 @nurainluvv_justinbieber @naomialdisaa @jjbnr @krkruuuu @agirlwhohatesmacaroon @marco_ray @annabelbenezra @redcupsofpatron @annabelbenezra @swaggiedoll19 @gthesinblephap04 @lariaerlae @annabelbenezra @adelbm @annabelbenezra @redelizah @louieruberto23 @niklasberg @therealpresslyparrish @jeffkisthename @davidsmooke @evagi3 @felix_lambiz @bkaelamar @forbesphotog @kylerj @louiemos @klaralo @jonaspdominique @johangrimberg @hammer87 @jeremykaikala @dianaxpetersen @jonathanjaxson @emanwinston @jonathanjaxson @docthefeelgood @smartfon4er @weslinimusfartacus @human_traffic @jessiejannee @siggimon97 @jaceksz @oleidolet @jaceksz @retro_flava @noemimalingieri @noemimalingieri @ali21122516 @sweetnsowder @aliseregni @sinakanpha92 @noemimalingieri @thiscoolpablers @aqeelta @osher1575 @lol_lou @breanny12 @zehralouise @iepedie_quaqua @jes2juls @sarah_marie_94 @islander33 @multibeauty4u @chanarraolsen @nathalietaylor87 @anneeng95 @incompletepicture @lo_reena @miss_shopaholic @marieminde @megspurdy @tslil11100 @freefallinintolife @annabrezinski97 @bhreaghmoore @suzhiea @samantha520_xoxo @_ella_xoxo @sirgrewal @nettakarp @barbiegirl_ilaria @laurabr0wn @antho_vanucci @rita_karapatakis @miriamercurio @kellymusa @haljane @martina_albano @jezniaesther @giudittav @jaenelr @clautassi @saeedalemadi @jessicamarnell @mtfaria @emilycgraff @meckieermy @tat_bieber_14 @50shadesofstef @esechulo69 @kachetonnaah @curra77 @mayvisnat @changing_time @mariolabm @littlezoe201 @carrotlover_1d @talia_____x3 @sindotocor92 @andiqnurshazryanna @greeciaa2 @spotunelter90 @hussein50011 @djgermain507 @matt_u1 @shudz64 @sofia_skier @jeanett @benjamin_goldberg @joshuaaa5 @fanetski @themixxedone @iam_tobi @alphalbws @alphalbws @mslms @docklanders @kira_350lanier @mspriss1090 @mochirini @kidatheart_ @kengista23 @djjoecrunk @annandlies @strawb44 @bonny_95 @ashlee__nicole @hipstarrbarbie @im0verboard @ashlee__nicole @ibbys_lastqueen @ashlee__nicole @ashlee__nicole @ashlee__nicole @ashlee__nicole @wetgriptape @issataliotis @oink_emily @bujhmjr @sarahmu0 @sumpura @roladicka @mangkimoo @brennabeever @seendeelee @jstoffy @jstoffy @jstoffy @jstoffy @jstoffy @jstoffy @ilikeascotts @jstoffy @jstoffy @shan_sutherland @i_and_thou @lalitaamalia @nellmonicaong @karenkaychee @drordavidcohen @imfaria @chloeloveall @kofdonamic87 @giuseppegaudino98 @giuseppegaudino98 @zunxd @oursenfurie @samoo101 @christilinnn @krissyalissa98 @quaisyy @mtrute @ttremonte @hellotessa @daniellesandbach @breepaige @speedykevonoandluisa05142012 @staciiix3 @mbwestt @uniquevibez @will_campbel @love_chaos17 @itslaneybitch @georgeeblancoo @spectakohler @sweettreats_123 @andhvargas @amyluvsdwind @akihiro25 @sydneeisaawesomedork @jesslees_87 @nicholas_badkid @tanxuanlin @juliavorontsova @mrro_amb @__skyman__ @__skyman__ @__skyman__ @__skyman__ @__skyman__ @laurenkerr_ @edo_l @adanilovsky @balenstein @tiffanycore @mixingdirectioner @impatt__ @lola_estefania @underpressure_debora @annettam85 @_j_ashby @lillaans @meeecheeeko @pomza28 @christinewhitem @caleb4everything @ziziterrorist @karinapatzer @kathlovesdanny @crissborgess @ravneetpannu @lihsalem @larissacrossman @chibachi0606 @chochossa @mitchleepro @muripande78 @finecubancigar @andygomezl_27 @orbeco @natashaamani @fatmah_ebrahim @pianoeuphoria @sharonyjx @yoggy94 @mmmmbah @marcusywq @b_str8lkdat @pawsandroses @wingsandstrings @avissos @gracesimmua @azathothsneakers @apyaaang @smokeyprophet @mikeconn91 @naomiann13 @jemmaleejones @lizziestelly @agus_garciaa @james_myogi_lee @afrooomat @sammyandzoey @snowyyear13 @gosselinik @pahtrisha @yoyomitch @cesar_salad23 @envytheirgreed @glazunja @insanepuppy @mephistofales @jennroe @vab1961 @emilythornton_ @thugnasttty @jenniferbeilouni @inf4life @sweetsfromd @alexanderkaraas @mchades @rubeng619sd @passscoe @burgerweekly @therealshelbster @heypegasus @thedeadqueen @trulybless3d @ruisi29 @yaaaaaam @itsshannonyeow @thamiresnovaes_ @thesuicide @meesakanishi @rforrachelang @silvellomarina @vanilla_baby @mitchleepro @muripande78 @finecubancigar @andygomezl_27 @orbeco @natashaamani @fatmah_ebrahim @pianoeuphoria @swervin24 @hpz810202 @foodmakesmehappy @ajengfebriannix @sunnymichel @rothie_dottie @big_q_numero_uno @endharpupul @_briiiannon_denay @nalusouza @peekeeko @brandonvedder @sarah_smyle @pwalsh_323 @jeaniesalmeron @ashc90 @karlamendozam @elizabethlea07 @mestroh @cbbell007

4 Comments

  1. Paolo says:

    Hi,
    I’m very interested to understand how interact with instagram using processing and your code are a good starting point. Can you share it with me.
    Thanks a lot Paolo

  2. Bryan says:

    Hi,

    This is some pretty cool stuff. I was trying to use the processing-http library, but wasn’t able to add it to my processing IDE. How do you do it with java sources? Or is there another way to include that library in a Processing Sketch?

Sorry, the comment form is closed at this time.

thumb_sorting

Sorting Norway

Another pixel sorting experiment, visit this post for similar sketches
Details »

thumb_instableed

Instableed

This sketch is based on Kim Asendorf‘s pixel sorting algorithm. Photos are loaded from Instagram based on a set of hashtags, music is just an MP3 played through minim (Processing library) and the rest is generated in realtime by the program, in a similar way than this post. Scroll down for a bunch of content…

Details »

thumb_slit_scan

Slit Scanning

Some test made with a processing sketch by Amnon Owed

Details »

thumb_ltdo

Let The Dog Out – Instagram Mosh!

Here’s a new processing experiment, my first try to make a messy dirty rendering, it was very relaxing and fun to program since the only thing you want to do is fuck things up as much as possible!! The original inspiration come from that post

Details »

thumb_jungle_book_310

Jungle Book Puppets (Kinect Skeleton Tracking)

A bit of a different post here. My daughter really likes the jungle book and especially the dance scene in the temple ( http://youtu.be/O3Le7yqCOSY ) so I wanted to make a test and try to control a puppet with the Kinect so that she could eventually dance with Mowgli or Baloo or something when she’ll walk at some point.

Details »

thumb_particles_type04

Particles Typography (3D Version)

A 3D version of the particle typography sketch.

Details »

thumb_particles_type01

Particles Typography

Small program done in processing to generate text out of particles. Real time text input and different options to change physics, images, fonts, etc, etc…
The libraries used are Traer Particles + Geomerative

Details »

thumb_kinect_scary

Scary Kinect

Another messy experiment done with processing and Kinect in OpenGL.
Details »

thumb_funkynect_vs_darknect

Funky, Darky, Nect

This is my first attempt to play with openGL and Kinect data. The result is rather wild and intriguing… This sketch by itself is kind of pointless but opens some interesting doors for later; The GLGraphics library by Andres Colubri work wonderfully well and it really multiplies the possibilities of Processing. I will definitely dig deeper and try to make something a bit more “clean” with it :-) For example integrating different materials, play with different 3D shapes (spheres, proper quad_stripes and triangle_stripes, triangles mesh, etc…). make the shape / colors responsive to music / movements, improve the behavior of the 3D shapes, etc, etc… The result of the lighting is very interesting as well.

Details »

thumb_touchOSC

iPad Grid Led display (OSC)

I’ve been playing around a bit with touchOSC and processing and tried to build a small led grid display on the iPad. The program is communicating with touchOSC on the iPad through oscP5 library: Processing is loading the image displayed on the screen, extract the greyscale values for each pixel and send it to the iPad, nothing very challenging. The only issue was that touchOSC is “loosing” a lot of messages when receiving, and the bundle system is not working very well. It is clearly more useful and reliable to use touchOSC as a controller to send message (to control processing variables) than to try to receive a big amount of messages with it.

Details »

thumb_sag

Sagmeisterizer

A little sketch in reference to this project by Stefan Sagmeister. I tried to make a program that generate something similar. I originally wanted to make it run in real time (i.e: you type a letter and it appears on the screen instantly) but to achieve a result close to the original work of Stefan Sagmeister, each letter have to be scaled and smoothed to make them more round; The smoothing part is quite CPU intensive (see explanations below). I made a few experiments based on that sketch afterward where it was not a problem at all to render everything in real time (check them here) but for that one it’s a bit of a b****.

Details »

thumb_video_effect_01

Video Effect – Movie

This program is also running some effects on a video stream, in this particular case it’s a video playing but it can also be the webcam feed (see this post)

Like the other post the program divides the image in pixel grids then each pixel have parameters that can be controlled (scaling, x y position of each corner of the polygon, fading speed, filled / outlined, etc…)

Details »

thumb_webcam_effect_02

Video Effect – Webcam

Alright so this program is running some effects on a video stream, in this particular case it’s the webcam feed but it can also be a video playing (see this post)

It doesn’t do anything complicated: dividing the image in pixel grids then each pixel have parameters that can be controlled (scaling, x y position of each corner of the polygon, fading speed, filled / outlined, etc…) basically a sum of effects put together make pretty tripping and unexpected results, as it’s often the case while playing with Processing. I plan to dig deeper on that one as well, an interesting effect to explore is to have each “pixel” or rather each polygon, act as intelligent agents with some rules and behaviors, on that particular sketch the only rule they follow is to go in one of 8 directions, but we can do much more interesting things than that. We could also play with gradients, alpha, and overlay effects, etc, etc… endless ;-)

Details »

thumb_text_exp_07

Type Experiments

Some experiments related to the Sagmeisterizer (see this post)

The text typed on the keyboard is converted in polygons (with Geomerative lib.) then we use the coordinate of each point of the polygon to update the vertices of a GLModel (GLGraphics lib.) that we then copy and scale along the z axis. Add a bit of random and stuff and here you go… There is a lot more to do with this sketch (as usual) I should parametrize some variables so that they can be altered in realtime with the keyboard or the mouse, play more with colors, etc, etc… But as the title state this is just an experiment! :-P

Details »

thumb_kinect_02

Kinect Sound Visualizer

A first version of a visualizer for the Kinect that react to the sound. It generates, lines, stripes, dots, 3D shapes (spheres, cubes) etc… Some parameters of the shapes vary according to the music.

Details »

thumb_kinect_01

Kinect Tracking

Here’s a basic sketch to experiment with 3D tracking with Kinect and Processing.

Nothing complicated: once the user is calibrated the camera is focusing on him and switching focus point every 5 seconds. Focus points can be any joints of the 3D skeleton (head, torso, hips, hand, etc…). After each change of focus the camera then makes a random motion (dolly, pan, zoom, etc…). If the user is detected but not calibrated the camera focuses on the user’s center of mass, if the user is neither detected nor calibrated then the camera focuses few meters away in front of the Kinect.

Details »

thumb_3D

3D (very) simple test

Just a simple test to compare the performances of native 3D render and Andres Colubri GLGraphics library.

The program displays 500 ‘shaking’ spheres with 3 different light types:

  • Directional
  • Point-light
  • Spot-light

Point-light and Spot-light are following mouseX and Y.

Details »