Developing Tilt Experiences

It is time to try mobile, but more specifically for devices with tilt sensors. Of course the first device that comes to everyone’s mind is iPhone, right? Developing and testing for iPhone if you are not an experienced developer or even if you don’t even know Objective C is not anymore a problem. Tilt Emulator makes easier build and test applications that use tilt interaction. It is actually the visual interface of the library Flash Penguin of Flash Feathers.

The idea is simple, it uses an XML file to communicate between the emulator and the application. The XML file is updated with the information the emulator gets from the user as he interacts with the interface. Then, you can use this information inside your application. The emulator uses two different views (front and top), it has translation, rotation; there are a lot of possibilities to develop new and interesting applications. I looked on the Internet for applications, libraries, APIs and emulators and there is nothing like this; at least not that I could found.

You can go to http://penguinsflash.wordpress.com to learn more about it. It is really easy to use it.

I used Tilt Emulator to develop a small and simple game in Flash. Take a look at what I did using Flash Penguin:

Tilt Morphs is a game where you control the little morphing character using the Tilt Emulator. This small character morphs and change color constantly. The goal of the game is to touch the color spots that move around to prevent the time to run out. Each time you get to touch the right spot you get two more seconds of life. Have fun!

Sound Synchronized Animation in Flash

If you like music and programming you will probably like this. WoodpeckerFlash is an open source library that lets you synchronize your animations with music, with any sound actually. The first thing that came to my mind when thinking of this concept is Windows Media Player and its Visualizations that animate at the rhythm of the songs. But this is much more than that, it has a huge potential. You can use MovieClips have animation inside or add synchronized music to enrich your interactive applications.

To download the package go to http://woodpeckerflash.wordpress.com. This is a video that shows how Woodpecker works:

I found some interesting examples of sound spectrum with AS3:

• AS3 Music Visualisation from Justin Windle on Vimeo.
• Flash Sound Spectrum Experiment from Jerome Maurey-Delaunay on Vimeo.
• Flash 3D Sound Spectrum Display from Jerome Maurey-Delaunay on Vimeo.
• Experimental Interactive Animation (Demo) from Jie Yun Roe on Vimeo.

I had a good time playing with this code, I came with a small and simple example of an animation using this package. I used the music to animate the lights of the stage and to move the character a little bit. The music is from Alex Syntek, a Mexican musician.

Multiuser experience… Magvatar

Now is time to stop playing alone and invite someone else to come by and play. It has been an interesting experience to think in terms of a multiuser experience and not just about one user interacting with the application. It is like a chatting experience, you have a room where users enter and communicate among them. In this case is a little bit different, I wanted the users to interact somehow using an avatar instead of using words. In order to do this I used Robin, it is a Flash/PHP Multiuser Solution that enables you to create a client-server application. The good thing of this open source library is that you don’t need to worry about the server, you just send and receive information through the Robin class. You can find detailed information and some good examples of how to use it in .

I end up creating a “Magvatar”, an avatar with magnet arms. The idea is that each user that enters the application can interact with others just dragging his magvatar near other to either snap or repel depending on the position of magnets’ poles of the arms. The This is can look like a very simple application but I had some hard time trying to make work correctly the interaction between the magvatars. Take look at it:

You need to be very careful when you design the interaction for the users inside your application and even more careful when you code it. You can have performance issues if you send more data to the server than the strictly needed; because you would have to refresh your application a lot and end consuming too many resources from your computer and the server.

Here are some interesting samples related to this topic:

• Multiuser-multitouch-brainstorming
• Multiuser and Multitouch Concept Map on Tangent
• Multi-user interaction on large screens

Multitouch… why have one if you can have many

When using your computer you only get one cursor to work with, there is no way to use a multitouch application just with one cursor. The other option that you have is to buy an expensive multitouch screen or surface. Continuing with Flash Feathers, now is time to experiment with Goose. With Goose you can emulate a multitouch enviroment without needing any extra hardware or accesory. This interface lets you create and test multitouch applications just using Flash and a Web browser.

It is a little bit more complex to set than Ostrich, but it is worth it. You can find detailed information and the steps you need to follow to make it work in http://gooseflash.wordpress.com/.

I also had the opportunity to use Robin, it is also part of Flash Feathers. It is an open source Flash PHP multiuser system. It lets you connect from different computers to the host that is running the multitouch application. For more information you can go to http://robinflash.wordpress.com/.

I found this interesting links related to multitouch, if you have time give them a look:

• http://gestureworks.com/
• http://monolithtouch.co.uk/default.aspx
• http://sethsandler.com/audiotouch/
• http://www.multigesture.net/projects/sc08/Photos.html

This time I stayed on Earth and did something more related to nature. Using Goose I programmed an application that lets you resize an image that initialy is just a flower bud and as you enlarge it using two multitouch cursors it blooms. Just like when you use an iPhone to zoom in an image or web page. Here are some images:

Galaxy Surfer powered by Ostrich Flash

Introduction

Ostrich is the seventh in a series of advanced interface open source solutions, Flash Feathers, developed by inventor Dan Zen. Ostrich is a set of open source Adobe Flash classes that lets designers and developers easily capture Web cam motion.

It is really easy to understand and use. Once you have the main idea of how it works you can use it to create applications, games and I guess almost any crazy idea that involves webcam motion.

To download it or for more information on how to use it please refer to:

Ostrich Flash – http://ostrichflash.wordpress.com/
Flash Feathers – http://flashfeathers.wordpress.com/

Other Examples of Webcam Motion Capture:

• http://blog.soulwire.co.uk/flash/actionscript-3/webcam-motion-detection-tracking/
• http://incomplet.gskinner.com/index2.html#camwriter
• http://incomplet.gskinner.com/index2.html#camwriter2

Inspiration and development

After a couple of days and a bunch of really bad or too complex ideas, I finally figured out an interesting idea to use Ostrich Flash classes. Inspired in a YouTube video of a Japanese guy who used Wii sensors to create like a virtual view of outer space, I thought why not?

Many hours of hard work gave as result Galaxy Surfer. The objective of this application is reproduce the effect of approach and distance using the webcam motion captured by Ostrich Flash classes. It was a pleasant experience work incorporating this open source libraries in this small project and may I say the outcome is really good.

 

The start…

Hello everyone, welcome to my first blog!

This is a space in which I want to share with you my ideas, discoveries, hobbies and all kind of life experiences. Those who came here by own decision… good choice. Those who did it by accident… I hope you like it.

El inicio…

¡Hola a todos, bienvenidos a mi primer blog!

Este es un espacio en el que quiero compartir con ustedes mis idea, descubrimientos, pasatiempos y todo tipo de experiencias de vida. Los que llegaron aquí por decisión propia… buena elección. Los que lo hicieron por azares del destino… Espero que les agrade.