Tag Archives: information architecture

A Closer Look at the Technology Behind an Exhibition


"A Closer Look" iPads installed in the gallery.

“A Closer Look” iPads installed in the gallery

The museum recently opened Small Prints, Big Artists: Masterpieces from the Renaissance to Baroque, a comprehensive exhibition that traces the development of prints across the centuries, explores the evolution of printmaking techniques, and unlocks the images’ hidden meanings. The works in the show are dynamic, striking, elaborately detailed, and quite beautiful. If you haven’t yet seen the exhibition, it runs throughout the summer and I highly recommend it.

On the surface, the prints included in the exhibition may seem devoid of technology, however it’s important to remember that these artifacts were state-of-the-art examples of the technology at the time. Woodcut, etching, and engraving were the photography and software development of centuries past. As a technologist, this notion creates an extra layer of intrigue for me.

To that end, I’d like to shine a light on some of the technology we employed to help tell the stories of these works and unlock deeper meaning for the exhibition visitor.

SURFACING KEY THEMES

During the exhibition development phase of the project, it quickly became clear that our curators and educators wanted to convey key themes that either impacted the artist’s inspiration or process. Through several months of workshopping and whiteboarding, a cross-departmental group of CMOA staffers explored various tactics that would best engage gallery visitors around the three focus themes: symbolism, reality and imagination, and altered states.

We didn’t start with technology solutions; we never do that. As an institution, we try to introduce technology-based solutions only when analog solutions do not achieve the desired goals. In this case, though, it was clear that technology was going to be the approach through which visitors could dive deeper into the ancillary components of the prints themselves.

The information architecture document developed for the interactive.

The information architecture document developed for the interactive

Our interpretive strategies team began investigating how visitors might explore this information. We started with content and intent before even thinking about design or devices we’d employ. What were the stories we wanted to tell? What objects best told them? We storyboarded the narrative in a hierarchical format. Designers and developers know this as information architecture.

Wireframe for one element of the iPad interactive

Wireframe for one element of the iPad interactive

Once the information architecture was solidified, we started thinking about how the stories would best be conveyed. We explored the possibilities and considered options for weeks. Ultimately, we landed on an overarching concept, A Closer Look, and the concept of a touch interface that would allow for the highlighting of certain aspects of artworks, the ability to comparatively juxtapose images and a way to see the immense detail possessed by the prints.

A way to explore these features without getting too bogged down in the detail of design is to iterate on low-fidelity wireframes. Evolving the information architecture into a loosely crafted user interface made it possible for the team to ask questions like “What would the user do?” and “Does this layout make sense in relation to our desired outcomes?”.

It was at this stage that we identified hardware—we would use iPads—and began working with the installation team so the interactive components could be seamlessly integrated into the gallery experience.

Screenshot of the iPad development environment

Screenshot of the iPad development environment

After the wireframes were solidified, we began building the interactives. We currently have no developers experienced with Objective-C (an object-oriented language for iOS touch devices) on staff here at the museum, so it made sense to utilize internal skill sets and develop in the HTML/CSS/JavaScript stack. Instead of a native iPad app, we built a web application that could be shown through our browser of choice, in this case the Kiosk Pro app that allows us to customize user permissions and lock the devices down into a public or kiosk mode. It was pretty straightforward from a development perspective.

REUSABILITY FTW!

The digital media department at CMOA is also producing quite a bit of original video content, much of which we desire to share with visitors in the gallery. In addition to the A Closer Look interactive described above, we developed a reusable HTML5 video player also optimized for iPad display. The idea here is that we can now start with this established code base for future exhibitions, make some small CSS changes, and quickly have a shiny new exhibition-branded media player. Keep your eyes peeled for this in Faked, Forgotten, Found, opening later this month.

OPENING UP OUR WORK

Realizing that other institutions might have similar needs and not have the resources required to develop custom solutions like these, we’ve open sourced the code that drives both A Closer Look and the video player over on our GitHub page. This code is free to use and modify, and it has been made available as an open resource. CMOA has utilized many open source resources over the years and it’s nice to be able to contribute back into the community when we can.

We’d love to hear your thoughts about how we’re doing. Did you visit the exhibition and explore some of the technology offered? What did you think? Let us know in the comments below.