[Sigia-l] web 2.0 interaction design pattern library

[Jay Morgan]

Paola,

I think Yahoo! has already provided what you're looking for.  As an example,
what you collected in the "/ajaz/edit-text-flick.gif" link below is already
a published pattern on the Y!PL:
http://developer.yahoo.com/ypatterns/pattern.php?pattern=tooltipinvitation
It's called ToolTip Invitation.

Then, what you put in "/ajax/page-layout-drag-and-drop-ning.gif" is already
published in the Y!PL:
http://developer.yahoo.com/ypatterns/pattern.php?pattern=dragdropmodules#
It's called Drag and Drop Modules.

I hope this saves you duplicating work.  Or, is there something missing from
those patterns that you want?  I mean, they even show you animated examples!

Plus, you can use the Grid Builder and the YUI Library to make animated
prototypes.  YUI gives you code for the patterns.  Grid Builder lets you
layout pages (in grid format) and drop the pattern code into a section on
that grid.
Grid Builder: http://developer.yahoo.com/yui/grids/builder/
YUI Library: http://developer.yahoo.com/yui/

Hope this helps and saves you time.
- Jay

On 8/16/07, Paola Kathuria <paola at limov.com> wrote:
>
> [ajax interaction design pattern library]
>
> I've made screen-shots of two examples but have since found
> some sites that might prove fruitful.
>
> 1) edit a heading (text) in-page
> - mouse pointer over text changes b/g colour (Yahoo uses yellow)
> - mouse-over shows hint
> - click to get input box with save/cancel buttons
>
> http://www.paolability.com/share/ajax/edit-text-flickr.gif
> http://www.paolability.com/share/ajax/edit-text-yahoo-pipes.gif
>
>


-- 
Jay Morgan
Applied cognitive scientist practicing information architecture, interaction
design, and corporate culture manipulation