Thesis Update!

It's been a busy past few weeks, getting familiar with the prototype and scriptaculous javascript framework but it has paid off. Been looking into user interface design where there can be more interaction with the user.

What I've been trying to do is to try and simulate a 'desk' environment, where you would normally use your hands to move things around depending on what you want to do. What that means is to make things draggable, collapsible, expandable etc.

As you can see below, I've added drop down menus for menu selection. I've also made the right hand navigation bar draggable, as well as the main content in the middle. Can't really see it from a picture I guess. The main content and navigation bars are also expandable and collapsible.
I've also rethought the design of performing actions that does not require a lot of data loading. In other words, utilizing AJAX to perform actions without really leaving the page which means no refresh.

Created a hovering div that disables the content below, and displays the content above it depending on what type of action it is. I used scriptaculous' effects (Fade and Switchoff) to display and close the hover div.

I've only tested this on a Firefox environment as the browser has great plugin tools (Firebug) which makes debugging JavaScript, HTML and CSS a walk in the park.





Over the next couple of weeks I plan to add drag & drop features which will allow more user interaction by using the mouse which in return, simulates using a hand to do stuff. Hopefully there will be minimal user input where it isn't necessary.

Hopefully I'll have the chance to post up how I did all these things soon.