Improving the navigation of our collection hierarchies

The Library's DX Lab has built an improved collection hierarchy viewer as part of our new catalogue project. This post, which shares insights into the research and design process behind this work, is an abridged version of a longer piece you can find over on the DX Lab website.

__

Over the past 18 months, the Library has been hard at work building a new collection platform. You can experiment with the beta version here at collection.sl.nsw.gov.au. With over 3 million records and 4 million digital files ingested so far, this has been a huge digital undertaking, with many teams throughout the Library contributing to the project. 

When we started thinking about a new collection website, a difficult problem arose almost immediately — how to design and build an effective hierarchy interface. In other words, how to make it as easy as possible for people to find items that were related to other items. This has been a long-standing pain point for Library users, due to the size and range of data in our collection. The DX Lab was asked to help solve this problem, essentially creating a new interface to navigate the Library’s complex relational records. 

What is a hierarchy? 

At a broad level, the Library’s collection can be divided into two categories — published and unpublished. Published materials include books, journals, newspapers and music. These are generally flat records, so they do not directly relate to one another, however they may be connected by author or subject. 

Unpublished records include manuscripts, objects and pictures. Also known as archival records, these are often organised in a hierarchical way, where one root record can contain other child records. These children can also contain their own children, much like a family tree or perhaps files and folders on a computer. 

The Lawson Family Papers are an example of a fairly simple archival record. The following tree chart is quite compact and shallow, where most child records of the root do not have their own children, except for a couple of records (Series 01 Part 03 and Series 02 Part 01): 

Here is the hierarchy tree interface in the current archival record page:

Tree limitations 

The hierarchical tree view works well for smaller hierarchies and is common in many collection applications. However, it becomes quite unwieldy for larger hierarchies. The Library is home to several mega-hierarchies, with the largest being the Australian Photographic Agency collection. With a whopping 42k records under one root record, it is also the longest hierarchy in the collection. Here is a small part of the hierarchy: 

Did you get sick of scrolling? We are only showing 300 records — imagine a tree interface with 48k records! 

Design and build 

Using the Mac Finder column view as our inspiration, we sketched out some ideas for our hierarchy browser: 

We proceeded to build the interface with real data. The May Gibbs dataset was particularly useful during development as it had images and was not overly large (240 records). It was also perhaps the deepest hierarchy we encountered, ensuring our code would work for shallower hierarchies. 

Here is final product with the May Gibbs hierarchy, starting at the root level: 

At the bottom of each column, you’ll notice that we are using the term ‘level’ to indicate the depth of the hierarchy. We’ve found this to be more approachable and consistent compared to existing Library terminology. 

Clicking on Series 07: Illustrations 1867-ca. 1968 / May Gibbs reveals the child records: 

Clicking on Volume 01/i: Illustrations for Gum-nut Babies / by May Gibbs partially shows digital files of that record, encouraging the user to scroll sideways: 

The second digital file, Illustrations for Gumnut Babies / by May Gibbs is then selected and shows a preview of the file: 

Digital files

Some collection records have digital files associated with them, such as images, audio or video. While these are not strictly part of the archival collection hierarchy, in the context of a public facing collection interface, we felt that it was important to provide access to these assets. It also serves as a connection point between our new collection and digital portals. 

Below, we are showing the digital files attached to Volume 02/iv: Illustrations for Wattle Babies / by May Gibbs. Note that the files have much larger thumbnails than the records. 

Tree view 

We felt that the traditional tree view still had merits, so we designed a tree version of the hierarchy browser to sit in the record page, enabling immediate access to ancestor and child records. 

This view may suffice for smaller hierarchies, however our main column-based hierarchy browser can be accessed for larger and more complicated hierarchies by clicking the Browse hierarchy button. The main hierarchy browser then opens in a modal. 

Code and data 

We know the Library’s hierarchies ranged greatly in size and depth; however the back-end team was able to supply all the data we needed for the hierarchy browser with their new API platform. The backend/infrastructure team have written an in-depth blog post on the new systems architecture. 

Regarding the front end, the hierarchy browser and complete collection front end is built with React, a popular open source JavaScript UI library. You can read more about the front-end architecture here. The DX Lab website, #NewSelfWales and The Diary Files are also built with React. By standardising around this UI library, it allows the Lab to incubate experimental components that could be used down the track by the collection website or on other Library projects. 

A lot of work has gone into this interface, so we plan to share the hierarchy browser as an open source component in the future. 

Feedback 

We’d love to hear your feedback on both tree and column variations of the hierarchy browser on collection.sl.nsw.gov.au, especially for larger hierarchies. There is a blue Have your say feedback widget available on every page and we’ll use these comments to continually improve the interface over the next few months. 

Kaho Cheung
DX Lab Technical Leader