Via slashdot I found an article, one of many, panning 3D TV. Of course I can understand the widespread disdain for the technology, as I've previously alluded it is used today as a gimmick. In many ways its current implementation, no matter how advanced the underlying technology (such as IMAX and realD), is no better than the use of the red-and-green '3D' of old.
But I've had a taste of what it can really do. I refer, as I have before, to watching an IMAX film in the science museum that took us to space. One of the aspects that has stuck with me ever since was the reality of the faces on that screen.
I don't care about seeing launch debris race toward me. I am aware that placing my hand in the astronaut's glove was essentially a gimmick. But those faces were important.
When I look at the face of someone standing in front of me I can see the prominence of their nose, the rise of their cheekbones, their brow ridge and socketed eyes. When I looked at the face of an astronaut in that film I could see all of those details.
These are not the shadow plays of old or the paper dolls seen in poorly made modern 3D. These are not dioramic layers or retro magic eye pictures. These are true, deep, rich stereoscopic images.
Enough evangelism, what matters is what this can be used for. I believe that properly produced 3D content could be important for both education and art, two of the most important measures of any culture.
Education begins as soon as we are born, if not sooner. Early in life, once vision has sharpened enough, visual information can be as important as aural and tactile tuition. I recall when my first nephew was younger, watching television programmes and videos made for infants.
Many of these used puppets; these were often brightly coloured with clear, bold shapes and set against a black background. If I remember rightly, from my sisters explanation of her research, this was because young children respond better to visibly real objects (puppets) and greater clarity (contrast, brightness). This was all, of course, on a 2D screen, but consider the advantages offered by 3D.
Those puppets would then appear to really be there, to be tangible objects with real geometry, helping a child's brain to process deeper visual input. They need not use the gimmickry of projecting toward the infant's head, rather they would be better rendered as though on the far side of the screen to complete the illusion. I feel sure that this would have benefit.
Then consider the continued education of growing children. I recall when I was young, being fascinated by images of a kingfisher with its colourful plumage and undeniable grace. How much richer would such an experience and memory be, had I been able to see that bird in its full, three-dimensional form?
By presenting to our children images of such detail we could help them to learn about nature, its structures and wonder. It could have potential for the teaching of geometry, of chemical structures, architecture and more. We could show them great sculptures from around the world.
This leads me to my other point, that of art. If we wish to introduce our children, or ourselves, to great sculpture we must travel for hours to view them. Of course, viewing such works in person will always be the best way, but many people have not the time nor other resources to take these trips. We could at least better see them in our home than today.
But television today relatively seldom shows us paintings. Rather, the medium lends itself to a different sort of art, a modernisation of the traditional theatre play. Players strut and fret their hour upon the stage behind that screen, the camera able to show us nuances of performance that had never been visible to a theatre audience. How much richer might that become, should they appear to stand before us?
Of course the medium would take some time to come to terms with its new aspect. Film makers would have to learn that such depth of view should be as natural an aspect of their work as colour and sound are today. But once this state is reached, what art may be produced!
I must admit that today's detractors rightly point out the primitive implementation of 3D displays today — the need for glasses, the poor image quality, such issues as these — but in time these limitations will be overcome. Once they are, how rich might the medium become.
Showing posts with label 3d. Show all posts
Showing posts with label 3d. Show all posts
Sunday, 5 September 2010
Friday, 27 August 2010
3D graphics on the web!
My first post in this blog was about the potential for HTML/CSS to adopt three-dimensional attributes, but there is another related technology that I didn't go into. It begins with part of the HTML5 standard; the Canvas element.
The HTML5 canvas element is a fascinating feature of the new standard. With a little knowledge and some further study the element makes it possible to use JavaScript to draw bitmap images directly — and dynamically — in the browser window. It lacks some of the niceties of vector graphics, such as the ability to draw an object once and then make changes without manually re-drawing, but it is a powerful tool.
In order to use the canvas element one must refer to its two-dimensional context. There are lots of code examples around if you want to see how that's done, suffice to say that it is simple. Having a variable to point to that 2D context it is then possible to draw primitives, pre-defined images, gradients and paths, among other uses of the canvas. Paths will sound familiar to any creator of vector graphics but their canvas implementation is more similar to that in image editors such as the GIMP.
That's all fine and dandy and certainly, with clever enough scripting, this 2D context could be used to simulate 3D graphics. Unfortunately it would take script clever indeed and would place a considerable drain on the CPU. I've no doubt that these considerations were among those that motivated a new open standard, WebGL.
This is a remarkable API, based on the OpenGL ES 2.0 specification. Khronos, with members including Opera, Mozilla, Google and Apple, are developing this as an open standard for use with the HTML5 canvas element. It's accessed in the same way as the original 2D context, but what it does is genuinely impressive.
Browsers supporting WebGL (development versions of those from the previously mentioned vendors) use hardware acceleration (the user's video card) to render 3D graphics using the popular OpenGL library.
The results are frankly staggering. Full-3D graphics rendered in real time in the browser, seamlessly integrated into perfectly normal web pages! I can't possibly do it justice in writing, so take a look at the WebGL wiki for instructions and see for yourself! If you don't fancy trying a development version of a browser you could look up videos on YouTube and such.
This is certainly not the sort of 3D that I was talking about in my earlier blog entry, but it's an amazing thing. Using this new context seems to involve quite a learning curve, but the possibilities will surely make it worth the effort for some.
The HTML5 canvas element is a fascinating feature of the new standard. With a little knowledge and some further study the element makes it possible to use JavaScript to draw bitmap images directly — and dynamically — in the browser window. It lacks some of the niceties of vector graphics, such as the ability to draw an object once and then make changes without manually re-drawing, but it is a powerful tool.
In order to use the canvas element one must refer to its two-dimensional context. There are lots of code examples around if you want to see how that's done, suffice to say that it is simple. Having a variable to point to that 2D context it is then possible to draw primitives, pre-defined images, gradients and paths, among other uses of the canvas. Paths will sound familiar to any creator of vector graphics but their canvas implementation is more similar to that in image editors such as the GIMP.
That's all fine and dandy and certainly, with clever enough scripting, this 2D context could be used to simulate 3D graphics. Unfortunately it would take script clever indeed and would place a considerable drain on the CPU. I've no doubt that these considerations were among those that motivated a new open standard, WebGL.
This is a remarkable API, based on the OpenGL ES 2.0 specification. Khronos, with members including Opera, Mozilla, Google and Apple, are developing this as an open standard for use with the HTML5 canvas element. It's accessed in the same way as the original 2D context, but what it does is genuinely impressive.
Browsers supporting WebGL (development versions of those from the previously mentioned vendors) use hardware acceleration (the user's video card) to render 3D graphics using the popular OpenGL library.
The results are frankly staggering. Full-3D graphics rendered in real time in the browser, seamlessly integrated into perfectly normal web pages! I can't possibly do it justice in writing, so take a look at the WebGL wiki for instructions and see for yourself! If you don't fancy trying a development version of a browser you could look up videos on YouTube and such.
This is certainly not the sort of 3D that I was talking about in my earlier blog entry, but it's an amazing thing. Using this new context seems to involve quite a learning curve, but the possibilities will surely make it worth the effort for some.
Wednesday, 18 August 2010
3D HTML?
It's 2010 CE and 3D is the big gimmick of the year: IMAX and realD in cinemas, nVidia's 3D Vision kit, fascinating prototypes for true-3D displays and even 3D posters! It may be a passing fad, or it may be a rumble foreshadowing the avalanche to come ( albeit years from now ).
I have dreamt since childhood of the kind of immersive 3D technology that I saw in Star Trek's holodeck. Of course I don't believe any such thing is around the corner, but I can not deny the power of today's three-dimensional technology: I sat in the IMAX theatre at London's science museum and placed my hand in a spacesuit glove, felt fleetingly as though I were really there. Since then I have believed that 3D displays must become the norm, perhaps in my lifetime.
It's 2010 CE and HTML5 — although not yet finalised — is on the minds of web developers around the globe. I count myself among their number, the actual state of my career notwithstanding, and have been studying the current documentation with gusto.
Inevitably the changeability of the web is prominent in my thoughts at this time. There are conflicts between supporters of Flash and of the HTML5 proposals; meanwhile GPU hardware acceleration is coming to web browsers!
The innovations in these areas — 3D displays and improved web technologies — seem to have little or no crossover. But I feel ( and a brief Google reveals that I'm not entirely alone in this ) that there is room for synergy here.
Since its creation HTML has been designed for and rendered on two-dimensional displays, the only practical technology of the time, but part of this looks set to change. As 3D displays become available and, eventually, commonplace these 2D rendered documents will be thrown onto a virtual surface by display managers of the era. That's fine as far as it goes, but if no alternative is made available then I believe there will be much frustration not only for developers but users ( or consumers ) as well.
I'm going to discuss briefly where web design has been and where it might be going. Then I'll cover a little of the possible technical detail of what I'd like to see.
In the beginning HTML was a simple beast, a mechanism to tag ( or "mark up" ) parts of text on the internet ( "hypertext" ). This HyperText Markup Language included elements such as headings, paragraphs, tables and, most significantly, hyper-links. This was a pivotal moment in the history of IT, the creation of a clear way for users to navigate the internet through what would come to be known as the World Wide Web.
Time passed, use and expectations from users grew, so HTML and related standards changed and grew. We're now well accustomed to richly formatted web pages using complex styling ( through Cascading Style Sheets ), which improved designers' control over font sizes and element positions. Many people now regularly view video online, which would scarcely have been conceivable when HTML began.
HTML5 promises closer integration of multimedia content, greater flexibility of display and even integration with low-level keyboard input. These are all nice embellishments to an established technology, but are the standards developers missing a trick?
All of these impressive developments have been, as I mentioned earlier, two-dimensional. We have greater control than ever over the layout of our documents, but almost all of that control is exercised on the X and Y axes. There is also the z-index property accessible through CSS, but this is no more than a layering facility to ensure that various objects don't obscure each other.
As well as relative position we can, of course, specify the height and width of various display elements. But what we can not, yet, define is a depth. Of course this is only natural, as objects in HTML have never had a depth any more than images printed on a piece of paper.
Now imagine that you have a simple layout in HTML4 and CSS2, with two content boxes. The first box, 300px square, is positioned at 0px,0px. The second box, 150px square, is positioned at 250px,250px. One box overlaps the other; if we give the first box a z-index of 1 and the second a z-index of 2, then the smaller box is displayed in front of the larger.
Imagine that this basic layout is displayed on one of the upcoming 3D monitors, in a 3D window manager not unlike KWin4 or Compiz. We may see a browser window standing proud of the desktop, with a completely flat page displayed therein. Now let's take a step forward in this imaginary interface.
Keeping things simple, the first z-index will still be 1 and the second z-index will now be 20. Assume that the web browser is no longer a simple 2D display, but has its own 3D display capabilities. Now we have two completely 2D boxes, but one hangs slightly in front of the other; as the user looks from one box to the other, his eyes focus slightly differently and he gains a sense of depth. In this implementation we have the cardboard-cut out style of 3D familiar to anyone who has used the red-and-green spectacles of old.
What I've outlined so far is perfectly achievable with current standards, but it's not very interesting. But by now I think you can see where I'm going with this.
Imagine that our display elements have instead the proportional properties of width, height and depth. Now z-index has a whole new meaning, because our display elements can have an actual presence on the Z axis. 3D solids, positioned in 3D space. Let's go back to our CSS example, with some new properties:
Here a minimal change to existing standards, with the addition of two properties and the alteration of another, allows two solid boxes to hover before the user's eyes on their fancy 3D display, intersecting each other in an interesting way. This simple implementation has the additional benefit of being more or less backwards compatible, as it would still work on a 2D display. If z-index were assumed to be in the same unit as the last specified coordinate it would make backwards compatibility even smoother ( z-index: 250; instead of z-index: 250px; because the unit would be implicit ).
Nice, yes? But ultimately unsatisfying, perhaps. I see two solutions: add more minor improvements, or create a whole new approach. First, a possible minor addition to what we have here.
Here I'm suggesting that the new box models include extra parameters, so that content from elsewhere ( here, a pair of paragraphs ) can be placed by compliant browsers onto the appropriate faces of the 3D objects. They have no independent existence in a 3D context, but could still be separately displayed in a 2D context. What's more, user agents not supporting 3D can safely drop the new declarations.
I feel that this provides a good intermediate state between what we have today and what we might achieve in a future where 3D displays and user interfaces are commonplace and well understood. I'm tempted to discuss ideas I've had for a more comprehensive 3D adaptation of HTML, but perhaps that should wait for another post.
Coming back to the present then, I know that what I've outlined here is not likely to see implementation. Perhaps ( almost certainly ) we shall see something conceptually similar in years to come, but unless we start discussing the options now we'll have a lot to figure out when the time comes.
HTML5 isn't expected to be finalised for a few years yet and it's still fairly malleable. I don't expect to see wholesale change at this point, or particularly sweeping additions, but the process of adding, removing and reworking various elements is still ongoing. This is true not just of HTML5's elements and properties, but also of CSS3. The truth is that coming standards are much in flux at this time.
Even if the new standard doesn't end up including much in the way of 3D capabilities, I hope that we will at least gain a 3D context for the canvas element. It would be a useful start and show that the web is as forward looking today as it was at its inception.
I have dreamt since childhood of the kind of immersive 3D technology that I saw in Star Trek's holodeck. Of course I don't believe any such thing is around the corner, but I can not deny the power of today's three-dimensional technology: I sat in the IMAX theatre at London's science museum and placed my hand in a spacesuit glove, felt fleetingly as though I were really there. Since then I have believed that 3D displays must become the norm, perhaps in my lifetime.
It's 2010 CE and HTML5 — although not yet finalised — is on the minds of web developers around the globe. I count myself among their number, the actual state of my career notwithstanding, and have been studying the current documentation with gusto.
Inevitably the changeability of the web is prominent in my thoughts at this time. There are conflicts between supporters of Flash and of the HTML5 proposals; meanwhile GPU hardware acceleration is coming to web browsers!
The innovations in these areas — 3D displays and improved web technologies — seem to have little or no crossover. But I feel ( and a brief Google reveals that I'm not entirely alone in this ) that there is room for synergy here.
Since its creation HTML has been designed for and rendered on two-dimensional displays, the only practical technology of the time, but part of this looks set to change. As 3D displays become available and, eventually, commonplace these 2D rendered documents will be thrown onto a virtual surface by display managers of the era. That's fine as far as it goes, but if no alternative is made available then I believe there will be much frustration not only for developers but users ( or consumers ) as well.
I'm going to discuss briefly where web design has been and where it might be going. Then I'll cover a little of the possible technical detail of what I'd like to see.
In the beginning HTML was a simple beast, a mechanism to tag ( or "mark up" ) parts of text on the internet ( "hypertext" ). This HyperText Markup Language included elements such as headings, paragraphs, tables and, most significantly, hyper-links. This was a pivotal moment in the history of IT, the creation of a clear way for users to navigate the internet through what would come to be known as the World Wide Web.
Time passed, use and expectations from users grew, so HTML and related standards changed and grew. We're now well accustomed to richly formatted web pages using complex styling ( through Cascading Style Sheets ), which improved designers' control over font sizes and element positions. Many people now regularly view video online, which would scarcely have been conceivable when HTML began.
HTML5 promises closer integration of multimedia content, greater flexibility of display and even integration with low-level keyboard input. These are all nice embellishments to an established technology, but are the standards developers missing a trick?
All of these impressive developments have been, as I mentioned earlier, two-dimensional. We have greater control than ever over the layout of our documents, but almost all of that control is exercised on the X and Y axes. There is also the z-index property accessible through CSS, but this is no more than a layering facility to ensure that various objects don't obscure each other.
As well as relative position we can, of course, specify the height and width of various display elements. But what we can not, yet, define is a depth. Of course this is only natural, as objects in HTML have never had a depth any more than images printed on a piece of paper.
Now imagine that you have a simple layout in HTML4 and CSS2, with two content boxes. The first box, 300px square, is positioned at 0px,0px. The second box, 150px square, is positioned at 250px,250px. One box overlaps the other; if we give the first box a z-index of 1 and the second a z-index of 2, then the smaller box is displayed in front of the larger.
div #box1 {
width: 300px;
height: 300px;
z-index: 1;
}
div #box2 {
position: absolute;
width: 150px;
height: 150px;
left: 250px;
top: 250px;
z-index: 2;
}
width: 300px;
height: 300px;
z-index: 1;
}
div #box2 {
position: absolute;
width: 150px;
height: 150px;
left: 250px;
top: 250px;
z-index: 2;
}
...
<div id="box1">Some content here.</div>
<div id="box2">Some more content.</div>
...
<div id="box1">Some content here.</div>
<div id="box2">Some more content.</div>
...
Imagine that this basic layout is displayed on one of the upcoming 3D monitors, in a 3D window manager not unlike KWin4 or Compiz. We may see a browser window standing proud of the desktop, with a completely flat page displayed therein. Now let's take a step forward in this imaginary interface.
Keeping things simple, the first z-index will still be 1 and the second z-index will now be 20. Assume that the web browser is no longer a simple 2D display, but has its own 3D display capabilities. Now we have two completely 2D boxes, but one hangs slightly in front of the other; as the user looks from one box to the other, his eyes focus slightly differently and he gains a sense of depth. In this implementation we have the cardboard-cut out style of 3D familiar to anyone who has used the red-and-green spectacles of old.
What I've outlined so far is perfectly achievable with current standards, but it's not very interesting. But by now I think you can see where I'm going with this.
Imagine that our display elements have instead the proportional properties of width, height and depth. Now z-index has a whole new meaning, because our display elements can have an actual presence on the Z axis. 3D solids, positioned in 3D space. Let's go back to our CSS example, with some new properties:
div #box1 {
width: 300px;
height: 300px;
depth: 300px;
z-index: 1;
}
div #box2 {
position: absolute;
width: 150px;
height: 150px;
depth: 150px;
left: 250px;
top: 250px;
z-index: 250px;
}
width: 300px;
height: 300px;
depth: 300px;
z-index: 1;
}
div #box2 {
position: absolute;
width: 150px;
height: 150px;
depth: 150px;
left: 250px;
top: 250px;
z-index: 250px;
}
Here a minimal change to existing standards, with the addition of two properties and the alteration of another, allows two solid boxes to hover before the user's eyes on their fancy 3D display, intersecting each other in an interesting way. This simple implementation has the additional benefit of being more or less backwards compatible, as it would still work on a 2D display. If z-index were assumed to be in the same unit as the last specified coordinate it would make backwards compatibility even smoother ( z-index: 250; instead of z-index: 250px; because the unit would be implicit ).
Nice, yes? But ultimately unsatisfying, perhaps. I see two solutions: add more minor improvements, or create a whole new approach. First, a possible minor addition to what we have here.
...
<div id="box1">Some content here.
<p id="para1">This goes on the upper face of the first box.</p>
</div>
<div id="box2">Some more content.
<p id="para2">This goes on the right face of the second, smaller box.</p>
</div>
...
<div id="box1">Some content here.
<p id="para1">This goes on the upper face of the first box.</p>
</div>
<div id="box2">Some more content.
<p id="para2">This goes on the right face of the second, smaller box.</p>
</div>
...
div #box1 {
width: 300px;
height: 300px;
depth: 300px;
z-index: 1;
top-face: #para1;
}
div #box2 {
position: absolute;
width: 150px;
height: 150px;
depth: 150px;
left: 250px;
top: 250px;
z-index: 250px;
right-face: #para2;
}
width: 300px;
height: 300px;
depth: 300px;
z-index: 1;
top-face: #para1;
}
div #box2 {
position: absolute;
width: 150px;
height: 150px;
depth: 150px;
left: 250px;
top: 250px;
z-index: 250px;
right-face: #para2;
}
Here I'm suggesting that the new box models include extra parameters, so that content from elsewhere ( here, a pair of paragraphs ) can be placed by compliant browsers onto the appropriate faces of the 3D objects. They have no independent existence in a 3D context, but could still be separately displayed in a 2D context. What's more, user agents not supporting 3D can safely drop the new declarations.
I feel that this provides a good intermediate state between what we have today and what we might achieve in a future where 3D displays and user interfaces are commonplace and well understood. I'm tempted to discuss ideas I've had for a more comprehensive 3D adaptation of HTML, but perhaps that should wait for another post.
Coming back to the present then, I know that what I've outlined here is not likely to see implementation. Perhaps ( almost certainly ) we shall see something conceptually similar in years to come, but unless we start discussing the options now we'll have a lot to figure out when the time comes.
HTML5 isn't expected to be finalised for a few years yet and it's still fairly malleable. I don't expect to see wholesale change at this point, or particularly sweeping additions, but the process of adding, removing and reworking various elements is still ongoing. This is true not just of HTML5's elements and properties, but also of CSS3. The truth is that coming standards are much in flux at this time.
Even if the new standard doesn't end up including much in the way of 3D capabilities, I hope that we will at least gain a 3D context for the canvas element. It would be a useful start and show that the web is as forward looking today as it was at its inception.
Subscribe to:
Posts (Atom)