Interactive Exhibit
designing a Journey into Local history
Role:
Concept lead, UX designer, interaction designer, web designer, digital archivist
Team:
Solo project with assistance from library board members and the historical society
Duration:
4 months from initial stakeholder meeting to project unveiling
01
Project Inception:
Initial stakeholder meetings, requirements gathering, constraints, and available resources
Background
To add a bit of context, I’ve run a small IT and web design business in central Ohio for several years. When I was approached to spearhead this project, our sleepy rural town was still considered by state law to be a village based on its population size. In the two years since, our historically agricultural community officially achieved city status, and we’ve unexpectedly become ground zero for what is now being dubbed the “Silicon Heartland” or my preferred term, “Sili-Corn Valley.” Intel is breaking ground on their giant 20 billion dollar semiconductor manufacturing plant within comfortable walking distance from my house. With all the change and growth coming our way, I was proud to have been a part of preserving some of our local history before growth in the name of progress could possibly erase it.
Stakeholder Meeting
I was first contacted by board members representing the Mary E. Babcock Foundation and the Licking County Library System, and a preliminary stakeholder meeting was scheduled. There was interest in adding to the county’s legendary history initiative by creating a permanent installation within the newly expanded Johnstown Library. While funds were limited, the library’s namesake foundation would cover my fees and equipment costs, and the county library system would absorb any annual hosting fees. At the time of the meeting, the library foundation had already procured a large touchscreen display, and the goal was to utilize it to create an interactive kiosk detailing our city’s history.
Constraints & Requirements
During the initial and follow-up stakeholder meetings, it was learned that there would certainly be budgetary constraints meaning research and design time would have to be managed carefully for maximum effect. Additionally, there was the technological constraint of the touchscreen itself in regard to its size, aspect ratio, and feature set. Finally, the broad user base needed to be accounted for, consisting of a wide variety of library patrons. The established requirements were less concrete. The board cited the desire to showcase the city’s history, landmarks, and influential people, but they were unsure of the ultimate design direction, which meant both concept and execution would be largely up to me. This meant I needed to tap into all available resources to begin formulating a design plan.
available Resources
Board members with historical knowledge of the area
Library personnel with access to archived documents, maps, and other artifacts
The Johnstown Historical Society and its vast collection of memorabilia
The now out-of-print book, A Pictorial History of Johnstown, Ohio (2002)
Community members with extensive historical knowledge or personal collections
02
Getting Out of the Building:
Informal research, content search, and pinning down the concept
Looking for Leads
While time and budget constraints did not allow for any formal UX research, I was able to initiate a fairly extensive treasure hunt within the community. Phone calls and meetings were scheduled with noted local history enthusiasts, a tour was taken of the historical society, and the library graciously provided rare books not available to the public. Some leads proved to be dead ends, and unfortunately, a few promising ones were either unresponsive or uncooperative, but by implementing something resembling snowball sampling, I was eventually able to make the right connections. I traveled to a local print shop, and after some convincing, the owner thankfully handed me his entire archive of historical photos on a thumb drive. Additionally, with the help of the historical society, I was able to obtain a binder full of postcards as well as glass and large-format negatives. I also managed to obtain a copy of the out-of-print pictorial history book from one of the stakeholders, alongside other odds and ends from the community.
Narrowing the Scope
A wealth of wonderful artifacts were gathered during the hunt for content. Among everything discovered, there were historical maps and land plots, deeds and documents, and even an illustration commemorating our city’s claim to fame, the discovery of one of the most complete mastodon skeletons of its time. My excitement for the project could have easily pushed it far beyond budget, so a decision had to be made. Ultimately, I decided that because of the medium I would be working with (a large 4k resolution touchscreen) and a desire for a cohesive look, the focus would need to be narrowed down to the highest quality historic photos. Thankfully there were plenty to choose from. The postcards made available to me were silver halide prints whose quality and resolution were remarkable for their age and small size. I also had access to large format and glass plate negatives that likely hadn’t been processed in over 100 years. This photographic record of the city’s history promised to offer the most visual appeal for the project while remaining logistically feasible and on budget.
03
Digital Archiving:
Scanning, restoration, and content organization
Content Creation
In order to handle the digitization process, I needed a photo scanner capable of handling the large format negatives. Luckily the library agreed to purchase a high-end model based on the fact that they could repurpose it for use within the library after the project was complete. Hundreds of images in varying formats were scanned at resolutions as high as 700 DPI and digitally cataloged. After the lengthy scanning process, I pulled the images with the greatest historical importance and highest image quality into a pool of potential prospects. Treasures from the earliest days of our city were uncovered, some dating as far back as 1885 or earlier.
Restoration
The restoration process proved to be one of the most time-consuming portions of the project. First, the photos were each individually cropped and adjusted for contrast, exposure, sharpness, and moderate dust removal. Some printed images (as opposed to photographs) with worthwhile historical significance also had to be de-screened. Finally, due to image variations, I added a subtle sepia tone to every image lacking that hue to bring uniformity to the collection.
Retouching
Unfortunately, roughly 50% of the images had been written on by either the original photographer or previous owners at some point in the past. While some of this information was useful in determining dates and origins, the handwritten notes contradicted a clean and uniform final look. While time-consuming, the use of clone stamping and content-aware fill to remove them was well worth it in the end.
Categorizing
Once the final collection of images was set, I set about grouping them into categories. With the help of several stakeholders, we came to a consensus on seven categorical labels, which encompassed all of the images in roughly equivalent-sized groupings.
Downtown
Streets
People
Buildings & Landmarks
Events
Education
Businesses
04
Design:
Logo, color palette, layout, and interaction design
Logo
As the design phase officially began, I realized we would need a text-based logo to identify the exhibit and for hosting purposes. After discussions with the board, we easily settled on “Historic Johnstown Ohio.” When I began discussing font choices, however, the room was divided. One stakeholder strongly preferred serif typefaces like Times New Roman, while another favored decorative script styles. Being pragmatic, I suggested we use a combination of both. The serif font I suggested was universally approved to be used for the city/state portion, which left only the script style to be debated. At the following meeting, I presented board members and library staff with several options to vote on, and although not my personal favorite, the Adobe font Avalon was decisively favored for looks and legibility.
Simple Style Guide
To finalize the logo details and begin preparing a complementary theme for the exhibit, I needed to incorporate a simple color scheme and additional font choices. A dark theme seemed appropriate for highlighting the photos, along with a mix of grays for the text. The subtle pop of color incorporated in the logo was based on the sepia tone, which I had applied to all of the photos in the earlier stage. Additionally, the stakeholders requested a star to indicate the city’s location on the stylized Ohio map.
Layout & Interactions
Naturally, I wanted the vintage photos to take center stage in the final product and span the entire width of the 4K touchscreen. The screen was quite tall once mounted in the library, so taking into consideration accessibility, inclusive design dictated that the primary navigational components should be located at the bottom so that children, wheelchair users, and patrons of all heights could still interact with the exhibit. Categories were to be listed in this lower navigation area, and images would be scrolled back or forth by touching the left or right halves of the display. The board members wanted to include informational captions for each image, so those descriptions were hidden under a small button that would allow users to surface/re-hide them on touch. Running short on time and budget, I delegated the task of writing those captions to two board members with extensive local history knowledge.
05
Project Completion:
Final design implementation, library unveiling, and final thoughts
Final Design
Informational captions were written, the final layout was put together, photos were uploaded to their respective galleries, and the project was essentially complete, minus the final on-site configuration of the touchscreen settings and the attached small form factor PC.
Photo Captions
Optional descriptive view after toggling the information button.
Instructions
One late addition at the request of the stakeholders was an instructional guide that would show patrons how to use all of the exhibit’s features.
Unveiling
Once the installers had mounted the touchscreen in the library, I traveled on-site for some IT work to finalize the project. Some tweaks were required to both the display and the host PC. After adjusting and testing the setup, it was ready to be officially unveiled to the public. The project was featured on the city’s website, the county library’s site, and social media, generating considerable interest and excitement.
The vintage photos of the townsfolk and city’s early beginnings truly are amazing, so feel free to view them at the address above, with the only caveat being that the site was never designed for mobile and should only be viewed on a widescreen monitor with the browser maximized to mimic the in-person experience of the permanent exhibit.
Conclusion
For several reasons, this project was one of my all-time favorites. I love photography, especially vintage photos showing earlier times and a forgotten way of life. Coupling that with my strong connection to the city and researching its past rapidly turned this into a passion project. Given a larger budget and more time, I would have liked to do more, perhaps some user testing of the interface, lengthier captions, past vs. present-day comparison shots, additional categories, and perhaps even an interactive map of the town. Unfortunately, I had already put in a healthy number of pro bono hours and inevitably had a timeline to meet. Overall though, I’m quite proud to have my name on the project, and my historical knowledge of the area now rivals that of lifetime local residents. There has been talk amongst the board members for me to expand on the project sometime in the future, but for now, it should remain a solid resource for old and young alike to see the simpler times our rapidly expanding city once embraced.