HTML5 Canvas & Processing JS | Hacker News Reader

HTML5 Canvas & Processing JS

joeycadle.com

69 pointsjenhsun16 comments

I'm a huge fan of processing and processing.js . I come from a design background without any formal training in software development. Processing has been a really easy way for me to get visual results quickly without a degree in software engineering. I've tried to start using it on my blog as a way to quickly visualize ideas about more abstract topics [1]. I'm hoping to do a lot more experimenting with it in the near future.

[1] http://www.emergentforms.com/blog/2012/01/23/growth-vs-robus...

Can someone elaborate as to what purpose strike-throughs serve on this article? Am I right to assume they are a mistake?

I assume he meant to underline and used strikethrough instead.

Then again, it could be intentional, looking at the source this style is applied inline instead of in a css file.

Either way, it's a surprise coming from someone with a professed focus on design.

eh. I did it on purpose. I try to do what _I_ think looks different than most. Instead of making those sectional headlines a larger font or underlining them I decided to use strikethrough as I thought the little break from the conventional norm would be noted. Goal achieved, obviously. Sorry I decided to not be a complete sheep in the herd and do things the way EVERYONE ELSE does them. My bads, yo!

Please do not take this as a personal attack but strike-throughs are typically used to denote a change of thought or deleted information. As I was reading your article the context was lost as I was struggling to understand why that type was "deleted" or marked as incorrect. Again, I don't want to sound pretentious but the first thing you learn in design school is that breaking conventions creatively only works if you don't cause confusion. As a creative, I completely understand your desire to do things uniquely but I don't think it worked in this case.

For those who don't quite fully grasp what HTML5 Canvas check out the W3Schools entry for the element before reading any further, but it's basically an element that defines graphics.

RED flag - w3schools. Please check http://w3fools.com

I'm not the biggest fan of w3 schools either but as it stands if someone is new to design in general, and doesn't fully grasp the concept of such html5 elements, then it stands to reason that they probably trust the definition given by W3.

This looks very interesting. I've always been disappointed that Canvas totally eclipsed SVG in browsers- SVG elements are in the DOM, so it makes things like click actions a lot easier. It looks like processing.js goes some way to help with the pain of using Canvas.

I don't know if I'd say that "Canvas totally eclipsed SVG", it has gotten more attention. But as far as I know libraries like Raphael.js[0] are relatively popular. Additionally Raphael.js has ridiculous cross browser compatibility (For my usage it has actually held up to it's claims of being ie6 compatable), so I'd imagine anyone doing interesting graphical work on the web that has to reach a wide range of users is looking to SVG rather than Canvas.

[0] http://raphaeljs.com/

Alot of graphing/plot libraries use the new canvas element, I think even jqplot does it that way these days.

WIth Canvas and WebGL I wonder why we dont see more coolness.

node-canvas [0], node.js, and processing.js are a very powerful combination for allowing designers to implement server-side image filters.

[0]: https://github.com/LearnBoost/node-canvas

Site is unreadable on the iPhone.

errant view-port metatag left over from my last design, try again :)

Sorry man, but I can't read your site on the iPhone. You've got zooming disabled and the text overlaps the screen. Also the left and top floating bits keep moving around. Stay away from the javascript and just use some static CSS.

damn leftover view-port metatag from my last design that was a Responsive design. try again

Reply on news.ycombinator.com