onBoard 2.0 – Massive Collaborative Painting & Drawing

onBoard is a Collaborative (multi-user) painting and drawing application created in flash and php. Anyone can paint, draw, insert images and see other users paint live (feature comming soon). It has been 9 month since I released version 1.0, now there is a new version. A lot of things is changed in 2.0. The most important is UI change, this is my approach to write my first touch-device-ready flash app. I have also rewriten the whole app to pure ActionScript 3.0 (no flex framework used anymore), in order to gain crucial improvements in speed and weight. Every piece of code is optimized for speed. After all the changes, I have been able to keep fps at the rate of 30 in full hd fullscreen resolution (tested in flash debug player v 10.0), with memory consumption only around 30Mb (most of it is bitmapData).

The embed code has been unchanged, so if you have iframe embeds in your sites, it still works.

While there has been some questions about how to embed the application to a webpage, here is the answer:

  1. run onBoard application
  2. navigate whereever you like to (position, zoom, rotation)
  3. click ligh bulb icon in main menu
  4. click copy to clipboard icon
  5. now the url pointing to your actual view has been copied to the system clipboard
  6. open your webpage editor and paste (CTRL + v) the url into iframe src, define iframe width and height to whatever you like

The resulting code should look like:

<iframe src="http://onboard.yoz.sk/?board=_default_&amp;x=99788&amp;y=500&amp;scale=1&amp;rotation=0"></iframe>

If you embed onBoard onto your webpage, feel free to contact me about how it works for you, all feedback welcomed… Have fun 🙂

onBoard is also available in AIR and on Adobe AIR Market place.

6 comments so far

  1. Karim Beyrouti July 2, 2010 18:19

    love it….

  2. ASH721 July 3, 2010 00:10

    Very nice Yozo!
    I have got two suggestions..

    1) Maybe you should add some titles to the icons. I still don’t understand the function of bulb icon, even I now understand that I have to click it to get the embed code..

    2) Classic color-picker usability problem in lot of apps: Once you change the color, you have no chance to select the same like you used a few seconds ago.. This can be fixed with “hexadecimal input” or some “history container”..

  3. YopSolo July 4, 2010 08:58

    really cool stuff ! well done 🙂

  4. Jozef Chúťka July 7, 2010 10:01

    @Karim, @YopSolo, @ASH721
    thank you for valid suggestions, Yes, I have to figure out that tooltip somehow
    bulb icon is for utils: there is a tool that moves you to the latest drawings, tool to make screenshot and actual board link … there may be some more soon
    the color picker will be adjusted, for now you can use rightclick (anywhere over board) to pick the color you are above.

    @ASH721 really nice graffiti!

  5. […] am pleased to announce, I managed to create an onBoard port for OpenStreetMap API. A few months ago I tought about how could this been done, and finaly, […]

  6. […] your drawing to facebook. See other users drawing live. Today, I am releasing 3rd version (1st, 2nd) that is a little different than the previous ones. It takes advantage of Starling Framework and […]

Leave a comment

Please be polite and on topic. Your e-mail will never be published.