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.

Sunday 22 August 2010

ID Cards

Germany is introducing new ID cards with embedded RFID. This being the case and despite the current UK government having cancelled plans for such cards here, I have decided to discuss my thoughts on the issue.

I have, in a small way, helped to campaign against the identity cards proposed by Tony Blair's New Labour government.

I am not against ID cards per se.

Like many enlightened Britons I had particular reasons to oppose the proposed system, partly practical and partly political. The political reasons boil down to the government's misrepresentation ( in my opinion ) of the use of identity cards; there were claims that they would help to combat terrorism.

Those claims were nonsense. Terrorists do not operate by publicly declaring their status as such so unless there were a foolproof way to identify persons with violent intent, then they could not be singled out by identity. If the idea was that persons without ID cards should be treated as terrorists then that ceases to recognise the proportion who are citizens of the countries they attack.

That is the surface of my political objection but the practical matter is somewhat more straight forward, if broader. First was the cost; it was projected that setting up the system would cost a frankly absurdly large amount, money which could be better spent funding the NHS, education, social services and so on. Not only would the taxpayer have to foot the bill for this, but we were then to pay, personally, for our compulsory ID cards. Both taxes and a personal fee to fund an unpopular innovation.

Supposing that the system had been implemented, I always wondered how much extra paperwork it would create for the police, given the trend for bureaucratic red tape over the last decade or so. While the German government claims that their system "allows German authorities to identify people with speed and accuracy," a claim upon which I do not feel able to comment, in the UK I think the opposite would have been true.

Leaving out various other concerns that I had, I come now to the problem which I saw in the system proposed here which is clearly shared by the German system: RFID.

I recognise that opinions on the security risks posed by RFID are divided, but when it comes to matters of personal security and the modern threat of identity theft I prefer to take a cautious line. I see no reason to assume that some enterprising crook would not be able to copy RFID data verbatim, which is a clear risk.

Assuming that the RFID signal is used as a key to access a database, as I believe is the usual implementation, then stealing someone's identity becomes as simple as copying their RFID tag to your own. It would take alert authorities to ensure against this, no matter how much biometric data was included, because humans become complacent when repeating the same task many times — that has been proven in credit card fraud.

If the fraudster targeted people displaying certain features, such as particular hair and eye colour or the general shape of the face, then many of the biometric details become useless. Meanwhile they carry allegedly indisputable proof that they are who they claim to be, endangering the reputation, wealth and livelihood of the victim.

As I say, I am not against carrying some form of paperwork for identification, any more than I object to carrying a passport when I travel or a license when I drive. I object instead to poor, needlessly expensive and unwise implementations.

I don't even mind the idea of an ID card that carries a key to a database, but I do object to that datum being broadcast by radio, no matter how low powered. If an ID card must carry such a key then I would suggest two simple security measures. First, require either manual reproduction ( i.e. a printed ID number ) or direct interface to a chip with no RF output. Second, require that the user provide a PIN to be checked against that database.

No system will ever be foolproof or impregnable, but authorities should take every possible measure to prevent their innovations from endangering their citizens. RFID ID cards can not be said to fulfil that.

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.

div #box1 {
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>
...

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;
}

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 #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;
}

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.

A blog at last

I've decided to start a blog, at long last.  Nothing extravagant, but just somewhere to share my rambling thoughts with anyone who cares to stop by.

Of course in the past I've had journals and other such things, but these were youthful fads. This might, I think, last longer and serve as a platform to share more interesting material than those journals ever contained.

Topics covered may become quite broad, ranging from my casual interests to matters that I consider professionally relevant.  I may at times become philosophical, as is my wont, so I hope I will be excused that and other flights of fancy.

Welcome, readers and friends, to my blog.