g3-rprototype

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

Refined Prototype Development
This is an alternative method that we explored of making the Collections Panel visible. This however required about 25% of the page, and was going against our idea of emphasizing the work over the interface.

Prototype Functionality
Requirements for viewing:
 * Best viewed with Firefox 3
 * Javascript enabled

For the final refined prototype, here is a list of which areas function properly:


 * [|Homepage]**
 * Search field - Autocomplete works; It updates per character input (i.e. will have both "D**an**" and "D**an**ny" as a result when typed in "**an**"); It only returns select values (as the values were manually typed in the prototype; ideally, this should run a database search); This listens to Enter key, and should take you to the Results page on press.
 * Categories - Animation works on reveal. Acts as a filter system to narrow down search; Multiple entities can be selected (will be highlighted as selected, and added to a summary of selected items). Selection can be deselected by clicking on the entity again. Clicking the search button should take you to the Results page. (Note: The Results page is a mock-up and is not fully functional such that it won't return specifically what was searched. Treat as a template.)
 * Left-side Navigation - Art Community and Resources should reveal a submenu, but these (along with the rest of the navigation) will not be functional in the homepage for the prototype. Ideally, these should act as links which will take you to respective pages.
 * Images - Three images exhibit the ideal functionality. On hover, the image will expand (become larger, come to surface) and will also reveal more information in a pop-up/bubble form. When you click on the image, it should take you to the Artwork page. Ideally, all images on the homepage will expire and update to another random image making the homepage dynamic. Also, the expanding effect and the pop-up information on the bubble will apply to all images present. All images throughout the system (i.e. artwork photo/ thumbnail, artist photo/thumbnail, artist timeline) will be both clickable (i.e. should take you to the respective page related to the image) and drag-and-droppable to the Collections panel. Unfortunately, the drag and drop is not functional in the homepage for the prototype.


 * [|Results Page]**
 * Collections panel - Drag-and-drop of image thumbnails works. On drag-and-hold, the collections area should highlight to dark grey as a visual cue, and should return the total number of images dropped in the Collections panel ("2 Works" for example). You can remove images in the Collections panel either by clicking on the "X" icon on the dropped image, or by clicking on the "Clear All" button. The Collections panel cannot hold duplicates; it will blink to notify the user that the same image has already been dropped.
 * Categories - The animation/filtering functionality as seen on the homepage is not functional in the results page for the prototype. Ideally, it should work the same as how it works in the homepage.
 * Left-side Navigation - Not functional on this page. Ideally, it should work the same as how it works in the homepage.
 * Image thumbnails - All images throughout the system (i.e. artwork photo/ thumbnail, artist photo/thumbnail, artist timeline) will be both clickable (i.e. should take you to the respective page related to the image) and drag-and-droppable to the Collections panel. Unfortunately, the clickable aspect of the thumbnails is not functional in the results page for the prototype.
 * Text Links - The text beside the image thumbnail will be functional links to either the artwork page or the artist page they represent. For the prototype, only the "Pierre Ayot" link works. When you click on the link "artists" in the search summary (i.e. "15 Results for artists, painters, & Ontario"), ideally, it should bring you to a refreshed results page as if you had only searched for "artists" in the Search field.
 * Add to Collections button - This is an alternative to the drag and drop functionality. On click, it will add the image to the Collections panel.
 * Display - This part is not functional for the prototype. Ideally, the users will have the option to arrange the results by best match, alphabetically, region, most recent, or oldest. They can also choose if they want a tiled view or as lists.


 * [|Artist Page]**
 * Images - All images throughout the system (i.e. artwork photo/ thumbnail, artist photo/thumbnail, related artist/artwork thumbnail) will be both clickable (i.e. should take you to the respective page related to the image) and drag-and-droppable to the Collections panel. Unfortunately, these are not functional in the prototype.
 * Timeline - Timeline works as an accordion: will reveal more information on click. The resulting image then will be drag-and-droppable. The entire surrounding grey border throughout the timeline (extending the hand-grab icon) will act as a handler for the whole timeline on the event of a drag-and-drop action. This is not functional in the prototype.
 * Collections Panel - The expanding/collapsing animation for the Collections panel works here. Ideally, it will look more like the Collections panel from the homepage and results page, but carrying on the animation effect.
 * Breadcrumbs - This is not functional in the prototype, but should function as how breadcrumbs work (i.e. each step will act as a link to path)


 * [|Artwork Page]**
 * Images - All images throughout the system (i.e. artwork photo/ thumbnail, artist photo/thumbnail, related artist/artwork thumbnail) will be both clickable (i.e. should take you to the respective page related to the image) and drag-and-droppable to the Collections panel. Unfortunately, these are not functional in the prototype.
 * Contextualizer - The keywords in the Contextualizer will act as tags, and when clicked, should take you to a results page relating to the keyword.


 * General comments on the Collections Panel / Compare bar**
 * Images collected in the Collections panel, by default, would take the first two images to compare. The images can be rearranged on drag/drop. There would also be an option to add more slots.
 * Other possibilities: ability to save/organize images in stacks.


 * [|Compare Panel]**
 * When the Compare button on the Collections Panel is clicked, ideally, the entire panel should animate upwards and contain what is inside [|this page]. The page where the user is on prior clicking the Compare button will hence be saved and the user can go back to it by collapsing the Compare Panel down (Exit).
 * The Contextualizer (containing the contextual themes surrounding the artwork/artist/timeline) will be accumulated to the list. Common items in the Contextualizer will be highlighted when clicked "Toggle content".

Final Refined Prototype

 * Final version:** http://digital-locker.design.yorku.ca/3005Mw09/group3/index.php
 * Alternate version:** http://digital-locker.design.yorku.ca/3005Mw09/group3/index.html