MCN2015

If you entered a museum 10 years ago, you could make a pretty safe bet that most of the in-gallery interactive media experiences had been developed in Flash. Today, Flash has entered in its dotage. New developers are not likely to be familiar with its systems, and its developer, Adobe, has refocused the tool as an animation suite instead of an application development environment. So what’s a museum developer to do? Fortunately, developers today are faced with a bevy of new tools, previously reserved for the web alone. These often get discussed under the moniker HTML5, but represent many specific technologies such as HTML, CSS, Javascript, and NodeJS, to name a few.

In this presentation we will review the technical challenges in using these technologies to drive engaging museum kiosks, digital signage, and media theaters. We will feature examples of open source technology used by the Science Museum of Minnesota in its own exhibitions, and in the media it develops for partner museums around the country. This presentation won’t teach you how to program in these languages. Instead, it will focus specifically on the ways that these tools can best be used in the unique technical landscape of the museum environment.

Kiosking the browser:
One of the key principles of using web technologies, is that the visitor is using the application through a browser. The majority of popular browsers developed today (Chrome, Safari, Firefox) are not ideal for a focused museum media presentation. We will discuss options for building kiosk-able browser experiences, highlighting several options including SMM’s own open source tool, Stele (https://github.com/scimusmn/stele), which is built on top of the Chrome web-browser; Electron, a cross-platform app builder for HTML and Node Webkit.

Custom interface devices:
When thinking about using HTML5 it’s important that we don’t limit ourselves to the staid old mouse and keyboard. Museum visitors expect immersive experiences where media is driven by unique interface devices including: touch screens, buttons, and even interaction with room based sensors. In this section of the presentation we will discuss techniques for using simple keyboard encoders and Arduino microcontrollers to interface with HTML5 applications to engage the visitor through these unique interfaces.

Design and animation:
For HTML5 to be a successful Flash successor it must be as an expressive design tool. We will discuss some of the libraries for Javascript and CSS that give designers the ability to create beautiful museum media, highlighting displays developed utilizing the D3.js visualization library, and showcasing some animation using animate.css. And, we will even talk about how Flash can still be a useful part of the equation.

Opportunities for museum research and evaluation:
One of the key elements of the modern web is access to rich user analytics. We know how many times elements of our websites have been clicked, and often by who. However, we often don’t have this same data about how people use museum media experiences. If we do it’s generally from direct observations of museum visitors. While this direct observation is critical and should never be replaced, web technologies have the prospect to augment our research and evaluation practice with in-gallery analytics. We will highlight several ways for developers to build analytics into their HTML5 museum experiences to better understand how visitors react to the copy, designs, imagery, and messages of the media that we are developing for our exhibits. We will also highlight some easy systems for visualizing this data once it is collected.

The SMM Media Design group has been developing the majority of its in-gallery media experiences utilizing HTML5 based systems for the last 4 years now. The conolude we will highlight some of the mistakes that we’ve made along the way. We’ll discuss where we still face challenges. And talk about what we see on the horizon.