For this week's PLUS tutorial, Siddharth will teach you how to replicate this excellent Flash based drawing application. But instead of sticking to good ol' Flash, we are going to use the canvas element and some spiffy jQuery UI elements to achieve the same functionality. Intrigued? Let's dive in!
Join Tuts Plus
For those unfamiliar, the family of TUTS sites runs a premium membership service called "TUTSPLUS". For $9 per month, you gain access to exclusive premium tutorials, screencasts, and freebies at nettuts+, psdtuts+, and vectortuts+! For the price of a pizza, you'll learn from some of the best minds in the business. Join today!
- Subscribe to the NETTUTS RSS Feed for more daily web development tuts and articles.
Related Posts
Check out some more great tutorials and articles that you might like
Plus Members
Source Files, Bonus Tutorials and
More for $9 a month for all TUTS+
sites in one subscription.
User Comments
( ADD YOURS )BroOf May 6th
Wow, looks awesome!
( )Myfacefriends May 6th
yes it is!
( )Liam McCabe May 6th
tuts+ tempts me one more,…
( )hmmmm
choise May 6th
dito
( )w1sh May 6th
Me too. This app looks great for drafting a design with co-workers. Integrate this into the company site and you’re in business.
( )Rick Bross May 12th
im with yah man.
( )Daniel [HiddenCSS] May 16th
So tempted to go Tuts+ now…. Just don’y have the money as a student though!
( )KAZI May 6th
Argh, I hate not having a Tuts+ account *sad* Maybe I’ll by one soon.
( )Joel Drapper May 6th
Why not just put sponsored ads on the site rather then this tuts plus program?
I would have tweeted, and I’m sure many others would have tweeted, bookmarked, etc. this post bringing more traffic, more subscribers, etc.
I see you do have ads in the sidebar – is tuts+ really necessary?
( )Johnathan May 6th
Yes, it makes people like me who pay feel special
( )Jeffrey Way May 6th
It’s a matter of paying for these big tutorials. It costs us a great deal of money.
( )w1sh May 6th
It’s a fair deal. They give us a bunch of high-quality, free tutorials, and occasionally post a Plus one.
Besides, if you use CS, then $9 a month for really high-quality tutorials in every program is a pretty great deal.
( )Vasili May 6th
Like Jeffery says in almost every screencast about tuts+, $9/month really isn’t that much money. If you work for a hour (depending on your work), you’ll be able to pay for this. It’s really not that bad when you think about it. :\
Plus, tuts+ pays thousands of dollars a month for Amazon S3 storage. Along with hosting and paying authors, the least you can do for such an amazing website is spend $9/month. It doesn’t even have to be for 12 months straight; you could pay for only 4 months, it’s still helpful.
( )visual May 6th
May be those who can’t pay can come together and try to write a tutorial identical to one that is on plus
innovator May 15th
the money for the tuts+ isn’t a problem but the medium of payment rather.
Free CSS Templates May 6th
Money makes the world go round my friend. I will check the tutorial out, could possibly be useful for one of my upcoming projects.
( )Craig Farrall May 6th
Jeff, you never seize to amaze me, how you know all this stuff, and make great tutorials out of them, you really are a true role model for the younger people like myself. You really do have me wanting to get this plus account.
( )Jeffrey Way May 6th
Thanks, Craig! But I can’t take credit for this tutorial.
( )chrisberthe May 6th
Cute smileys Jeff :p
( )Siddharth May 6th
I drew them actually. Jeff drew those tacky Tic-Tac-Toes.
( )chrisberthe May 6th
Sorry, misread who the tutorial was by . Thanks Siddharth
( )joell lapitan May 6th
me too, all this PLUS tuts tempts me to avail tuts+ program, but i don’t have enough money..
well, i was trying to submit tutorials here so i can join tuts+ but they are not approved.. my ideas are not that good.. maybe i just need more inspiration.. haha..
( )Myfacefriends May 6th
@Joel try in other time, i know you can do it., and im waiting for your tutorial… Mabuhay.
( )WebberPL May 6th
Why i cant pay for subscrib with Moneybookers?
I dont have a credit card so i cant pay with paypal…
Please, add moneybookers to payment methods.
Yeah, i now, my english is so bad
( )Sass May 6th
Really great stuff here.
I have only read titles here for a few months and then decided to pay subscription.
And i can say, that this was smart step. I dont need ebooks anymore, i just need to read and listen Jeffrey.
Anyway, more tutorials like this – i love jQuery.
( )Matt May 6th
Siddharth…..that name sounds so familiar….
this might get deleted but siddharth, are you from gimper.net?!
if you are, i havent see you around lately!!
( )Dave May 6th
I’m always amazed that this is even causes conversation. I learn more from this site than I do at university. I think $9 is amazing value for money
( )Diego SA May 6th
Oh God, the plus membership just provokes me. It annoys me…
( )Chesham May 6th
Arg, ditto. Why are all the cool tutorials plus nowadays?
( )Shuuun May 7th
all good?
In my eyes its the first you cannt grab by google in any kind 
Rahul Chowdhury May 6th
Man, this tutorial is awesome. It would be great to build a Paint Application, and that’s online for my users. Thanks a lot for it.
( )Siddharth May 7th
Thanks for the kind words. I’m happy you liked it.
( )Shuuun May 7th
First PLUS tut i really want to know and i have to check the price for PLUS !
I will get one if there are more interessting tutotials in PLUS in near future!
( )Adel May 7th
oh God, this is sooo great, Jeff please is there any other way than this D#@* paypal thing to register, I could not make an account there because I’m in a region which they don’t support, come on… pleaaase… I’m dying here
( )Chris May 7th
Awsome I know exactly where to implement this into one of my websites
Should be a fun app to use.
Thanks
And Tuts+ is well worth the money, works out in british punds to roughly £4.50 a month!! This is northing for the skills and knowledg you gain, and you get to keep the tuts so its all worth it.
( )Chris May 7th
Just being using the demo, and it dosent seem to work in IE7 ? this is a big flaw in the Tut if so. Only worked in FF.
Also how could you enable it so after they had drawn an image it could be saved?
( )Siddharth May 7th
Right click -> Save Image As. The image is saved as a transparent PNG.
Internet Explorer doesn’t support the canvas element. Fret not though. Google has the excellent ExCanvas library for this very purpose.
http://code.google.com/p/explorercanvas/
( )Patricia May 7th
Thanks for a wonderful post, dude
( )lawrence77 May 7th
Siddharth where you from?
A nice tutorial on the way, but its a plus one!
( )Siddharth May 8th
Chennai, India.
( )lawrence77 May 13th
அட நம்ம ஊரு பய…
கலக்குறப்பா நீ….
மின்னஞல் முகவரி இருக்கா????
Maxi October 18th
Is there a possibility to let users save their work as png ?
( )victoria maurer October 22nd
looks cool but not sure
( )