Show HN: Kiddo Paint | Hacker News Reader

Show HN: Kiddo Paint

github.com

162 pointsvikrum49 comments

Hey HN — so, after finding a 15-30min block at the end of each day over the span of about a a month, this little side project is about done. I had a blast working on this with my kids acting as PMs :) I haven't tested it on non-OSX, and I imagine that the unicode/emoji support will be broken. I considered just including the OTF for those, but that's on order of ~40MB. Ideas welcome!

This is awesome, nice work!

Don't let Bloomberg Magazine find this - they'll use it for all their covers!

Seriously though, this is a ton of fun!

re: emoji you could try picking and choosing the svg's you need out of here:

https://commons.wikimedia.org/wiki/Emoji

gzipped by the server, they should come out pretty tiny compared to an OTF full of PNGs

The memories of KidPix have come flooding back! The is awesome! FYI: After a few minutes of using this, it seems to work quite well in Chrome on Ubuntu.

Very fun, thanks for making this and open sourcing as well. Maybe as our kids get older they can start checking out the source.

I love the spirit of this, and I've been waiting for someone to make it for years, if I didn't get to it first!

If anyone wants to make a similar web app, I maintain an open source library whose sole purpose is putting JavaScript drawing programs on web pages with custom tools.

http://literallycanvas.com/

Here's a simple web app I made with it that saves to local storage and uploads to Dropbox and Imgur: http://drawplz.com

(The text tool is slightly broken right now; the selection box drag corners are invisible.)

Also relevant: a large, collaborative live painting: http://webcanvas.com/

Oh, cool! I actually played with literally canvas a little while ago when I built this: http://tekromancr.github.io/drawchat/

I eventually decided to go with drawingboard, though I don't remember exactly why. But I was absolutely thinking about using literally canvas to build a kidpix-style webapp!

I'd guess there was some kind of missing API. I've done a lot of work on the API over the past six months, so you might find it to be a lot better these days.

I loved it. Have you ever thought about adding a "replay" button? It'd clear the canvas and show, step by step, what the kid draw.

I've been building one similar, but for grown ups and I'm learning lots of cool stuff from your code. For instance, I just learned about `createPattern`. Thanks for sharing!

That reminds me of that one program where you would pick a scene and make Spider Man do different things, I forgot the name of it. It was a lovely chunk of my childhood, and my adulthood if I ever find the disk... Found a link while googling it:

https://www.youtube.com/watch?v=2THuctqMXis

Of course featuring audio might be a slight bit more than this project is designed for, but it is still neat haha!

Good job! I liked Kid Pix as a kid myself...big part of my childhood.

The other day I was thinking back to my school days when Apple's ImageWriter II's were everywhere, and people used Print Shop (I think?) to make banners all the time. Because of how the printing technology worked -- writing to a continuous stream of paper -- banners were easy to do. We had banners in many of our class rooms, birthday parties, etc. My guess is banners are just not done anymore, and it also seems like many of these kinds of creative tools aren't common place? Do kids even have printers? Anyone with kids care to chime in?

I have many fond memories of Print Shop! I remember that program would also print "greeting cards" that you'd fold in quarters. The banners were a pre-birthday task that'd never get overlooked :)

It's interesting that an entire category of features fell by the wayside as a byprodct of the elimination of form-feed/perforated paper.

I fondly remember Print Shop printing cards and banners on the Epson LX-80 dot matrix on the Apple IIe monochrome (green and black screen). Piecing a banner together these days from a series of 8x10 sheets is just not the same. :)

This is great! I can definitely see one of the reasons why it works so well for kids: there aren't any weird menu buttons that you might accidentally press and get lost in. You just draw and push the buttons to see what difference they make.

It's funny you mention that — the author of Kid Pix wrote about the motivation around his app and he specifically calls that out as well:

"I didn't want to use pull-down menus for this because, among other reasons, Ben had trouble with them. " [http://red-green-blue.com/kid-pix-the-early-years/]

I tried to stick to and follow as many of the directives he has listed with Kiddo Paint.

Nice! Couple of things:

- Firefox on Ubuntu yields "TypeError: t.srcElement is undefined" when I try to change the colour.

- I don't have any fonts for some of the icons in the buttons (e.g. the arrow). Seeing as you're presumably already loading the textures for drawing onto the canvas, you might as well just use an image for the buttons too.

Hope this helps.

Thanks for the report; I have screenshots from others and will take a look at fixes shortly. Cheers!

It's worth mentioning TuxPaint[1], which has been around for over a decade. That said, well done! There's no reason we shouldn't have plenty of choices for free and open source childrens software.

1: http://www.tuxpaint.org/

I've never heard of KidPix before but KiddoPaint seems like a web based less colourful TuxPaint - always loved the sound effects, the kids liked them too.

Nice. Will test it out. As a parent of a 3 year old & 15 month I find it amazing how quickly the pickup on things. I also belive we are witnessing the "app generation" growing up. We limit ipad time etc. But my daughter does not ask for TV. .. she asks for youtube/netflix.

Well done! My train-obsessed 3 year old would approve of the stamp toolbar defaulting to a train.

A button to download the canvas as a png or jpg would be nice for saving and sharing special creations.

Same with my kids! See also the draggable train tracks! :D

not at all obvious: keyboard, 's' to save/download :)

Ah, nice! :) The Github did mention that there was a handful of hidden features.

The explosion noise when clicking on the bomb is a nice touch :)

The original KidPix had that idea, an old drawing application that could desperately use a refresh to modern interfaces .....

I actually got KidPix 1.0 running in a virtual machine— a handful of the "brushes" are as-faithful-as-I-could-make-them ports from KidPix! (including the skeleton and layout for Kiddo Paint) :) Fun fact: KidPix 1.0 was released into the public domain by the author; it was only subsequent versions that were commercial.

Wow, so are we on the same wavelength or something? I made this a few weeks ago on JS fiddle with the idea of recreating kidpix. Even used unicode chars with a face for the undo!

https://jsfiddle.net/97vLt5dj/24/

Sorry for asking here, but does anybody know of a web page where you get to see someone's drawing and then you write a caption for it, then someone else will have the caption open on their monitor and they get to draw it, and on and on? It was fun! Then I lost the URL...

Windows + Firefox => looks like cars don't work - some icons are not visible and all of them are just creating rectangles in the picture http://snag.gy/4fm3H.jpg

Thanks for the report & screenshot! What, in general, happens with other emoji on Windows? Namely, the Apple color emoji—is there an analogue that Windows users fall back to?

Great -- the very first button I press (the frowning cat) cleared out my entire painting. And I have no idea how to get it back.

Clicking on every button shows that clicking the cat again brings it back. What does this cat actually do? Labels would be useful.

Sorry! D:

That's the "oops" cat: 1 operation undo/redo.

The bomb feature could very easily turn creative play time into a traumatizing event for a child. I second the labelling of the buttons. With that being said, amazing product!

If you'd like a flashback of the original Kid Pix: https://jamesfriend.com.au/pce-js/

We had the same idea but wanted to go much much further. You should really try it out, its called Collusion. https://col.lu/ You have to sign up but it keeps your drawings like google docs and is real-time collaborative without the other people signing up.

Works on everything too, tablets, laptops, supports ms surface etc and is free for public drawings.

The explore page on our website also shows you what others have drawn so also check that out. https://collusionapp.com/explore

I don't know if I'd say it's really the same. There's tons of drawing apps, but this is much more of a nostalgic thing, and it's for kids.

Also, it's open source, which is a huge draw. (I'm going to be porting it to a web platform... probably tonight, I'm excited.)

Depends what you mean by kids, but actually we did a lot of work with schools and the kids love it.

I love it! Great work man. Feel like a kid again :)

Fantastic. So many hours spent in MS Paint and friends when I was younger. Firing up your demo site made me feel like a kid again.

Great idea :)

> 15-30min block at the end of each day over the span of about a month

Admire your speed ! It's a fun app with lots of nifty features.

The pencil sputters individual squares when you click and drag the mouse. It should draw a continuous line instead.

I'm a... Commander Salamander... with a thousand toes and and a pickle in my nose... AND... I float in the ocean!

edit: Draw me

On Ubuntu and Firefox, I can't seem to change the color.

Nice. This would actually make for a nice iPad app.

This is damn fun.

I love the heck out of this.

very nice! I'll try it with my kid

Reply on news.ycombinator.com