Dissertation Project

NDE Designs

Categories: Me Myself and I, Projects, university by Nick

As I mentioned before in my vague dissertation post last year I have to do a project related to my dissertation question as part of my Honours Degree at University. Can’t say this will be of much (if any) interest to anyone, but it’ll help me sort out my ideas (and actually write/type them out somewhere).

The Plan

Until recently I had a fairly vague idea of what I wanted to do for my project. I knew I had to tie it in with HTML5 and it’s interactive elements, but what could I do as a practical project? Considering that a lot of the HTML5 specification isn’t even supported by modern browsers yet the elements of HTML5 that I could use were rather limited. At this point in time there are only 3 elements in the HTML5 specification that I would consider “interactive” and are also have browser support, which is why I decided to structure my project around those elements. The elements in question are:

Native Audio and Video
Native Drag and Drop
The Canvas Tag

I decided that for my project I would use them all by creating an “application” for each of the items above. I will create the applications in both HTML5 and one other form (e.g. Flash, Silverlight or JavaScript).

The idea is to compare the new interactive elements of HTML5 to what is considered the best practice in web design today. This will hopefully give me an answer to my project question of whether or not HTML5′s interactive methods are a viable solution in web design today. I would expect that they aren’t due to the low rate of browser compatibility – but I’m sure that this will sort itself out by the time HTML5 is officially released.

The Applications

As said, I plan to create 6 applications; 2 for each subject, using two languages/methods.

Audio and Video

This should be relatively simple, all I plan to do is display a video and audio player on the page. Once in HTML5, and once using Flash or Silverlight (whichever I decide to use).

This one shouldn’t take me long to create, but should produce some pretty good things to compare.

Drag and Drop

This shouldn’t be too hard to work out how to do considering I have quite a few resources that I can go to which explain how to do it and will hopefully provide some support if I need it.

The drag and drop API is based on Microsoft’s original idea that was available as early as Internet Explorer 5, people just didn’t use it much as it wasn’t very good. Now they have enhanced it, making it much easier to implement.
The new HTML5 method doesn’t remove the need for JavaScript, it just makes it much easier to do and gives it extra functionality (e.g. dragging between pages).

I will also do this using the current method in JavaScript for me to compare against.

Canvas

This is the one that I think will take the most time (and cause the most headaches). As I am pretty much learning as I go with all of this (as it is brand new technology) I expect to run into problems with everything, especially doing something more complex (like this).

The idea is to create a “simple paint application” with a few tools to use (e.g. pencil, line, rectangle, circle, etc). For the HTML5 side of things I plan to follow this lovely tutorial from Opera Developer network I found moments ago, adapting it to add more “tools” and whatever else I can think of into it.

I also plan to create the same kind of application using Flash so I can compare the two. I’m not the biggest fan of flash, but it seems to be the best way to do this kind of application on the web at the moment – so I’ll be learning that as I go too…fun. We’ll see how it goes later when I start doing it.

I think that’s about all for this project. I have 13 weeks to do it, so we’ll see if I’ve given myself too much to do or not soon enough. Anyway, if there are any suggestions (or resources) that you can think of then please send them my way, it’d be appreciated!

NDE Designs