Updated design for Grid Reorderer demo

Jonathan Hung jhung at ocad.ca
Tue Nov 30 01:10:45 UTC 2010

Hi everyone,

Attached to this email is an updated design for the Grid Reorderer Demo.
Between the existing Reorderer demo and this new design, no new functionally
is being introduced, and most of the changes are to provide a context of

This new design borrows from the dashboard metaphor and provides 9 different
information feeds arranged in a 3x3 grid. Each cell contains a title of the
type of information being displayed, and a small excerpt of information. For
example, one cell has the title "Social Network", and in the excerpt it
contains a status update similar to one you would find on Twitter or

Each of these 9 cells are reorderable using the mouse and keyboard.

Functionality that is missing from this demo, that I would like to
incorporate, is a custom event listener.Here are some ideas I've come up
with, but none of them are particularly compelling to me in this context:

1. A reorderable cell that simply counts the number of times items have
moved / reordered in the grid.
2. A status message area that displays instructional text as the user
performs an action (this can become annoying with frequent moves).
3. A cell that randomly generates an 8 character password each time it is

 I would like to invite you to share your ideas on how we can best
demonstrate a custom event listener for the grid reorderer.

See the attached image for a more detailed breakdown of the interaction.

Thoughts, ideas, suggestions are welcome.

- Jonathan.

Jonathan Hung / jhung at ocad.ca <jhung.utoronto at gmail.com>
IDRC - Interaction Designer / Researcher
Tel: (416) 977-6000 x3959
Fax: (416) 977-9844
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.idrc.ocad.ca/pipermail/fluid-work/attachments/20101129/621799f5/attachment.htm>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: grid-reorderer.png
Type: image/png
Size: 616311 bytes
Desc: not available
URL: <https://lists.idrc.ocad.ca/pipermail/fluid-work/attachments/20101129/621799f5/attachment.png>

More information about the fluid-work mailing list