C

Creative JS

creativejs.com · Company blog · on HN since 2011

Creative JS is a showcase and blog of creative JavaScript, HTML5 canvas and WebGL projects, demos and techniques.

What HN saysHN commenters link it for demoscene-style JavaScript demos, tiny-size entries like the 28KB mountain fly-through, and the series on how JavaScript engines and compilers work.
26HN people shared it
10linked it in comments
18stories submitted
167story points
2 years agolast shared
2011people per year2026

Most-shared posts

  1. 1
    Creative js - all Creative JS/HTML5/CSS projects
    3 people · 6 points · first shared 2011 · discussion on HN
  2. 2
    SnappyTree: a WebGL-based procedural tree generation app
    2 people · 13 points · first shared 2012 · discussion on HN
  3. 3
    Jsexe javascript compressor
    2 people · first shared 2012
  4. 4
    How JavaScript compilers work
    1 people · 95 points · first shared 2013 · 26 comments on HN
  5. 5
    Escapes.js – Retro ANSI art in JavaScript
    1 people · 31 points · first shared 2012 · 7 comments on HN
  6. 6
    31 days of Canvas
    1 people · 3 points · first shared 2011 · discussion on HN
  7. 7
    Gunfire, Tape Loops, And More With The Web Audio API
    1 people · 2 points · first shared 2012 · discussion on HN
  8. 8
  9. 9
    3D chess based on Photon and Chess.js
    1 people · 2 points · first shared 2012 · discussion on HN
  10. 10
    JAM With Chrome | CreativeJS
    1 people · 2 points · first shared 2012 · discussion on HN
  11. 11
    Grand Theft Auto - WebGL tech demo
    1 people · 2 points · first shared 2012 · 1 comments on HN
  12. 12
  13. 13
  14. 14
    The JavaScript engine family tree
    1 people · 1 points · first shared 2014 · discussion on HN
  15. 15
    Augmented Reality comes to JavaScript
    1 people · 1 points · first shared 2012 · discussion on HN

What HN people wrote when they linked it

onion2k · 2018-01-24
Have a look at the demo sites for rune.js, three.js, create.js, sketch.js and processing.js. Then look up a few people like Seb Delisle (https://seb.ly/), Ana Tudor (https://codepen.io/thebabydino/), and Ricardo Cabello (http://mrdoob.com/). Browse around on Codepen.io and http://creativejs.com/ (especially http://creativejs.com/tutorials/index.html). Sadly Creative JS is essentially dead but it's still worth reading.
robxorb · 2024-05-12
Here it is in 28KB. The site also links to a 9KB version (but it didn't work for me): http://creativejs.com/2013/02/elevated-a-beautiful-mountain-fly-throug…
crashandburn4 · 2013-11-20
is there anything detailing the maths/programming techniques behind this? can anyone confirm whether this is Barnes-Hut? I've had a look here: http://creativejs.com/2013/11/coupled-turing-pattern-and-219-particles… but there's no details on the specifics
DanielRibeiro · 2013-02-10
Andrew Price has some amazing tutorials on how to do it with just Blender: http://thenatureacademy.blenderguru.com/sp/7612-the-nature-academy-liv… It is more on modelling rather than generating though. On procedural generation, we discussed[1] this app written in WebGL: http://creativejs.com/2012/06/snappytree Other peopled did it with Three.js: http://catchvar.com/threejs-procedurally-generated-infinite-terra#more… And finally, a really lively discussion[2] turned about The Death of the Level Designer: Procedural Content Generation in Games[3] [1] http://news.ycombinator.com/item?id=4161263 [2] http://news.ycombinator.com/item?id=3872615 [3] http://roguelikedeveloper.blogspot.com/2008/01/death-of-level-designer…
wullon · 2012-09-18
Very interesting. Looks like some oldschool video game developers got into Apple webdev team. About the last paragraph, we (Adinpsz) tried the PNG compression technique for JS demomaking (actually it's even a self-loading PNG-HTML ;)). You can learn more here with the JsExe tool: http://creativejs.com/2012/06/jsexe-javascript-compressor/ And see it in action here: http://pouet.net/prod.php?which=59071 (http://adinpsz.org/online/fabrik/) But HTTP compression should be better anyway for "real world" usecases?
heh, here's a hacky idea ;) Take a PNG, base64 encode, compress and gzip your js template into it, let it create the same css3 code, but by using javascript. This works by putting the png into a canvas... here's a guide ;) http://creativejs.com/2012/06/jsexe-javascript-compressor/ and http://iamcal.github.io/PNGStore/ haha, you could save angular.js, your css,html and image sprites into two or three png's. :P Hey are you still with me? We could theoretically go further, there are no guarantees though. We'll use "Multiphase Compression". Uncompression is slow, but we only care about space, let's hope we save more than we use. Step 1: Store css/html/js into the png as mentioned above. Then look for a "minimal" fractal image compression library written in C. Run the png through the fractal compressor. Step 2: Save the output into a Javascript ArrayBuffer Step 3: Now convert the minimal fractal compression decoder to javascript using Emscripten. And store the output into a png again. Then decode the javascript from the png and let the fractal decoder create a png out of the ArrayBuffer. Then extract the js/html/css from the png that we just generated on the client-side. We now have the final data. We can let it remove all unnessary js after saving the extracted data into html5 localstorage.
mnicole · 2013-04-04
I'm a designer, but I've never been into traditional art because I grew up knowing that digital pieces could be so much more than traditional media. I think a lot of techies probably feel the same way; they're waiting for artists to better familiarize themselves with the tools we use because that's where the impressive stuff happens. Not sure if any of these fit into your definition of art+tech, but I'm a huge fan of the stuff shown on Creative Applications (http://www.creativeapplications.net/). Joanie Lemercier's work also falls under this category (http://tumblr.joanielemercier.com/). Branden Hall is also doing a lot of interactive art pieces lately (https://vimeo.com/waxpraxis), and Manny Tan is doing some great visual stuff with various technologies as well (http://www.uncontrol.com/). And since the individual post about it didn't get any love here the other day, the Flat Surface Shader project (http://wagerfield.github.com/flat-surface-shader/) is a great example of open-source pieces that others can fork and build off of that I hope we see a lot more of (in addition to designers and developers working on these types of projects together to begin with). To that point, Chrome Experiments (http://workshop.chromeexperiments.com/) and Creative JS's tutorials (http://creativejs.com/tutorials/) are great introductions to what is possible for those wishing to delve into technical art. Nylllon (http://nylllon.com/) also does a good job of curating some great art+tech…

Keyboard shortcuts

/Search
j kNext / previous blog
EnterOpen selected blog
vVisit the blog site
fFollow / unfollow
lSwitch grid / list view
dSwitch dark mode
g hHome
g pTop posts
g tTopics
g fFollowing
g lLiked
g yHistory
g qFAQ
EscBack / close