by Nick
I know I’m not the first to delve into the world of Paper.js, but being such a new technology, i figured it was worth a look. Not to mention that you can do some pretty neat stuff with it on any canvas enabled browser.
See these quick examples:
cubes
lines
starfield
_Posted in Canvas, Category==Null, HTML5, Javascript
_Tagged Canvas, html, js, paper.js
by Mikko
Seem’s like I’ve brought the House Of Cards dataset to almost every platform I work with. So it was only logical to use it with my first experiments with WebGL:
(more…)
_Posted in Canvas, HTML5, Javascript, Radiohead, WebGL
by Mikko
When I look back on developing Björk I’m surprised by one thing… It wasn’t as painful as I thought it would be.
When I first saw the creative for the site I started thinking “How will we pull this off in HTML?”. As the previous post stated we took quite a few test routes before deciding on doing everything using canvas. Once we had decided on the Canvas method I developed Jam3D.js quite quickly. I think the core of the engine was written in two days or so.
You might be asking why didn’t I just use another 3D engine that’s out there. Well… Generally with projects that have a tight timeline or are high profile I’m scared to use other peoples tools/code. Especially when it needs to be optimized as much as possible. It’s very hard to optimize someone else’s code vs your own. Sometimes to optimize code you have to know every nook and cranny of the code. That’s not to say I don’t EVER use other people’s libraries. (I do look forward to playing with ThreeJS though)
When I was writing Jam3D.js I knew we had to optimize as much as possible but still keep it flexible. To do this you have to keep things as simple as possible.
(more…)
_Posted in Canvas, HTML5, Javascript
by Mark
About 6 months ago we were contacted by a company in the uk because of this blog post. They were particularly interested in creating an html5 experience for the Bjork’s new web site. Who wasn’t? After Steve had this to say, and experiments like 100-tweets drummed up interest, the interwebs were ready to critically acclaim an html web experience and that’s when the wilderness downtown came onto the scene. It captured awards at the highest levels, and solidified the technology as a serious contender to deliver the highest quality web experiences – at least the marketing punch. When we saw the designs from m/m (paris), we got really excited. The mission: make it in ‘html5′ and it had to play nice on the iPad and iPhone. We knew this was going to be one of the most challenging projects we had worked on to date.
(more…)
_Posted in Canvas, Category==Null, HTML5, Javascript
by Mark
Recently we were engaged by a company in the UK and some designers based out of Paris, to bring a 3D model designed in Google SketchUp to life online. This would hardly be noteworthy had we been allowed to use Flash to deliver an interactive experience. But for this project, we were specifically tasked to use HTML5 friendly techniques. Thank you Mr. Jobs. Unfortunately, we can’t share any links at this time but we promise we will share once we launch. So what happens when you try to draw 8000+ lines on a canvas?
...snapshot of the "constellation" of lines and 'spheres'
_Posted in Canvas, Category==Null, HTML5
_Tagged canvas3d, google sketchup, jam3d
by Nick
Well, not really, but i figured with all the HTML5 and Canvas hype i might as well give it a go. So i decided to port the pseudo 3D application i wrote for www.stemcellcharter.org. Turns out canvas is pretty cool, and it runs pretty well to boot, well, at least on webkit browsers. It runs pretty well on Firefox too, but you can see it stutter every once in a while.
If you want to see the actual page, Click here to get a taste.
I will definitely be looking into the canvas a bit more, but like Mikko said, i don’t think this is the “Flash Killer” just yet. But hey, I’ve got no problem experimenting with it. Its a nice break from Flash anyways.
What to build next…
by Mikko
Last night I decided it was time to take a break from the Voxel Engine and work on the Voxel Engine. HEH…
I know that makes no sense but basically I started thinking with all this hype around HTML5 and Canvas I better try to build something in HTML5 and Canvas in order to know what it’s all about. With HTML5 and Canvas being touted as the “Flash Killer” I decided to try and see if it was possible to build the Voxel Engine using Javascript and the Canvas tag.
Here is a short video of the Javascript Canvas based Voxel Engine running in Safari:
You can see it in action by clicking below.
However we recommend that you use Safari or Google Chrome:
Click Here To See It in Action
This was an interesting experiment but from this I can say that right now HTML5 and Canvas is NOT yet the “Flash Killer” it’s being touted as. The performance on this experiment is quite a bit lower than what Flash can produce. I mean it doesn’t even run in Firefox, and this is the core of the problem with HTML and Javascript for years, browsers just aren’t built the same.
_Posted in Canvas, HTML5, R&D, Radiohead, Voxel Engine