
A snippet of code from FriiSpray
FriiSpray relies on two pieces of software. The first is Johnny Chung Lee’s Wiimote Whiteboard software that links the WiiMote to the computer and the second is a very simple painting application that I created.
The application needed to allow the user to paint on the screen with various colours, use several brushes and be able to save the pictures created. It’s hardly photoshop, but it’ll meet the needs for this project and we can always add new functionality later.
I decided to use Adobe AIR and Flash to create the program because it would be quick to develop and work on Windows and Mac. Flash has a nice collection of drawing functions that made the initial development very straight forward.
Creating different brushes was more difficult. Flash’s graphical library is based mainly around drawing lines. I’ve currently made different brushes by combining groups of lines with different widths, opacity and position offsets to create spray and caligraphy brushes. The affect is pretty good, but not perfect. I think if I want to improve it, I will have to do something smarter with bitmaps. Although, any other ideas would be welcome.
Saving the pictures was made very easy by using the ActionScript 3 Core Library. There’s a function for turning the screen’s content to a PNG, and then you’re pretty much done. There’s also a function for creating JPEGs, but this was much slower.
In the future I’d like to add a feature to automatically upload the pictures to an Internet gallery as soon as they were saved. We’ve also talked about making it so two people in different places can work on the same graffiti painting via the Internet. If I had a lot more time to play with this I’d like to make it so that more than one spray can could be used at once, but I think that would involve a lot more work.
Installing the software
FriiSpray is an OpenSource piece of software. It’s free to download, but you need to install some other stuff first. FriiSpray is licenced under GPL, with the extra conditions that you must attribute it to us and check with us if you want to use if for commercial purposes.
To install the software, follow these steps:
- Get Johnny Chung Lee’s Wiimote Whiteboard software.
- If you haven’t already, install Adobe AIR.
- Install the FriiSpray AIR App. [Version 0.82 updated 3 November 2009]
The source code
As it’s Open Source that means you can look at how it works and we’d welcome people improving and building upon it.
- Download the source code.
- Read the source documentation.




















Is the source code free?
Where can I download it?
It will be. I just have a few things to tidy up and one small bug to fix. Then it will be released. Watch this space.
Just uploaded the program and source code. It’s my first Open Source project, so please be kind.
The Source code and documentation seems to have vanished
I Just found this…
http://www.nocircleno.com/graffiti/
What is it?
The Graffiti AS3 Bitmap Drawing Library is designed for ActionScript developers to easily integrate drawing functionality into a Flash, Flex or Air project. It is free to use and modify for noncommercial projects.
Their are some great bits in there that could help with the friispray application - the code is there to be freely used. I’m not a coder - or I’d jump in and play with it myself!
I’ve just found a nice app that lets you change the mouse button to right click instead of left - might be useful for future reference? Its http://www.swapmousebuttons.com/
Hey I can’t help helping!
@Ulfilas all source code is back on line and also at the latest version.
The graffiti library looks interesting. I probably won’t use it directly, but I will look how they’re doing bitmap drawing. FriiSpray uses vectors and this is limiting the brush effects we can get.
Extra functions for future that would be nice
it would be really nice if the paint could drip if the spray has been concentrated in an area for a set time
simple colour picker for more colour options
ability to use custom background as basis for drawing on top of - or restrict user to a shape area (transparent png?) - this would be loaded form admin panel - not user controlled
Logo placement to brand wall for events(corner)
Mailto: Email picture to an address (onscreen keyboard for typing address)
Stencils - loaded from admin panel (could transparent pngs work) user clicks on stencil button moves in place - rotates if needed - sprays - then closes.. (might need more explanation - but stencil would have to have buttons on it for this to work)
Record the painting so can be played back as animation and exported - not for user but for admin
All great ideas.
You can already do logo placement.
Cntrl + o opens a background image that can have a logo on.
Cntrl + m loads an image that goes in the foreground. This needs to be a png with a transparent background. It then acts as a watermark.
In both cases the image gets scaled to fill the full screen so add extra blank image to get the scale you want.
not quite the same sort of thing as friispray - but nice and the source is available too http://www.nastypixel.com/prototype/workshops/diffiti
Commercial licesnse for graffit library is $25 in case you’re interested
http://www.quasimondo.com/archives/000572.php
this any help?