Prototype+Stage

 =Contextualization= Index | Envision | Phase 2: Prototyping | User Testing | Refined Prototype toc

__[|Moo.com]__
Our inspiration for a drag-and-drop box comparison bar came from [|Moo.com]

__[|Explorer.quiltstudy.org]__
This website also has a "My Collections" panel, that similarly expands/collapses. It is not, however, drag-and-droppable; but uses buttons to add to the collection.

__[|Yahoo Pipes]__
Pipes is a powerful composition tool to aggregate, manipulate, and mashup content from around the web.

__[|Interface Elements]__
Downloadable code

Back to Top ^

Functions
>
 * Resources**
 * Drag and drop (and replace) - [|Drag] [|Droppable]
 * context bar (aligned bottom) - [|Sticky Footer]
 * pop-up bubble with info - (Annmarie has code for this)
 * home page's wall of images (randomize) - [|Image Reveal]
 * accordion (timelines)
 * main menu (align left)
 * categories pull out animation
 * contextualizer (attach metadata to images and find similarities) - [|Expandable widget] [|Accordion] [|Accordion 2]
 * Search - [|Autocomplete]
 * [|Breadcrumbs]


 * Functions by section**

Home
 * random image generated + reveal or enlarge on rollover
 * pop up bubble for information on rollover
 * menu + animation (i.e. categories = multiple selection of categories)
 * autocomplete for search field

Search results
 * Results (Image + information = draggable to compare box)
 * Display modes (thumbnail mode, thumbnail + information as list)
 * Highlights element on rollover, draggable

Artist Bio
 * Related artists (as thumbnails) / related artworks
 * Timeline (expandable on rollover/onclick + draggable)
 * Artist photo + information

Artwork - Detailed
 * Related artists (as thumbnails) / related artworks
 * Dublin core (metadata)
 * Context (keywords + a bit of information on cultural relevance, social, etc. = link to Search results:keyword); could be expandable.
 * Artwork photo draggable

Compare / Save Box (at the bottom)
 * Autohide, expand on rollover
 * Compare button that would expand over the screen
 * Save button (if not logged in, will take you to a Register page; otherwise, you won't be allowed to save)
 * If dragged out the area, will delete/remove the photo from the box; or, "X" button

Compare / Save Box Expanded
 * Context (keywords + a bit of information on cultural relevance, social, etc. = link to Search results:keyword); could be expandable.
 * Items would be draggable, with an "X" button to remove
 * 2 artworks
 * 1 artwork + 1 timeline
 * 2 timelines
 * 3 artworks

Back to Top ^

Prototype Development
[|Version A] [|Version B] [|Version C]





Back to Top ^