Showcasing Museum Objects with a Google Chrome Extension
How a lockdown experiment broadened access to Auckland Museum’s collections
On March 25, 2020, Aotearoa New Zealand went into COVID-19 Alert Level 4 “lockdown”. Along with most of the country, the Collection Information and Access department at Auckland Museum, where I work, was suddenly faced with the prospect of working from home for at least a month. Our team enables access to collections and research materials in-person and online, and with the “real world” aspect suddenly out the window, we had to think of new ways to make our collections accessible online.
Background
In July 2019, we’d established a Flickr account specifically for collection imagery, and filled it with more than 2,300 high-resolution photographs of museum objects taken during an extensive programme of digitisation, community outreach, and metadata enrichment.
Our images
We had sorted all our Flickr photos into albums to make them easier to browse, but, before that, the images were already available on our Collections Online database, on Wikimedia Commons, and through our open API. We wanted to put them on a different, slightly more accessible platform and introduce an aspect of serendipity to the user experience. That’s when we came across the Library of Congress’ “Free to Use” Google Chrome extension, which, at first glance, seemed simple enough to adapt to our needs.
How the Library of Congress’ extension works
The Library of Congress’ extension, written in Javascript, replaces the default “New Tab” page with a randomised stream of full-screen images that can be navigated through by clicking arrows on the left and right borders. An auto-hiding panel at the bottom shows title information along with a link to the collection record, social-media and email buttons, and a download button that gives you the full image file.
Image files aren’t stored within the extension itself — this would make it unwieldy to download from the Chrome Web Store. Instead, they’re loaded on the fly. Image URLs and object metadata are pulled from a JSON manifest, either local (i.e., packed with the extension), or remote, with the local file as a fallback. We opted for a remote file (in our case a GitHub gist) primarily so that we can update it without having to publish a whole new version of the extension.
Adapting it to our needs
Until working on this extension, my programming experience had mostly consisted of writing a handful Python scripts to interact with our API in various ways (such as uploading our images to Flickr). So I had to quickly familiarise myself not only with Chrome extensions (and how they’re ‘packed’ for distribution on the Store) but also with Javascript.
The first thing I noticed when I uploaded the LoC project into GitHub was that it generated a lot of warnings from bots that crawl repositories looking for outdated dependencies. The LoC folks had also included entire npm libraries for Bootstrap and jQuery in their repo—and once the dependencies listing got to GitHub, its automatic security scanners raised alerts.
Coding
So, the first hurdle was working out how to properly build and deploy a web application. Even though this isn’t a full application, just an extension, it can still be built using npm and other standard Javascript development tools.
On this I had some fantastic help from Sydney-based developer Jonathan Toon. He walked me through how to set up proper ./src and ./dist directories, how to use parcel to bundle everything — and, most importantly at the start, how to create a .gitignore file to stop ./node_modules from being uploaded.
I’ll go into more detail on the technical side of things when I write up a full how-to on GitBook.com in the coming months, but for now, listed below are a few features I’d like to add in upcoming versions.
TODO
- Get better acquainted with the Chrome Extension docs and upgrade to Manifest v.3.
- Move away from jQuery and Bootstrap.
- Allow moving through images with the arrow keys on the keyboard, not just clicking the arrows.
- Preload the next 2 images, if the right arrow is clicked at least once.
- Read the size of a given image and scale it to fit.
- Add user options.
- Create a “dark mode” option. I manually tagged 788 of our photos “darkmode” so they could be sequestered from the main set and used exclusively when a user chooses “dark mode” in the options. This tag is already in the JSON export gist. Ideally such an option would sync with the user’s system setting.
Statistics
- Launched March 20, 2020
- 141 active users
- Latest version is 1.9.0 (released 29 April 2021)
- Available at aucklandmuseum.com/collections-extension
- Users in New Zealand, Australia, the United States, Russia, the United Kingdom, the UAE, Germany, India, Canada, Singapore, the Netherlands, Thailand, Ireland, and Hong Kong
- Get the source code from GitHub; build instructions are in the Readme.
- We’d love your feedback: CollectionEnquiries [at] aucklandmuseum.com
