Augmenting an art-history exhibition with a web-native long-form story
The photo above shows the Slovak National Gallery (SNG) in Bratislava where I design and develop web technologies in the research and development lab. The prominent ‘Bridge’ structure on the left is currently undergoing reconstruction, which means that the only space available for exhibitions is the three top floors on the right. One of the ways we are dealing with this limitation is by extending visitor experience on digital platforms. This is the story of how we approached one such extension to augment our recent exhibition ‘Dream × Reality: Art & Propaganda 1939–1945’ with much needed historical context.
Motivation
Dream × Reality is the first art-historical interrogation of the era of the Slovak (war) State — one of the most controversial periods in modern Slovak history. Central theme in the exhibition is the contrast between the ideological dream of the first sovereign Slovak state and the painful reality of a regime that openly collaborated with Nazi Germany and the policies that came with that.
For the curators it was extremely important to provide visitors with a deeper understanding of the context in which the material of the exhibition was created. Limited in space, the curatorial team worked with my department to narrate the historical events of the Slovak State in a form that works natively on the web.
We set ourselves the goal to narrate the events of the Slovak State in a way that would be both historically accurate and engaging to read
Inspiration
Thinking about how to approach this challenge, we were inspired by web projects using long-form storytelling formats. This story format was pioneered by the classic Snow Fall and successfully applied in many contexts over the past five years including in many gallery, library, archive & museum (GLAM) projects.
This approach fitted our goal of conveying quite a complex story in text while allowing to weave in other media like images, audio and video. We were less interested in the interactive bells and whistles ‘Scrollytelling’ projects have become known for, and more in reusable blocks of functionality to make the story more accessible to readers. Platforms like the Dutch journalism publication De Correspondent as well as Medium have been refining online reading experiences for years, and so provided great design inspiration to learn from.
Rallying the troops
Once we knew the rough form we wanted to use for our story, we started gathering the skills required to the realize the project. As we wanted to actually tell an engaging story, rather than publish a history lesson, we approached Peter Gašparík, a screenwriter with experience in historical documentary. Peter worked with material from the curatorial team, his own historical research and input from editors in the R&D lab to craft a structure for the story that is both historically accurate and keeps you reading.
We also worked with external web designer Matúš Solčány, who did a great job at extending the exhibition design to a visual language that works for a web-native reading experience. His designs provided important user experience (UX) solutions to guide the readers through the story (more on this later).
Besides digitized works from the exhibition, we also gathered internally produced video and 360º photos as well as external resources through a long list of local and international GLAM organisations. To ensure accuracy, all texts were proofread and fact-checked by historians Marína Zavacká and Ján Hlavinka.
Two days before launch
So far everything sounds great, but things did not move as quickly as we’d hoped. External collaborators and iterating on different versions of hyperlinked text documents take plenty of asynchronous communication, which takes a lot of time. On 18 October, 2 days before the exhibition would open we had no finalized content and no website. Let me repeat that for you:
2 days before the exhibition would open we had no finalized content and no website
¯\_(ツ)_/¯
In all seriousness, we focussed on the things we did have:
- outline of the story
- visual material related to the exhibition
- general visual design
- opportunity to share a URL
We had realized long before that a full launch at exhibition opening was not going to happen. This limitation triggered one of the design decisions that most deeply shaped the project. We figured we’d be doing both ourselves and our readers a favour if we’d launch the project in stages. This way we could split up the big, complex story into multiple bite-sized chapters and release them over a longer period of time.
But in order for this episodic release strategy to work, we needed to establish a relationship with visitors to the website such that we’d be able to notify them of new chapters. We decided to use an email newsletter, enabling visitors to leave their email address in order to receive updates about new content. We used Mailchimp which we were already using for other mailing lists and is free for up to 2000 subscribers.
Below a screenshot of the landing page that went live on 19 October:
Please notice:
- ❌ no internationalization
- ❌ no sub pages besides landing page
- ❌ no actual text content
- ✅ wholistic graphic design
- ✅ building anticipation by communicating the promise of the full story
- ✅ option to subscribe to updates
- ✅ options to share the page
- ✅ previews of the 4 chapters
- ✅ links to more info about the exhibition and SNG pages
Have your cake
As we continued to build out the project in iterative stages, we kept on applying the same trick we used for the landing page. This trick is well understood by startups and has everything to do with slicing cake.
When you have a big project that relies on several layers of input, it’s often a good idea to think about a thin vertical slice that includes a bit of every layer in order to release something quickly and take it from there.
In our case the vertically sliced landing page included layers of writing, proofreading, content preparation, graphic design, UX design, front end development and back end development. Because we kept this first slice thin, we were able to launch it extremely quickly (2 days) relative to the span of the entire project (4 months).
Notice the subtle iterative changes made to consecutive versions of the initially thinly sliced landing page:
Accessibility as a main motivator
Because an “engaging reading experience” was a main goal of the project, accessibility was an important driver for me as the lead developer. For me this term is not just about removing barriers that prevent access to people with disabilities, but also about enabling as many people as possible to access the content on their own terms.
This vision of accessibility broke down in three concrete goals:
- bite-sized content
- fully responsive layout from mobile to desktop
- designed for reading
I addressed the episodic release of bite-sized chapters and I assume you have a clear idea of what I mean with responsive layout. I would like to briefly unpack the less straight-forward point about designing for a reading experience by zooming in on several design choices we made.
Designing for a reading experience
Perhaps the most important question to ask yourself as a potential reader of any piece of online writing these days is:
How much of my life am I signing away by deciding to read this?
To respect visitors’ time, we added an estimation of the reading time at the top of every chapter. Every scroll also updates a progress bar, keeping readers informed about their position in the chapter.
Every chapter is made up of several chronologically ordered sections.We made it easy to navigate this structure via a table of contents in the shape of a timeline:
We imagined readers might like to ‘catch up’ about specific characters and topics featured in the main narrative. To support this wish to dive deeper we designed ‘sub-object’ thumbnails that are featured at the end of every section, each linking to their own page providing additional information and media:
Standing on shoulders
While most of the above elements were the result of custom development, there was an important feature we were able to leverage from our own online collection platform web umenia. Thanks to the open-source IIPImage server we support deep zooming of high-res images on the platform and because all works in the exhibition are on web umenia it was easy to embed deep zoom viewers directly on the project site.
Because the project relied heavily on writing interspersed with multimedia elements, it was clear from the start we needed to enable editors to manage this content in a user friendly way. I chose to work with the free & open-source content management system (CMS) Grav. Grav lets editors manage pages and stores all content as flat files in a straight forward directory structure (instead of a database), which hugely simplifies development and deployment!
As I mentioned, we used MailChimp to let visitors subscribe to updates about new chapters and content. This provided us with an invaluable way to keep in touch with people arriving at the project. MailChimp is a great example of an off the shelf tool that is free and easy to get started with and straight forward to integrate into a custom project. This resulting mailing list wasn’t anything massive, but with the 341 subscribers opening 53% and clicking 18% of the emails, it had quite a good engagement.
Sharing the story
In the words of SNG General Director Alexandra Kusá:
The intention of dealing with the period of 1939 to 1945 has appeared in our exhibition plans for several years. When work on this project began two years ago, none of us had any idea of the mood in society this project would eventually encounter — now we know.
During the 2016 Slovak National elections, the far-right neo-Nazi party ‘People’s Party — Our Slovakia’ received 8% of the vote. This context is paired with online campaigns run by sympathizers of the party, glorifying the 1939–1945 regime and its main characters. We felt an opportunity and responsibility with the project to provide a lasting, accessible and accurate resource that would compete in search results and on social media with this kind of misinformation.
Besides providing easy ways for readers to share parts of the story, we actively promoted the story through several channels:
- partnerships with civic organisations who shared the project on their social media, leading to significant increase in site visits
- paid posts to promote the project on Facebook
- search engine optimization (SEO) to increase ranking for relevant terms such as the main figures of the regime
- partnerships with other organisations who linked to the project through banners and blog posts, further adding to SEO score
- paid Google AdWords
Response
In the year since launch, the project has attracted 21845 sessions, with average duration of 4 minutes 18 seconds. This isn’t spectacular by web standards, but considering the type of material I think we can consider this a good sign. Given the longer term vision of a lasting online resource to be read and referenced, I am happy to see people continuing to reach the project over a year after launch.
Last November the project was put in the spotlight for its educational impact at the annual award of the National Council of Slovak Galleries:
One last thing we did after all chapters were published, was to translate all the material into English. I’m very happy we went this extra mile as this piece of history deserves to be more widely understood and should never be forgotten.
Please give it a read, I promise most chapters are shorter than this article. I’m looking forward to reading your thoughts in the comments below!
