Description

Gallery and Image Management

The Gallery Tool is designed to work in concert with the Resource Tool. This allows both instructors and students to create folders that represent "collections" of images to be viewed using the Gallery Tool. While collections defined by the Content Hosting Service (CHS) could be tagged in some way as "collection folders", it's not clear that such is needed. An alternative approach would be to treat all such collections as potential image collecitons and handle the case where there are no images present, perhaps with an error message. As such, filtering of non-gallery collections could be avoided.

The Resource Tool provides several means to upload images into a collection: singlely, multiply, zipped, and via WebDAV. Once in place, access permissions can be specified, release and retraction dates defined, and order imposed. Note that some of these operations are not enabled by default in the Sakai 2.3 release.

Definition of Terms

Image
A resource who's content type is a member of the list defined by the Gallery Tool, usually one of the image MIME types such as image/jpeg, image/tiff, image/png, etc.

Image Collection
A resource collection who's members are all images. Image Collections have a property that defines the representative image to be display when showing the collection as an entity.

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 review
4. Manually sequence through images in a collection
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 (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 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).

Images are defined to be of a certain mime type. At this time, these types are restricted to image/gif, image/jepg, and image/png. Perhaps supported image types could be system configurable. A desire for other media types, including video has been expressed.

Gallery Tool Design

The application is considered to have three main states:

1. Show setup help text
2. Gallery View (and navigation)
3. Image View (and sequencing)

transitions are navigation or selection clicks:

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.

GalleryService

The GalleryService provides management of galleries:

1. Get the list of ImageCollection's in the gallery. done
2. Get an image-collection by id. done
3. Get an imgae-collection by name. done

Creation of and editing of image-collections is deferred.

ImageCollection

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

1. Get an ordered list of Image's. done
2. Get the nth Image. done
3. Get collection id. done
4. Get collection name. done
5. Get an Image by id.
6. Get representative Image id (defaults to first image)
7. Set representative Image id (deferred)
8. 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

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

Image Sequencing Wireframe

Student First Visit

Gallery Select Wireframe