...

Gallery
A set of image collections group into a resource collection. Initially, there will only be one of these either hard-named to "Galleries" or identified by the user.

Use Cases

These use cases were suggested by Daphne Ogle of UCB.

Instructors

1. Create collection (deferred)
2. Organize images within a collection (deferred)
3. Organize collections (within the gallery) by subject, class session , ?????(deferred)
4. Assign students a collection for review (for an exam for instance) (deferred)
5. Assign students an image for review (deferred)
6. Assign students a certain group of images (may come from a variety of collections) for review (all images of Frank Lloyd Wright's early work from the semester for instance) (deferred)
7. See what students see

Students

1. Browse collections in the course
2. Find a collection and review it
3. Find a particular image and see details for reviewFind
4. Manually sequence through images in a collection and review itBrowse collections in the course
5. Play (auto-sequence) through the images in a collection
6. Study for an upcoming exam (review course images)
7. Find image(s) for an assignment

Once we have a solid design to support the primary goal, we can start thinking about how we might be able to tweak things to support the secondary goal if time, resources, etc. allow.

To be clear, I'm not assuming that users will be able to complete each activity (use case) above in the system (and likely they won't). To understand the user's experience though I like to think through how the set of activities that help meet the goal will be affected by the system. So, for instance, for "assign students an image for review"... it's not likely we'll support the "assignment" of the image but understanding the complete activity will help me understand the experience without thinking about the gallery tool as a silo. It will also help me get real with trade-offs. Already this list reminds me how much we will be depending on the resources tool and the ability for users to create their collections in meaningful ways via the Resources tool.

...

1. (deferred)

Not all of the use cases will be implmented in the initial version of the Gallery Tool. Editing, in particular, is deferred to later work.

Viewing and Sequencing

The Gallery tool provides five main functions at this time:the following functions:

1. Display setup help text when no collections exist.
2. Navigate to an image-collection.
3. View and edit metadata associated with an image-collection. (deferred)
4. View the image-collection as an array of thumbnails.
5. Set the sort order of thumbnails based on title.
6. View an image full sized, perhaps in a pop-up window.
7. View the image-collection sequentially (manual), perhaps in a pop-up window.
8. View the image-collecton by playing it (auotmatic).

When an image is displayed full size, it should include it's name and description text (if any). It may be possible, when a single image is select for display, to jump into the sequence for that image. That would allow the user to then move back and forth in the sequence and see near by images (etc).

...

The application is considered to have four three main states:

1. Navigation
2. Collection Metadata
3. Collection ThumbnailsShow setup help text
4. Gallery View (and navigation)
5. Image View (and sequencing)

transitions are navigation or selection clicks:Image Removed

Image Added

Gallery Tool Services

Traditional Sakai tool design calls for the creation of an application service that encapsulates the business logic. A simple gallery service is proposed that would be layered over the Content Hosting service.

...

The GalleryService provides management of galleries:

1. Get the list of image-collections ImageCollection's in the gallery. done
2. Find Get an image-collection by id. done
3. Get imagean imgae-collection information
4. Set image-collection information
5. by name. done

Creation of and editing of image-collections is deferred.

...

The ImageCollection object extends ContentCollection and represents an ordered set of images. It must provide the following capabilities:

1. Get idan ordered list of Image's. done
2. Get an Image by idthe nth Image. done
3. Get collection id. done
4. Get collection name. done
5. Get an ordered list of Image by id.
6. Get representative Image id (defaults to first image)
7. Set representative Image id
8. Get next Image
9. Get previous Image(deferred)
10. Get nth Image. done

Image

The Image object extends ContentResource. It must provide the following capabilites:

1. Get image id. done
2. Get image name. done
3. Get image description. done
4. Get image URL. done
5. Get type (maybe)

UI Wireframes

See Gallery Views for snapshots of the Gallery Tool as implemented.

First Visit Wireframe

Image Added
Image Added

Please find attached a visual design mock up (gif file) reflecting the look for the Gallery help/Start page that the design team wants to move forward with.

Please login to nightly and go to the resources tool and click an any of the"Add" links in the "Actions "column of the table. The view will change to "resources > Add Item(s)
We emulated the style from this page. There are however some typographical changes.

In my comp all of the headings are bold and dark grey. The Getting Started heading is 14px and the The To add a collection and Ideas for organizing your images into collections headings are 13px.

The grey box, that lies behind the 13px headings is a paragraph selector with a class property value "discTria".

Gallery Select Wireframe

Gallery 1a: Default View

Image Added

Gallery 1b: Selected View

Image Added

Image Sequencing Wireframe

Image Added

Student First Visit

Image Added