Drag and drop behaviour for the Layout Customizer

[Daphne Ogle]

Does anyone know where the user testing results for the layout  
customizer are?  There doesn't seem to be a link off the main page for  
the component and I haven't had luck with search (probably don't know  
what terms to use).

Thanks!

-Daphne

On Apr 16, 2008, at 3:33 PM, Colin Clark wrote:

> Hello designers,
>
> We've been doing a lot of review and testing of the Layout Customizer
> component in preparation for the Fluid Infusion 0.3 release. One of
> the things we've been thinking about is the behaviour of drag and drop
> in this component.
>
> A couple of months ago, Gary and Shaw-Han did a great job of putting
> together some detailed mockups. They're available at:
>
> http://wiki.fluidproject.org/display/fluid/Portlet+Reorderer+Mockups
>
> If you notice, these mockups specify an approach that is very similar
> to myYahoo's news portal, available at http://cm.my.yahoo.com/. The
> noteworthy features of this approach are:
>
>  * the use of a small drag "avatar" (the thing that follows your
> mouse during a drag operation)
>  * a coloured, horizontal bar representing the drop target (the spot
> where the thing will land when you let go of the mouse)
>
> Another approach to drag and drop layouts is documented in the Fluid
> design pattern for Layout Preview:
>
> http://wiki.fluidproject.org/display/fluid/Drag+and+Drop+-+Layout+Preview
>
> This approach is similar to iGoogle, http://www.google.com/ig.
> Noteworthy features include:
>
>  * the use of a full-sized, transparent drag avatar that shows the
> whole portlet
>  * a full-sized outlined box for the drop target
>  * other portlets on the page shift out of the way to show a
> realistic preview of how the layout will look
>
> What's the best approach? I'm thinking this is one of those "it
> depends" questions. When portlets are similar in size and closely
> spaced, the myYahoo approach is probably simpler and easier to
> control. When portlets are more widely spaced and may have different
> sizes, a full preview of the layout seems more useful.
>
> At the time of the original designs, it's my understanding that we
> went with the myYahoo-style interaction because it was immediately
> similar to some existing code we have in the Reorderer. On the other
> hand, the Reorderer is highly customizable. The dev team tells me that
> implementing both behaviours should be relatively straightforward. It
> may impact our release date a bit, but should we consider taking the
> time to provide an option that will allow for the iGoogle-style of
> preview?
>
> I'd really appreciate opinions and advice from designers in the
> community.
>
> Colin
>
> ---
> Colin Clark
> Technical Lead, Fluid Project
> Adaptive Technology Resource Centre, University of Toronto
> http://fluidproject.org
>
> _______________________________________________
> fluid-work mailing list
> fluid-work at fluidproject.org
> http://fluidproject.org/mailman/listinfo/fluid-work

Daphne Ogle
Senior Interaction Designer
University of California, Berkeley
Educational Technology Services
daphne at media.berkeley.edu
cell (510)847-0308