Affinity Software: Geoff Davis. Middlesex University Masters in Electronic Arts 2003

Research work for MA by Geoff Davis, London. This is a site explaining the working software, which was written in Flash Actionscript. It went to around 8000 lines of code.

Back to Geoff Davis org website

What is the software?

A zoomable interface that uses two levels of access to a collection of text and image files. One level is for grouping, rearranging, and sequencing (slide show) files. The second level is for examination of content, with pan and zoom. There are navigation tools to allow orientation.

This is a demonstration or prototype version only, and was the result of research into interfaces, particularly ZUIs (Zoomable User Interfaces) and, from a content angle, non-linear narrative. See also on request the dissertations on Interface Design and Non-linear Narrative.

Level One (zoomed out)

  • This is the initial level, and shows small versions of the content (or indicative icons)
  • Controls: there is a set of controls at the top of the screen, a radar at top left, and a help text area that can be hidden if the user doesn't want it. The image title or help also appear in a top text line. The help is context (position) controlled.
  • Grouping by dragging
  • Item/images can be selected and deselected (colour spots are added onscreen), in various independent or overlapping groups, this allows automatic 'stacking' (grouping) of images
  • Images can be shown/hidden (faded out) to remove them from the scene



Control panel at top (can be hidden), with Radar




Level Two (zoomed in)

  • A double click leads to a zoomed in level, with scaling to zoom in more, or zoom out
  • Pan action when the user moves the cursor towards the edge of the screen, which allows the user to move to other content that is offscreen
  • Radar has a red dot showing which image was double clicked - the 'entry point' for orientation
  • Green 'scope' box that shows where the user has moved to by panning the screen.
  • These two features allow location within the zoomed in area
  • Scale feature to allow more zooming (magnification) or less (shrinking). There is also a reset scale feature to get back to the original scale

Initial zoom scale and controls:

     
Radar - red start point, green location scope
 
 
 
 
 
 
Help - Hide/Show
 
 
 
 
 
 
Scale - zoom in/out/reset
Increased zoom scale:




In more detail: Grouping (Level One, zoomed out):

There is different functionality at each level. Level One is for seeing all of the content items, and grouping them. This can be achieved by:
  • dragging the small images around the screen
  • using the colour spot feature to add a spot (red, green or blue, or combinations) to the images. These can then be automatically grouped or 'stacked' by the system
  • saving and naming of screen arrangements
  • randomise, which moves the images around - useful for stimulating unexpected connections, and for use in the Calm as a Dead Clam example (see below), to make a letter game
  • sequencing, which does a slide show of the images, arranged according to their position from top left to bottom right of the screen, in 70 pixel rows. The sequencing can also be colour spot selected - so some images could have a red spot added, then only these used in the sequence (note this is a new feature and is only on the 'Calm as a Dead Clam' example)
Colour spots (Level One, zoomed out)

These are the least obvious feature. By using the Shift, Ctrl and Alt keys on the bottom left of the computer keyboard, whilst pressing the mouse button on an image, a colour spot can be added to the image (red, green and blue respectively). Then there are controls to allow stacking of colours (including combinations), and also a Show/Hide control that fades out any coloured images.

From the Calm as a Dead Clam example:

Red spots added (to all the vowels) with Shift + mouse press - also note a red tick in box at top left (small):



Red spots stacked:



Red spots faded - note the red tick has turned to a red cross to indicate hidden images (faded).
This is also the clickable switch toggle area to show or hide (fade) the images:




Examples

The zoomed photographic and plan images above are from the Architect version - this is a portfolio of images and notes from a recent job in Malaysia. It shows how the software could be used for presentations. It is envisaged that the work would be presented to the client, who could then examine and group the images into a more specific arrangement. The software could be 'left behind' with the client as a reference (although this is not often done by architects due to liability and intellectual copyright issues). It could be used by designers or anyone 'pitching' for a job. Since images can be zoomed, anything of interest to a prospective client can be examined in more detail than others.

There is also Calm as a Dead Clam.




This does not use smaller images at Level One, but icons, which are letters. These letters jump to short pieces of text from various stories that have been published over the years. This is an attempt to fuse a letter game approach to making up words and phrases at Level One, with a 'hyper-fictional' non-narrative approach to reading the various texts when zoomed in at Level Two.

Rather than invent a new text, and chop it up into paragraphs for use on Level Two, I used paragraphs from old stories. Since they were all written by me, there may (or may not) be some narrative sense to be made of their proximity when read in Level Two.



Zoomed out within Level Two to see the position of other texts:



Sequencer

There is also a Sequencer (top left in controls) which does a slide show of the texts. This is a bit clunky but always returns to Level One. It can be used to slide show colour spotted images - so some images could be spotted green, then only these sequenced. The grey control is for the left-over images if colour spotting is used.

Animals

This is an educational example using pictures of birds, frogs, cats and fish. Informative text is shown when zoomed in. This can be used by teachers to set information search projects, as well as testing grouping knowledge.

Red, green and blue spots stacked:



Zoomed in at level 2:



Fully zoomed in at level 2:



Sequencer (pause/stop/loop control):



References:

Architect: Ivy Ngeow Architects

Fiction used in these examples: Geoff Davis (G P Davis)

Bubble World (novella) was published in three parts in:
Em One (anthology 1997, ed. Karl Sinfield, with Hanif Kureishi, Steve Aylett), Em Two 1998, Em Three: (Em Publishing);

African Story (short story)
PEN New Fiction Vol. 1 (anthology, ed. Peter Ackroyd with Ben Okri, Iain Sinclair) published by Quartet in UK and USA;

Nnn Goes Mobile (novel)
Published by Juma Publishing 1994 reprinted 1995;
This was published with ParisieNnn multimedia.
The multimedia was also on the UK Arts Council Hub site.

top