November 26, 2011
Back home from the Wisconsin trip, and time to put the kids to work. “Here’s Photoshop. Please make me a spaceship…”
This is a very simple implementation of a layered sprite system. It has a GenericSprite object, and a use-specific ship object that augments the GenericSprite with a move function. The result is that bangs move the ship back-and-forth among some trees, properly layered within the other sprites.
Nothing too mgraphics-specific here, but useful for seeing how to perform some basic sprite-like operations within the JSUI/MGraphics system.
November 27, 2011
Just like working with path and image drawing, you can also transform the user space for pattern creation. Rather than stretching this out over several examples, I just created a simple “Pattern Transform Explorer” for you to see how each of the functions works with a simple linear pattern creation.
November 28, 2011
Sometimes it is more convenient to do your drawing with another program, then use JSUI to do the display. The problem is that scaling can get to be sort of grainy. Not the case if you use the SVG file format for the drawing – and use the svg_render() function to render it into the current user space.
This patch includes a little SVG I created in Illustrator; I use it within JSUI to create a cool little animation with almost no code.
November 29, 2011
Using the transform(), translate(), rotate() and scale() functions give us the ability to do some complex graphical drawing that would otherwise require altogether too much math to consider. In this one, we use these function to create a tilted three-planet orbit display on a pretty blue background.
Oh, and we also pipe the output to a Jitter matrix! In order to do this, we use the push_group() and pop_group() functions to create a working area for the drawing, produce an image from the result, then display the output in both the JSUI drawing area and output it as a matrix. The translation (from mgraphics to Jitter matrix) isn’t perfect, but it gives us the ability to do a lot with the result.
November 30, 2011
Alas, we hit the end of the road. In this ditty, we do a bit of javascript coding to perform a word-wrap on my heartfelt goodbye. Change the font or the font size and the text should wrap accordingly. This uses the text_measure() function to get the width of a string, then back-pedal if we’ve gone too far.
Not the most elegant wordwrap function ever written, but you get the idea.
I hope you’ve enjoyed the series, and find the mgraphics system to your liking!
Awesome! Thanks guys, this is a wonderful month!
Fantastic. I hope this turns into an ongoing monthly series.
[...] then place the body within movie poster(s). I’m looking forward to playing with the new MGraphics system for that. Share:FacebookTwitterEmail « Honours Studio 2 – Week [...]
[...] then place the body within movie poster(s). I’m looking forward to playing with the new MGraphics system for that. Tagged with: cv.jit • Kinect • MaxMSP • movie [...]
[...] made with a javascript + MGraphics code designed by Darwin Grosse and provided the 02 / 11 / 12 here) I altered it a bit in order to follow the requirements of the video generator (framework, I could [...]
Leave a Reply
DISCUSSION
6 Comments