Information about CONTENTdm Customizations
Beyond the customary template modifications that most CDM sites make, and several custom collection pages, we have worked to optimize the user interface for teaching purposes. The most significant enhancements include an image viewer with easier panning and zooming behaviors, and a more full-featured gallery system called "My Workspace" which replaces the My Favorites interface.
Zoomify Interface for Easier Image Viewing
Faculty asked for image viewing tools that were simple, intuitive, and similar to other web-based interfaces they were already accustomed to using (eg, Google Maps). In the Item Viewer they wanted to see the data side-by-side with the image, but in the slide view, they wanted the image to automatically fill as much of the window as possible while minimizing the visual impact of the viewing interface. We were also concerned that multiple viewers would be confusing to users, so we decided to completely replace the item viewer with our new user interface. Visit our CONTENTdm Help pages for descriptions and screenshots of the image viewer.
We evaluated both the Google image viewer and Zoomify. Both offered improved panning and zooming but ultimately we selected Zoomify for several reasons:
- more customization of the viewing tools available;
- birdseye view always represents the whole image at different zoom levels;
- smoother zooming behavior;
- one-click "fill the screen" option;
- viewer resizes when the browser window resizes (no need to hit the refresh button);
- initial display for images using the Google viewer was limited to a few different default zoom levels;
Zoomify is a flash-based solution so no specialized client of viewer is required, other than a standard web browser with Flash plugin. The only cost associated with Zoomify is the cost of the development tool (the current version, Zoomify Flash, costs $129). Both Google and Zoomify require that the images be sliced up into component tiles in order to be shown in the viewer.
The Zoomify solution came in three parts:
- CONTENTdm template modifications to replace the built-in viewer;
- A process to slice all of our existing images;
- A process to stay on top of slicing image changes or additions.
The template modifications were fairly easy; we generate the Flash embedding code from a shared PHP function, so it's easy to implement wherever we want.
The slicing of our existing images was a bit more complicated. We took advantage of a Python script by Justin Henry to script the slicing. The complication was that, with the roughly 77,000 images in our CDM collections, the slicing took three full weeks to complete even though it was running 24 hours a day.
Staying on top of changes and additions to our collections is a bit simpler. We still leverage the same Python script, but steer it from a PHP script that uses the CDM API to find modified images, and then reslice them. The PHP script is intended to be called via the web, and can slice all changed images from arbitrary dates, making it easy for staff members to force reslicing when they need it in addition to the daily cron-based slicing.
Download a copy of the Zoomify solution files, and don't forget to read the readme, which has lots of juicy technical details.
My Workspace: better user-defined galleries and slideshows
Our users were rather dissatisfied with the built-in CDM favorites. Since the galleries were cookie-based, if they changed machines, or their browser messed up, they lost it all. The cookie method precluded two simultaneous slide shows and cookie size constraints limited the number of images they could have as favorites. Faculty in image-intensive courses also requested tools for saving and organizing multiple galleries.
The My Workspace gallery and slideshow viewer replaces the CONTENTdm My Favorites system. Featuers include:
- users can create, name, and save multiple image sets, as well as create folders to organize their galleries;
- image sets do not rely on cookies, so logged in users can access their personal galleries from any computer;
- lightbox interface with "drag & drop" image sorting;
- configuration options let users easily choose background color and metadata to display for slideshows;
- in slideshow mode, the navigation controls can easily be displayed or hidden;
- users can advance the slideshow by using their mouse or keyboard arrows;
- the "compare" viewer automatically opens in two windows, for optimization of dual projection.
My Workspace was created as a separate Ruby on Rails web application that stores user-generated information, such as gallery names and slideshow order, in a SQL database. My Workspace relies on our normal user authentication infrastructure (based on LDAP) to identify users and associate their galleries with their username. Users can create a folder tree with arbitrary numbers of folders and galleries, each of which can have as many images as they like. The interface is fully drag-and-drop for sorting images in a slideshow or organizing galleries and folders. Galleries can be copied (even between users), and have a slide show feature with stable URLs to enable faculty and students to easily share galleries.
The best way to get a sense for how this works is to watch the demo video.
Communication between CDM and the workspace is handled through a collection of PHP scripts on the CDM server that use the CDM API, and RESTful application architecture on the workspace side.
Download a copy of My Workspace, and don't forget to read the readme, which has lots of juicy technical details; the zip file includes all of the Zoomify files as well.
Frequently asked questions
What version of CDM do these modifications use?
We built against version 4.3. We plan on upgrading to CDM 5 over the summer.
How do you manage the Zoomify files?
The sliced images are stored in /docs/zoomify/collection. The readme in the code archive has more details.
How do you authenticate users for the workspace, and is authentication required?
Authentication is required, so that we know who our users are when they come back, no matter where they visit from. We use Cosign for web single sign-on, which functions via an Apache authentication module.
How much did it cost?
There were very few direct costs for the project, as all the development tools and infrastructure were open source, except the Zoomify development tool. The current cost of Zoomify Flash is $129 per developer.
What technical expertise was needed?
Three members of our technical staff contributed to the project:
- A Web Application Developer with experience in Ruby on Rails and SQL databases created the My Workspace application.
- Our Academic Web Developer, who already had extensive experience customizing CONTENTdm templates, as well as coding HTML and CSS, created the Image Viewer, My Workspace and Slide Show templates, as well as the overall style and graphical user interface.
- Our Digital Media Specialist created the customized Zoomify interface and Flash player.