Editing Ancient Scrolls on Modern Tablets

In the world of Digital Humanities, there are few projects that provide a better opportunity for using bring up-to-the-minute technology to study ancient artifacts than a project involving the digitization of the Dead Sea Scrolls.

We’ve recently started consulting with the team working on the
Scripta Qumranica Electronica, which is creating a digital scholarly edition of the scrolls, and we won’t try to hide it – we are beside ourselves with excitement to be working on this project.

As part of our involvement in the Scripta Qumranica Electronica project we are helping to develop new web-based tools for scroll editing. In their current digitized form, the scrolls comprise hundreds of thousands of very high resolution images. Some of the images are of fragments so small they are almost microscopic. Scholars sometimes need manipulate and display hundreds of these images at once. Our challenge is to provide them a platform where they can do that.

One of the modules we developed begs for touch-screen support. It’s the kind of work that will be done a lot faster on tablets, and scholars have requested this support. This module displays scroll fragments, along with an automatically calculated boundary of the fragment, and lets users update the boundary. It can be done with a mouse on a computer screen, but it’s much better to do it with a stylus (or even a finger) on a tablet.

To make this work, we had to take a functional web application that worked properly on computers, and make it tablet-friendly. This proved a lot tricker than we originally anticipated.

First, mouse events are emulated on the tablet, and not always the way you’d want them to be. This was relatively easy to fix – we use pointer events instead of mouse events.

In our web application we use a series of HTML 5 canvas elements to display different aspects of the fragment. This works well on computers but on tablets (especially Android tablets) it was slower than a snail race in a glue factory. We found that on a Samsung Tab 2 (our minimum supported tablet) the web application is unusable. Fortunately, the tablet ran out of battery after less than an hour, so it wasn’t slow for long.

We needed to resort to all sort of trickery to get the web application to perform well on a tablet. First, we used did was use a lower resolution image. Second, and more important, was the careful selection of canvas sizes. We have some canvases that are display-only and some that are changed by user actions. We further reduced the resolution of those changed by the user.

This had a huge performance impact.

To further improve performance, we started using passive event handlers for some of the events, and let the browser handle some gestures with careful selection of the touch-action CSS property.

This was enough to turn a site that was unusable on a tablet into a very responsive site. Battery life has improved significantly, as well.

Leave a Comment