Rich Interfaces for Scrolls « Digital Humanities Questions & Answers

Digital Humanities Questions & Answers » Interfaces, Design & Usability

Rich Interfaces for Scrolls

(8 posts) (2 voices)

Asked 3 years ago by Trip Kirkpatrick
Latest answer from Trip Kirkpatrick

Tags:

Trip Kirkpatrick
Member
In surveying for existing web/mobile interfaces for digitized scrolls or scroll paintings, I'm mostly seeing fairly straightforward examples, interface-wise. I'm not finding many with rich annotation built in, for example, to say nothing of user-contributed content. Almost all are Flash-based enlargements with, in some cases, accompanying text and/or media. Strangely enough, I'm also finding very few of recent vintage. Are there any good examples out there of sophisticated UI/UX work with horizontal scrolls?

A handful of examples of what I'm finding:
http://lucian.uchicago.edu/blogs/caea/scrolling-paintings/ (good for comparison tool)
http://library.brown.edu/cds/perry/scroll_bul.html (good for paratext)
http://ocw.mit.edu/ans7870/21f/21f.027/black_ships_and_samurai_02/scroll_home.html
http://etcweb.princeton.edu/asianart/interactives/koetsu/scroll.html (starting to get there)
http://www.courses.fas.harvard.edu/~icgzmod/qingming_student.html (closest I've found to what I would like to do)
http://learn.bowdoin.edu/heijiscroll/viewer.html (also very good)
http://dss.collections.imj.org.il/isaiah (also good)
http://academic.reed.edu/hellscrolls/scrolls/Aseries/A01/index.html (a little naive but some good ideas)
Tweet this question
Posted 3 years ago Permalink
Arno Bosse
Member

Right.. and several of these are based on Zoomify. Years (and years..) ago I experimented with QTVR to achieve a similar effect. You can see a demo here (requires QuickTime Player): http://dl.dropbox.com/u/1667511/frieze-web.mov The Mac app I used to create this no longer exists (I forget the name now..) though I'm pretty sure you'd be able to re-create this VR based technique using e.g. http://panotools.sourceforge.net/

The only interesting, perhaps comparable and relevant work I've seen recently that might have bearing here is derived from CSS3 and Canvas experiments. You can find these on various sites which showcase HTML5 & Canvas.

These days with hardware assisted support for WebGL already in place on modern browsers and touch, swipe & pinch gestures becoming ubiquitous even on desktops & laptops I think drawing on these kinds of paradigms plus different ways to represent overlaid information might be the way to go. One obvious place to look, for example, is how different apps are handling this kind of interactivity for photos and maps. The ability to use gestures on images to trigger "forensic" (analytic) changes no longer requires something like Shockwave for example.

Please do post back here when you come across more examples. I would imagine that coming up with a good UI, backed by open technology standards (i.e. no more plugins..) would be something that could easily receive funding. Lots of people need something like this.

Posted 3 years ago Permalink
Arno Bosse
Member

Replying to @Arno Bosse's post:

The frieze QTVR demo above works best if downloaded and viewed in QuickTime player, not in a browser window using the QT plugin.

Posted 3 years ago Permalink
Trip Kirkpatrick
Member

Replying to @Arno Bosse's post:

Indeed, I am hoping to come up with something, even if it is only narrowly applicable, that works in a multitouch environment as well as on a traditional mouse-based (or even keyboard-based) environment.

One of the key problems is that I've been out of the web dev game long enough that I'm having to approach things like this as a complete noob. That's a great principle (fewer preconceptions and all that) but it's a difficult practice. A simple search for "pinch zoom html5 canvas" returns some interesting results, though, so I'll drive down that road for a bit and report back.

Posted 3 years ago Permalink
Arno Bosse
Member

Replying to @triplingual's post:

Smashing Magazine often covers these kinds of issues at a fairly high level and/but compensates for this with good links to further articles, resources and of course reader comments. I've found it helpful keep an eye on related topics there, e.g. http://uxdesign.smashingmagazine.com/2012/05/30/design-process-responsive-age/

I've been tracking interactive web design for mobile devices because I'm planning to build a new version of this quick & dirty web app hack (from 2008) itself a re-hash of something we originally built (more elegantly) in 2005.. http://kanjialive.com (see http://dl.dropbox.com/u/1667511/searchdemo.mp4 and http://dl.dropbox.com/u/1667511/displaydemo.mp4 for quick demo of the original app).

It's a brave new world, no doubt about it.

Posted 3 years ago Permalink
Trip Kirkpatrick
Member

Replying to @triplingual's post:

In case anyone's following along, here are two potential resources mentioned by a colleague:
IIPImage (FOSS)
LUNA Imaging (non-free)

Posted 3 years ago Permalink
Arno Bosse
Member

We used Luna at Chicago.. it's finicky and very resource hungry but if set-up correctly can work well. The best implemented example I've seen of Luna in action is with the Rumsey Map Collection http://www.davidrumsey.com/

Posted 3 years ago Permalink
Trip Kirkpatrick
Member

Greetings visitors from ProfHacker! In noticing that this thread was linked today, I realized I hadn't updated it with where I'm at with this project.

One of the examples at the IIPImage site was of work done at the National Gallery (London), especially by Joseph Padfield. After some consultation with him, I'm using his implementation of IIPImage for project's current phase. (Though he and they have put out there a number of examples of using interesting customizations of IIPImage, I'm focusing on the annotation, remote image, and comparison features.)

Since IIPImage started working for me reasonably well, I haven't examined Luna.

Posted 3 years ago Permalink

RSS feed for this topic

Reply

You must log in to post.