14 August 2008

First prototype

This is the first prototype of the carousel browser history system that we thought of. We hope to have a working demonstration in Flash soon. Yes, it's ugly! But remember that the final version will look better than this version which is only to demonstrate operation.

What happens when the history mechanism is initiated is that the current page (bottom right) zooms back and takes its place here in this line of pages. The line represents the history with pages further back being pages that were visited longer ago. The user can scroll through these pages using the up and down arrow keys. The down arrow key moves the pages down (ie, forwards in time) and vice versa for the up arrow key. Unneeded pages just scroll off the screen. Trying to scroll past the start or end of the list results in the end page vibrating to indicate reticence.

Clicking onto a page brings it to the front of the line so the user can see it in all detail. If the page is already on the front, then a single click loads it. Double clicking goes straight to the clicked-on page.

Why the curved line? Simply because it's continuous and more pages can be put in than with a straight line. Humans are more visual than literal so matching pages with known history is easier this way. The search box pops out whenever the user begins typing and matched are shown with striped red and white borders - this gives an immediate visual cue that should be visible even when people have poor vision. If the user then presses the enter or return key, the pages that don't match slide off the screen leaving the relevant pages. These then collate together into a new line. To go back, press escape or delete the search terms, and the new pages scroll back in. While the search is progressing, unsearched pages become greyed out a little while searched ones pop out.

The yellow star is a bookmark system. Bookmarked pages will have this yellow star attached and dragging the star onto a page bookmarks it. Dragging it off takes the bookmark away. Double clicking on the bookmark star removes all but bookmarked pages. I wonder if there is a way to show their organisation into folders?

I think that this system works because it allows a text-based search but also a visual search. Each page has its top left-hand corner shown which is where organisation logos are normally situated. Visual matching may well turn out to be faster and / or easier than a text search for many people, I would guess much more than looking through a list of page titles.

Plus with well-done animation, it would look quite good.

I was also toying with the idea of forming sets - the user could drag visited pages to a "pen" on the left hand side, and the pages would form a set. This would be useful when collating information. The user then only has to visit a ton of pages and then she can move the relevant pages to the pen and review or save them after the reading task has been done. For this type of task, this method appears to interfere less than saving each relevant page in an appropriate place. Plus of course, all items in a pen can be bookmarked in one go and even put into their own folder.
Post a Comment