Lyon, France
member since February 20, 2011
profile picture

portfolio of

Twk: p5.js in openprocessing

helping @Javier Graciá Carpio for playing with p5.js on openProcessing ;)

Music Makes You Travel

Calligraphic landscapes generated through audio ananlysis using FFT in WebAudio API (Chrome only).

Music chosen randomly among 50 most recents uploads to Free Music Archive ( ) via their API ( ).

EDIT: Due to changes on FMA API, musics are no longer accessible, the music is now loaded from a song uploaded with another sketch on openprocessing.

ProcessingJS & ColourLovers API

A little example on how to add nice colors to your ProcessingJS sketches using ColourLovers API

HTML5 Web Audio API with ProcesssingJS

Now working on Chrome and Firefox.
And only the Audio API part is commented.

Read this article for more information about Audio API use:

Music: Fatbros by Hifana

Transparent canvas

Another small tip showing how to have a transparent canvas using HTML5 canvas API.
-> externals.context.clearRect(0,0,width,height);

Including a snippet method for easing animation.

Using camera with processing.js

The sketch creates a <video> element, then uses GetUserMedia Api to access camera inside browser.
Tested with Chrome20+

Using canvas API shadows inside

You can easily add custom drop shadows in Processing.JS via the HTML5 canvas API, you’ll need to access it via externals.context from your Processing.JS script:
externals.context.shadowOffsetX = 3;
externals.context.shadowOffsetY = 3;
externals.context.shadowBlur = 4;
externals.context.shadowColor = "black";
You can also access to gradient, radial gradient, clipping region and more this way.
followed by


Share Share Subscribe to sketches