8 ms·
Kid Pix as a JavaScript App
- ct520 5y agoThis is awesome walk down memory lane thanks for sharing
- jdofaz 5y agoBack in middle school we had this version in the MacLab. I think the firecracker delete tool was the most popular feature.
- strict9 5y agoOK I had fun with this with my young one, but why is it so hard to start with a blank canvas? Can't figure out how to start with a blank slate. But even more annoying is that it uses localStorage for what you've created. To completely start over, I had to run localStorage.clear(); in the console. This is a lot of fun, but a couple of small tweaks would make it a lot better (or easier to figure out).
- wombat-man 5y agogotta hit the eraser and use the dynamite! But I guess if you hadn't used kid pix you might not know that.
- clarle 5y agoThe nostalgia of the explosion is too much for me this morning. I remember everyone in the computer lab always never actually drawing stuff and mostly just clicking the dynamite to get as many explosions on the screen as possible.
- wombat-man 5y agooh no! yeah, I don't remember the stamps repeating as quickly on the original but otherwise this seems pretty right on.
- babypuncher 5y agoI recall the speed of the explosions being CPU dependent. When we got a new family computer in the late '90s I recall the explosion going from taking several seconds to happening almost instantly. 7 year old me thought this was hilarious for some reason.
- ksenzee 5y agoSame experience as winning Windows Solitaire on a Pentium for the first time and watching the cards instantly fall to the bottom. I was considerably older than 7 at the time and I still laughed.
- BeFlatXIII 5y agoWas there any other use for Kid Pix? I thought that was all there was to do back when I was in elementary school.
- Avshalom 5y agounfortunately I can't seem to freeze the dynamite.
- nkingsy 5y agoyeah I seem to remember being able to make it stay on the screen if you start another action.
- graderjs 5y agoBTW I love this code: https://kidpix.app/js/app.js https://kidpix.app/js/app.js repo here: https://github.com/vikrum/kidpix https://github.com/vikrum/kidpix
- seph-reed 5y agoYup. That's a well organized project right there. Very easy to find the exact code doing whatever it is you want.
- deleted 5y ago[deleted]
- amatecha 5y agoNice, good to see some plain old JS for once (not even minified either). No heavy UI framework(s). The entire app loads in like 150kb of network transfers. Great work!
- Waterluvian 5y agoHas anyone had any luck using this classic style of JS namespacing in a way where their editor understands it when populating code completion? I love rollup, uglify-js, etc. for this kind of thing: just concatenate all the modules into one JS file and ship it as-is.
- kilroy123 5y agoI miss writing JS like this. I was complaining to my manager earlier how I get frustrated by react sometimes.
- ConceptJunkie 5y agoWhat? You mean 100MB of libraries is somehow a bad thing?
- function_seven 5y agoWhat do these 2 lines do? canvas.width = canvas.width; canvas.height = canvas.height; Workaround for some weird DOM issue?
- animal_spirits 5y agoThis brings back great memories. This program is how I learned how to use a computer back in elementary school, on our colorful iMacs. Love it
- WoodenChair 5y agoA similar project: https://kiddopaint.com https://kiddopaint.com
- alexives 5y agoLooks like an earlier version of this by the same author. https://github.com/vikrum/kiddopaint https://github.com/vikrum/kiddopaint vs https://github.com/vikrum/kidpix https://github.com/vikrum/kidpix
- mgarciaisaia 5y agoSource code also is all about KiddoPaint: https://kidpix.app/js/app.js https://kidpix.app/js/app.js
- vikrum 5y agoGood catch! Yep, I forked my old paint app. It didn't have any animations, sound handling, etc. I hope everyone is having as much fun with it as I had in making it!
- mwcampbell 5y agoI'm guessing the new name is a trademark lawsuit waiting to happen. From what I read on Wikipedia, it doesn't look like Kid Pix is abandonware.
- hoppyhoppy2 5y agoThere's also KidPix 1.0 for DOS available (and playable online through an emulator) at the Internet Archive: https://archive.org/details/KID_PIX_DOS https://archive.org/details/KID_PIX_DOS They also host downloadable later versions of KidPix but AFAIK those are not playable in the browser.
- trutannus 5y ago"Where is the dynamite" was the first thought I had.
- jjoonathan 5y agoI wonder if hiding it under the eraser secondary menu was an intentional way to get kids to talk with each other and share the "secret."
- spywaregorilla 5y agoWow. I sometimes think about this program from elementary school. It is amazing to use it again. I was the best at it, because I learned the tooling to make the most rainbow. I'm sad to say I don't remember my workflow.
- IggleSniggle 5y agoOn the “star” icon-paintbrush thingie, there was one or two glyphs that just render as slightly rounded big black squares, which I’m pretty sure is a result of the glyph (font?) not loading properly for whatever reason. On iOS.
- dexwiz 5y agoThe Oh No sound that plays with undo has lived rent free in my head for 20years now.
- jamil7 5y agoThat sound gave me some heavy nostalgia.
- blululu 5y agoThis is exactly the first thing I went for. I cannot believe how immensely gratifying it is to hear that sound once again.
- SilverRed 5y agoI'm not quite as old as the average HN user so I started with I think kidpix 3 which had a wider variety of undo sounds which I can still remember perfectly despite not touching the program for about 14 years.
- JetAlone 5y agoThe voice of Joseph Joestar going "Oh No!" etc. when JJBA became extremely popular totally reminded me of kidpix.
- crowbahr 5y agoFor me it was the "Oops" but same.
- rasz 5y agoFor those unfamiliar (like me) "Kid Pix Roundup" by Cathode Ray Dude: https://www.youtube.com/watch?v=NK6-ZSaBzjc https://www.youtube.com/watch?v=NK6-ZSaBzjc
- jojo2000 5y agolove this ! so much fun with kid pix ! thanks a LOT !!
- jamesgreenleaf 5y agoThis made me smile. I loved this as a kid. Next do Spider-man Cartoon Maker ;)
- skocznymroczny 5y agoI used to enjoy this application as a kid. These days, I'd be wary of putting "kid pix" into google search to relive my memories.
- chana_masala 5y agoI had never heard of this application and I thought it must have been some "instagram for kids" type thing
- arthurcolle 5y agooh no!
- ggoo 5y agooops!
- deleted 5y ago[deleted]
- sacha_inchi 5y agoThank you so much!
- pininja 5y agoRelive the magic of KP Studio, Studio Deluxe and Deluxe 3 with this Kid Pix Roundup video https://youtu.be/NK6-ZSaBzjc https://youtu.be/NK6-ZSaBzjc
- scottrogowski 5y agoOh man this brings back memories. I must have been 6 years old. My dad came home with a computer that they were getting rid of at his work. He set it up that night and, having never seen a computer, I wanted to play with it. Well, for some reason, it had Kid Pix installed. I remember drawing something with a couple of green lines and a few rabbit stamps for good measure. As I recall, I then insisted that we had to print it and wouldn’t take no for an answer.
- peterburkimsher 5y agoYou had colour! Back in my day... ;-) Really though, similar story here: my dad brought back an LC III and Color StyleWriter 2400, and before long I was drawing rocket ships and poo. I realised that my pictures looked better in LogoWriter than drawn freehand in Kid Pix. And now I ended up writing software!
- pietromenna 5y agoWow! Many many many memories from the past. The bad part is I only used on Black/White Display in the past and now is in colors
- hjek 5y agoYea, grew up on B/W Kidpix. In this JS clone, some of the effects are also less pixelated, especially the fractals / mandalas. "Broken Glass" and "Wrap Around" gives me errors as well. It's not 100% perfect clone but it's amazing and the code is beautiful, performant, concise vanilla JS.
- bentpins 5y agoYou can add the CSS rule "filter: grayscale(100)" to the body if it helps. I have no idea how black and white monitors worked though, I would guess they'd have less than 8 bits of brightness info?
- dragonwriter 5y ago> I have no idea how black and white monitors worked though, I would guess they'd have less than 8 bits of brightness info? Depends on the monitor; I think ones existed with anywhere from 1-8 bits.
- pietromenna 5y agoIt allows to see. I just tested on chrome dev tools. What it does not to is set the filling as it worked on the original app. Anyways, really nice memories. I was a child (6 yo) when I first touched those. Thanks for the hint to play with CSS. :-)
- coldcode 5y agoMany times I have wanted the Oh No! undo and the Dynamite in my IDE.
- hjek 5y agoNow I wanna find out if I add those sounds to `u` and `ggdG` in vim.
- ChrisArchitect 5y agofurther discussion less than a day ago: https://news.ycombinator.com/item?id=28069588 https://news.ycombinator.com/item?id=28069588
- Evansbee 5y agoTrying to figure out why the hn post screen didn’t flag this for me, I’m usually pretty religious about amplifying existing posts and not reposting.
- ChrisArchitect 5y agoIs it weird that I feel like I've never heard of this app? I mean, I was around late 80s/90s but I dunno....what platform/years are the core of this? Here's some other retrospective from recent: The creative legacy of Kid Pix https://news.ycombinator.com/item?id=27563615 https://news.ycombinator.com/item?id=27563615
- ChrisArchitect 5y agoohhh, was it mainly a Mac thing? PC-focus over here. Still think I would have heard of it
- 1--6zVa-E 5y agoIt was on the Windows desktops in my schools.
- ChrisArchitect 5y agoInteresting. The go-to was MS Paint that I ever saw, because of course it was already included. My side point was also thought that I've never even heard people mention Kid Pix until now. But have heard about other legendary things like Printshop etc etc
- acoard 5y agoThis was in the early/mid 90s or so I'd hazard to guess. I've only seen it on PCs. It was often the most fun application in an elementary school's computer lab. As far as I know it was never officially bundled or anything, but just a popular program. I also had it on my computers at home because both my parents were in graphic design and used Corel Draw for work, and my dad was a bit of a computer geek.
- SilverRed 5y agoI was born in 1998 and every school PC had a version of kidpix installed (v3 I think) despite it being quite old at the time. I have a vague memory of kidpix being used to teach the basics of computing like how to save a file to the file hierarchy and then how to print it.
- TheSpiciestDev 5y agoI remember myself back in elementary school making games with this. I'd paint up a scene, stamp some art and then cover the stamp. I'd then have my friend guess as to where the stamp was in the scene and we'd undo or "oh no" the cover away... great memories!
- Octopodes 5y agowhat is the legality of this website? I don't see anything indicating that it's an official port.
- opan 5y ago>JS Kid Pix / Kid Pix 1.0 was released in to the public domain and this is an HTML/JS reimplementation. source: https://github.com/vikrum/kidpix https://github.com/vikrum/kidpix
- deleted 5y ago[deleted]
- gregsadetsky 5y agoThere's a beautiful mini documentary with Craig Hickman, the creator of Kid Pix, here: https://www.youtube.com/watch?v=csalhuSixQU https://www.youtube.com/watch?v=csalhuSixQU It's by Jeffrey Alan Scudder aka Whistlegraph aka HN's own justanothersys. His fantastic No Paint (very much in the spirit of Kid Pix) was discussed here a ~year ago: https://news.ycombinator.com/item?id=23546706 https://news.ycombinator.com/item?id=23546706
- MrKristopher 5y agoI like it. I think it's missing the option to increase the stamp sizes though? What I really liked about Kid Pix was the ability to make animations through the slideshow mode. You could put together up to 100 pictures in a slideshow and set the time per slide to < 1 second to create animations.
- duskwuff 5y ago> I think it's missing the option to increase the stamp sizes though? Holding Shift doubles the stamp size. I think this is accurate to the original implementation. > What I really liked about Kid Pix was the ability to make animations through the slideshow mode. That must have been in a later version. I don't remember that existing.
- todd3834 5y agoThank you so much for making this! The sound effects take me back. I've been hoping to find something like this for my daughter to experience a fun paint program like I had.
- SilverRed 5y agoKidpix 3 seems to be on archive.org right now. You might need a windows XP VM to play it though.
- neovive 5y agoWow! I remember Kid Pix! The Wacky Brush implementation is excellent!!
- ChrisArchitect 5y agoRelated/unrelated discussion about another kids drawing experience, but this time on a console system: Mario Paint https://news.ycombinator.com/item?id=28065357 https://news.ycombinator.com/item?id=28065357
- Waterluvian 5y agoAnyone think they can explain this in the source code? function ziggurat() { return ((Math.random() + Math.random() + Math.random() + Math.random() + Math.random() + Math.random()) - 3) / 3; } https://github.com/vikrum/kidpix/blob/9385acf5b3f57cdc8c5b3fa68d42815676775f2d/js/util/utils.js#L99 https://github.com/vikrum/kidpix/blob/9385acf5b3f57cdc8c5b3f...
- everfree 5y agoLooks like a way to purposefully create a biased (center-weighted) random number generator out of multiple calls.
- Waterluvian 5y agoMathematically is the sum of six Math.random() any different than (Math.random() * 6)?
- russellsprouts 5y agoYeah, it will biased towards the center of the range rather than uniformly distributed
- jjoonathan 5y agoYep, the sum of six Math.random() will start to look a bit like a normal distribution, while Math.random()*6 will stay flat. Even crazier: the sum of six (Math.random()>.5)?0:1 will also look a bit like a normal distribution, rather than just 0 50% of the time and 6 50% of the time. Central Limit Theorem eats distributions of all shapes and sizes and shits gaussians. That's why you see normal distributions everywhere.
- Waterluvian 5y agoOhh okay. I see it now. This is like how two D6 dice roll differently than a D12?
- deleted 5y ago
- TeaVMFan 5y ago2nd t
- TeaVMFan 5y agoRx
- diiaann 5y agoI was doing research for something else and found this great anecdote about Kid Pix that I've saved. "Other product teams do not have the time or resources to work with children as often. In the case of Kid Pix, when it was first released back in 1989, Borderbund sponsored their first Kid's Day. It was a weekend testing day for 20 children to try out Kid Pix. Developers offered their testers cookies for a break and a crafts table with paper, glue, glitter, etc.--just in case the testers got bored. According to Broderbund employees, few cookies were eaten and almost none of the crafts were used. It was determined that Kid Pix would be a hit (Druin and Solomon 1996)."
- panda888888 5y agoThis is awesome, but the aspect ratio/scaling is kind of weird on my Chromebook, which admittedly does have a smaller than usual screen. To have the left side toolbar fully showing so that I don't need to constantly scroll up and down when making art, I need to zoom allll the way out to only the 33% zoom level.
- ConceptJunkie 5y agoI bought KidPix for my kids when they were very little in the late 90s and they really liked it. I found it to be a rich application that was great for exploring and easy to figure out. I was determined to give my kids good exposure to computers growing up, something I missed out on because home microcomputers weren't a thing, and then when they were, they were too expensive.