Simon Fraser announces support for CSS 3D Transforms, on Mac OSX Leopard, in the latest Webkit nightlies.
Update: For those of you who aren’t lucky enough to have access to a mac, take a look at the video below for a preview of 3D Transform in action.
You can read the full article on the Webkit Blog.
You can skip to the end and leave a response.
That’s cool and all, but is it sensible? No wonder 3 is taking so goddamn long to come out!
OK, I managed to get my hands on a Mac and have uploaded a video of the preview in action. It’s a pretty nifty effect, but I have to agree with Tom as to its practicality, if anyone has any thoughts on how it could be used please feel free to share them. Luckily 3D Transforms isn’t seen as a high priority by the CSS3 working group at present, so it shouldn’t slow down the development of other modules.
I would like to clarify the difference between this and Canvas/Google’s O3D/Mozilla’s 3D efforts.
Canvas (and incidentally all 3D APIs as well) are semantically purposed for the dynamic generation of image data — not for building a UI, not for presenting markup. Dynamic images. That’s it.
CSS, on the other hand, IS for presentation of markup data, which 3D does fall under, just the same as shadows and, of course, 2D positioning. You wouldn’t use Canvas to give a textarea a shadow, or position it in your comments form, just like you wouldn’t use Canvas3D to give it a depth perspective.
Granted this is a cool effect, I’m with the others questioning the practicality of it. It seems like something that we’re going to see a whole lot of when it comes out because developers can. I, for one, am not looking forward to spinning & rotating menus and what not because we now have the ability to have spinning & rotating menus…
Sorry to dredge up an old thread, but IMHO, the practicality comes from being able to design a site that looks like this (admittedly crappy, quickly-thrown-together) mock-up of Yahoo!’s homepage:
A lot of information can be inferred by an element’s “depth”, relative to other sections of a page…
I am a little disappointed by some of the pessimism in the comments.
Guys, of course we will have teenage kids creating annoying pages with rotating menus. So what? A good designer will use the 3D features of CSS3 wisely and create user experiences like we have never seen on the Web. Not without using Flash anyway.
”In this demo appears the Demon Number three sixtys ” Haha, thats really funny – The video is nothing like what you show above; 3 lines of numbers with values of 4, 5, 6, 11 and 10 squeeze, narrow and rotate on there own line from independent starting points. So the numbers all rotate around three 6′s. This is a very weird decision from the Google brain who probably thought it a rather funny way of generating some extra interest.
What You Need To Know About Behavioral CSS « Upon a Star says:Comment » January 1st, 2011 at 11:52 am
[...] Webkit Announces Support for CSS 3D Transforms15 CSS3.info has a great demo of CSS 3 animations that are supported by the nightly build of WebKit. [...]