Visualizing the Overlay and Motion on its Larger Plane

[Brian Fleeger <brianfleeger yahoo com>]

Hi all,

I have been thinking about design and UI visualization issues and want to share some ideas.

pic#1: http://www.flickr.com/photos/26671354 N05/3334338024/sizes/o/in/photostream/
pic#2 (same as 1, but with white border on side-bar): http://www.flickr.com/photos/26671354 N05/3343610802/sizes/l/in/photostream/

It occured to me after seeing Sander's mockups that the shell really does exist on a giant plane which is larger than the user's screen.  When a user switches between the main Overlay and the two full screen modes, there is a sliding motion that has to be visualized.  But motion is best visualized when there are fixed points of reference against which to contrast.Because some elements of what the user sees do not move as the panel shifts (e.g. the top panel, parts of the UI, etc.), there has to be sufficient visual anchoring to create a sense of motion as the screen panel moves across the plane.  To achieve this, a plain black or gray field lacks anchoring references and is probably insufficient.  At the same time, there should be a balance between anchoring and visual over-stimulation.

A picture could provide visual anchoring by being a plane-spanning "meta-wallpaper," (based on the active Activity Space wallpaper?).  If Activity Spaces could have their own backgrounds, the "meta-wallpaper" could change based on which space was active when the overlay mode was entered. 

It would look cool if one could enable different slide-show wallpapers for each workspace, and see them transition in the Overlay.  (even more like the Brady Bunch opening)

Increasing the virtual "size" of a user's normal wallpaper may make the "meta-wallpaper" look pixilated or blurry, but Gaussian Blur + darkening/contrast reduction could resolve this issue, while also reducing visual clutter.

Additional semi-transparent "shadow fields" could maintain UI boundaries and making white text more visible.  Such fields could resemble the semitransparent UI in the "Boxee" media player, and could also be fixed to the plane, follow the camera and slide across the plane, or change shape as the panel moves to different positions on the plane. 

Some other "bling" thoughts I had included the active Activity Space could use a light colored "reverse halo" effect to differentiate it. Also, the specific window a user was using when s/he pressed the "Activities" button could stand out by darkening and reducing the contrast on the other windows (expose-style).  This would give a cognitive clue helping users return to that specific task quickly.

I also slightly played with the UI here, in that I added a "viewing modes" toggle at the bottom of the side panel.  I think it might be a good idea if users could manipulate the side panel using individual icons instead of *just* list view, if they want.  In icon mode, objects could be arranged on a grid, like a phone pad.

I look forward to any feedback -- Cheers!

-Brian

Referenced Material:
[1] Sander Dijkhuis' overlay changes mockup: http://student.science.uva.nl/~sqdh/gs-mockup/  and http://student.science.uva.nl/~sqdh/gs-mockup/2/screenshot.png
[2] Stephen Gentle's gnome shell concept: http://flickr.com/photos/90974384 N00/3276444810/