My original idea was to use the GPS and compass functionality of the iPhone to direct one’s feet in the direction of the nearest space of play, but after considering the strengths of my partner James DeMond we decided a Javascript app would make for a nice cross-platform functionality on all browsers and smartphones so more people could use it.

I was inspired by the pastoral landscapes painted in the old days to convey lands of plenty and whilst Beethoven’s 6th Symphony played, I made the first design.

The color field at the top of the screen allowed a view to the underlying Google map while the bottom was solidly grounded to hold the porthole window. After I got the gist of what I wanted to portray down, I added icons specific to the season that would show on the underlying map as good suggestions of things to do.

After fooling around with the Google Maps API, James pronounced the circular porthole design dead as apparently when dealing with image overlays even transparent areas are treated as part of the image and that doesn’t allow you to interact with the map underneath. Square and rectangle windows cool, circle windows, not.

I hated it. I really wanted the wondrous magic of looking through a porthole to another world that a circular frame would provide so I tweaked the design a bit more.

And a bit more…

And a bit more. I used small floating dots to create a kind of effervescent effect to play with the viewer’s depth perception and recreate a little bit of the magic you experience in a field of fireflies at dusk, which also could be read as softly falling snow for the whimsy to span multiple seasons. I also added the call of Go / Allez so that once you discovered where you were and what was good to do, you’d… go do it.

After James had it up and working I realized that though the color field was sky-like on my screen, on a larger monitor or screen size the effect would be lost and it would look like just another rectangle. Keeping with the idea of discovery, I changed the color overlay to read like you had set down your glass on a table and were looking through the bottom of it into something extraordinary.

The effect was hard to pull off so I blurred it up a bit so it seemed to read like a foggy window and added more glowing bits.

Which worked well until we discovered that there wasn’t data available for some of the things in each season or there was a lot more data sets available for individual seasons, so 2 suggested activities turned into 8 and I needed to redesign the content keeping this in mind. I discovered how to make the square that I was bounded by disappear with the way I erased and cut up the pieces of the image for the page. On the advice of a friend I went back to a cleaner more defined look to the elements and realized I was still holding on to parts of the design that no longer made sense to be present. I moved the rotation of the seasons out of the porthole and made them more in tune with how one would think of the earth orbiting the sun to give the information more of a grounding in reality. In order to advance through the seasons and see all pages you need to click the sun and it will only go around in a circle, pausing to load the data for each season as one would go through a year; winter, spring, summer and autumn.

When building web pages and apps it’s easy to forget the concept of time and nature. Why would one go to the trouble of incorporating asymmetrical shapes or buttons that take you through a journey in time when it’s so much more useful and utilitarian to stick to squares? The simple answer is because it reminds us of our humanity. We contribute daily to our collective wisdom through the web and the windows that we use to interact with and add to it need to reflect more than bits and bytes in order for us to remember how organic and experiential the world is. It’s a harder road to design upon but in the end it will help to preserve the random complexity of life.

You can experience the application for yourself here.

Over this past weekend 40 makers and a handful of volunteers gathered together in the nation’s capital, laden with gadgets and moded parts, cloth and paper, Arduino boards and LEDs, and brought the first Maker Faire to Canada.  The makers came from all over Canada and the U.S.- some as far as 8 hours away to participate in the faire.

For some context, a Maker Faire is an event created by Make Magazine to “celebrate arts, crafts, engineering, science projects, and the Do-It-Yourself (DIY) mindset” and has been held in various locations in the U.S. since 2006. The Ottawa Maker Faire was part of the Electric Fields Festival hosted by Artengine; a non-profit, artist-run center that provides community resources to foster democratic and innovative approaches to electronic art and media.

Our event drew over 500 attendees over the course of the weekend and kept the makers on their feet answering questions and explaining their work. From delicate papercraft to hardy aquatic robotics, the projects ran the gamut of inventive and playful exploration into the workings of things. As varied as the projects and people are, it is the underlying threads of idea sharing and collaborative doing within these makers that unites and bonds them together; a drive that continually renews itself by friendly competition and the satisfaction of creation.

As catchy as it is to say DIY, these projects are not sole endeavors. Without the opportunity to share ideas, support of the community or resources to create, many of these wonderful innovations would not see the light of day. From the age of disillusionment from planned product obsolescence to the age of enlightenment from empowered ownership of all processes it is apparent that we cannot help but seek to make a difference in everything that surrounds us and define the world through our things. This holds true for what rests on the web- it’s ephemeral nature requires a different perspective of the creation space but it is no less valuable to the continuation of our collective wisdom and joy.

With this said, how do you promote a culture of making? By the seat of your pants I say! For innovation to take place, events and spaces need be but constructed conduits of basic needs. A well-outfitted lab of the newest equipment and tools is great for a focused approach, but to further along the propagation and mutation of different perspectives and fields, a broader community needs to be tapped. This means doing some digging and widening the array of programs and offerings with an eye for what catches hold and what doesn’t, and having the flexibility to adapt to the particular needs of the group being fostered. It also means having an early eye trained on people who become pilars of support and beacons of encouragement for the rest and relinquishing control so that the structure can stand easily with the loss or gain of more.

Our Maker Faire was a group effort and it’s success was due to the ideal collaboration between many different communities of people. Future makers take heart in the joy it brings and solace in the meaning of what has collectively become our own.

Step 1

Assemble as many acorns, LEDs and batteries as you see fit. Separate the acorn tops from the bottoms and choose a bottom that is slightly soft. You’ll also want to have handy a pair of scissors, electrical tape, wire, wire strippers and Elmer’s glue.

Step 2

With the sharp end of the scissors clean the acorn of it’s insides by scraping out the meat with circular scrapes. If your acorn is fresh it will be a little tough to do this, but once you have the majority out you can scrape designs into the wall of the acorn without worrying it will break under pressure.

Step 3

Thread the ends of the LED into the crack at the top of the cap, or make two tiny holes to push the wires through, making sure that the wires are not touching each other. If they touch it won’t light properly.

Step 4

Test the LED light by inserting a 3v coin cell battery between the positive and negative ends. Match the + side of the battery with the longer wire of the LED.

Step 5

Strip the wire of it’s plastic coating with the wire strippers or use wire that does not have a protective coating on it. Wrap the wire around each end of the LED and flatten the end of the wire to look like feet.

Step 6

Wrap the feet of the wire onto the top and bottom of the battery and cover it in electrical tape when the LED alights- you may have to reverse the feet to make sure the battery is matched on the correct positive and negative sides of the LED.

Step 7

Apply Elmer’s glue to the top of the hollowed out acorn shell and hold it to the top of the acorn in place for 30 seconds. After you release you’ll want to keep the pressure off it for a while to let the glue dry completely.

Step 8

Success! The LED lantern will shine non-stop for about 7 days. You can remove the tape or replace the battery at any time.

Over this past weekend hoards of thinkers, makers and doers descended on the gorgeous Xanadu of the O’Reilly Media headquarters in Sebastopol, CA. Invited by Tim O’Reilly to participate in a free-form weekend of focused and unfocused conversations and talks concerning current and emerging ventures in technology, it was a nerd’s paradise. There were talks on Cloud Robotics, The Slow Technology Movement, How to Get a Billion Views on Youtube and Better HTML5 Apps. One participant brought Nao, a $14,000 autonomous, programmable humanoid robot made by Aldebaran Robotics. It danced and entertained us with it’s version of MJ’s “Thriller”:

The Makershed was open for soldering blinking LED pins for our name tags and I took mine a step further by crafting an origami brooch around the light. I used a star box for the base and a modified balloon fold for the covering. After I folded the star box I marked the corners and unfolded it to draw the designs on the arms of the star with pen and ink:

Then encased the light inside the paper structure:

And cut the balloon to hollow out the middle and cover the light:

All in all the project took about an hour to make, and the light from the LED had a stunning effect on the paper folds at night. I met many amazing people at Foo and there wasn’t one person there that didn’t inspire me to keep the bar raised high and continue thinking, making and doing wonderful things. It’s important to have these resources and events for people to coalesce around and understand and appreciate the different perspectives and needs of each other. By meeting face to face it’s honestly the only way that we can gain enough perspective to broaden and deepen the impact of technology in relevant ways for it to contribute to the success and enlightenment of our people. Thank you again Tim and Sara and the whole O’Reilly team- you hosted an awesome event!

I chose to create my sprites in pixel art style, and let me tell you it is an under-appreciated art style; pixelating Björk consisted of me defining and implementing a color strategy that took about half an hour for the small span of 12 x 12 pixels! Maybe I was too much a perfectionist about it, but I don’t think so.

Here you can see Björk in her normal and death states. I gleaned a lot of inspiration from her Homogenic album, which I thought captured her at her most iconic. After that I asked the other game-makers at the jam what came to mind when they thought of Iceland. Having recently been in the news for the massive volcanic eruption of Eyjafjallajökull, we were able to come up with a slew of stereotypical Iceland things.

Vikings, hot springs and a bankrupted coin sprite were made. Next I set about defining the minions of the hideous world-crushing creature from H.P. Lovecraft’s “The Call of Cthulhu”.

As well as the Big Boss Cthulhu of the final fight scene.

Note that in their death states, the people turn into angry-eyed zombies and the creatures turn into peaceful-eyed angels. I am not sure why. The Akihabara game engine consists of a main HTML doc of less than 1,000 lines of code that calls 7 relatively small Javascript files and 9 PNG images. My image files ended up being 737kb, and the code files were 151kb, so the entire game was under 1MB! I could fit it on a floppy disk if I so chose! All this able to be run inside any browser capable of supporting HTML5. Really really cool.

After swapping in the sprite sheet and backgrounds I created some witty banter between Björk and Cthulhu, using actual quotes from Björk and her songs. Björk says “I am a fountain of blood. In the shape of a girl.” and Cthulhu says:

And it continues. Cthulhu sics his minions on Björk, she blasts them with fire pellets, and the battles take place over the landscape of Iceland.

Land of both fire…and…ice.

After Björk makes mincemeat out of these gremlin minions and evil vikings, she parlays with the Big Boss.

Her response to this is “All is full of love.” Well said Björk! Now, while I was working with this code I noticed that you could win the game if you just stayed in the position where you were from the beginning and mashed the z button really hard for the whole game. If you aren’t distracted by the Power Up bankrupt coins falling from the sky, you can get through the minions and have 3 Björk lives killed by the Big Boss and still defeat him in the end.

I have to give huge kudos to Kesiev- I’m not a traditional programmer and I know only bits and pieces of HTML and Javascript, but I was able to figure out what I needed to comment out from his code and what I needed to change in order for the game to be up and running pretty quickly. The only thing that’s missing is the audio, but that should be easy to implement in later releases of the code.

Start to finish this game took me 12 hours to make. The thing that has been most trying is working within WordPress to host the game files in order to display correctly. That is the nice thing about making something like this in HTML5- being able to open it in any browser and play. I haven’t figured this out yet, so I’ve embedded a video of the game from start to finish (it’s 3 minutes long) with me filling in some sound effects and dialogue.

UPDATE: Thanks to my friend Eric Ferraiuolo the game is now playable for all! Can YOU help Bjork defeat Cthulhu? (The “A” Button is the “Z” Button and move with the arrow keys.)  Link!

Over this past week my partners and I at DINO Interactive Studios have developed an iPad application that allows input from a specific grouping of ‘fingers’ from the bottom of three objects. When you place the object on the screen surface of the iPad, flowers and vines grow from underneath the object.

This corresponds to the application as it is a flower growing app called Akina HD, available for free in a human-touch enabled version in the Apple App Store currently. My process in creating this was to take the aesthetic of the app and bring these elements into the objects as if they were an extension of game. The art I made for Akina is derived partly from the art of an interactive book I’m currently working on and plan to release on the iPad soon.

We had a pretty lively crowd with luckily enough string cheese and Oreos to go around. There was some LOLing with Pong on an Arduino made by Jimmie Rodgers.

An awesome Tic-Tac-Toe game made out of wood by Schuyler Towne that will have locks to pick in each turn in order to place an X or O on the board.

I made Giant Snail Take Over- a papercraft game from a Mountain Dew box and some animals and town scenes I found online as well as some motorized props. The gameplay was recorded into a stop-motion papercraft spaghetti western movie on Youtube.

Darius Kazemi reworked his turn-based strategy game and posted a movie to Youtube.

Michael Carriere and K. Adam White collaborated on a game affectionately called RAAJOCBDFOTLSOTS made in Flixel, in which you run around and jump on cars but try not to fall off the left side of the screen!

Darren Torpey demoed an early-stage game he is going to bring into Facebook to log emotions and experiences and David Ludwig demoed his Ball Game, a puzzle based game made for the iPhone that uses the accelerometer feature for a ball to reach it’s target as well as his Falling Stuff screensaver he made in Box2D.

Last but not least Fahreddın Basegmez, one of the makers of Mekanimo- a free 2D physics simulator, and his son Dennis created Cows In Space.

All in all a very productive weekend!

This weekend DINO hosted a game jam and interactive project creation session that spanned both Saturday and Sunday. Typically the purpose of a game jam is for teams or lone creators to make a working project in either 24 or 48 hours. Sometimes there is a theme or things that you must incorporate into the piece you make.

Our jam was a bit more casual so I, not really knowing how to code, made a scene out of paper incorporating some creations from Cannon and Yamaha online papercraft communities. I made a short film of me playing with it stop-motion spaghetti western style with music from The Left Handed Gunfighter. I drank the give up beer after with relish.

This epic saga details the attempts of a lone defender of a town ransacked by giant snails. Will the townsfolk perish or will a savior come to the rescue? Watch and see.

And in RIP My Love, pressing your fingers against the gravestone makes the ghost’s eyes light up with electric anger:

I’d like to explore this further and build an interactive childrens book around simple switches, buzzers and lights embedded in the art of the piece. So many wonderful projects to explore! So little time!

This weekend I took part in Music Hack Day at the Microsoft Startup Labs in Cambridge and built an audio/visual mashup of a few different libraries from Processing and music from the EchoNest.  My boyfriend James helped a lot with the coding and though he had not created anything in Processing before, his knowledge of Java made it a cinch.

The visual loads the lyrics of the song and makes repeating words larger. The title and chorus words of the song throb to the beat of the music while turning red.  The one we did was a demo but it could be modified to any song and have it be an interesting way to take in the artist’s message as well as listening to the melody.  Oh yeah and we won an iPod Nano for it! Pretty good weekend all around.

Here’s an image taken from the visual and a link to the applet.