Play - An Interactive Drawing Game

I just finished this interactive drawing + exploration game that I programmed in Processing as an announcement for my place of employment, Sussman/Prejza, an environmental design company the does urban branding and wayfinding.

We sent out an email with several arrows to choose from, each of which leads to a slightly different version of the game. The game is meant to encourage us all to try new things, explore, and see the wonderful and beautiful results that can come from just a few steps into a world of creativity and new possibilities.

As you navigate this space with your arrow avatar of choice, you reveal hidden colors and create new shapes based on how you touch the different forms. Some simple decisions, like how far you will move your arrow or if your first move was to the left or to the right, determine major shifts of color.

Then, when you decide you are finished exploring, you can see the entire landscape you have explored and the results of your interactions. Each visitor is encouraged to sign their drawing and add it to a gallery of similar but unique works. I hope that it is just as interesting to see what was made as who made it.

The programming for this game was quite a learning experience, building on a class I took at Machine Project in LA and a number of simple Arduino projects I have completed in my free time. The largest hurdles were the trigonometry needed to complete the spinning and collision detection and the image uploading for saving images to our gallery. Thanks to the other Processing users who helped me in tackling the image uploading, you are also recognized in the source code!

I hope to build on this experience to create more projects for the web, mobile devices, and architectural spaces. I hope you play the game and I look forward to seeing even more additions to the image gallery.

PixelPusher - New Project Idea

I've been thinking a little bit about ways of visualizing images that are different from the rectangular pixels I usually see. I've built a Processing sketch that changes the rectangles into other shapes, and that's nice. The individual elements don't need to be on a rectangular grid, but could be hexagonal or triangular, or other tessellating shapes.
I also really like the motion of physics simulations in Processing, and I thought maybe an image could be made by repelling and attracting pixels that settle into irregular patterns but communicate gradations none the less. I learned to do this in illustration school when it was called stippling.

Without any work in code yet, I've mocked up what this might look like. It's only black and white so far, but color could be added (either RGB or CMYK or something else).



Pixel Field: Evenly spaced pixels waiting for a source image


Source Image: Pixels repelled and attracted by the dark and light areas of the photo

A related Processing sketch here

Airplane Shadows _ Mockup 1

Airplane Shadows _ Mockup 1, originally uploaded by mdshaub.

A quick mockup of a project idea. I love the flight patterns project from years past, and have always wanted to build something similar. Seeing a number of airplane shadows pass over my office gave me this idea. I hope to build an airplane shadow map using flight position, altitude, heading, and aircraft type coupled with calculations for sun angles.

The scale and speed should be pretty accurate, 100 foot long plane traveling at 570 mph (about 830 feet per sec). That's pretty fast, viewing at this scale.

Putting the results into Google Maps would be step 1, though I'd love that in Google Earth you'd see the shadows rolling over hills.