The International Tennis Hall of Fame turned to Braid to strengthen their digital identity, and to start opening their rich collection to the world.
Located in the beautiful seaside city of Newport, Rhode Island, the International Tennis Hall of Fame is not quite in no-man’s-land, but neither is it a top 10 tourist destination. Understanding that only the finite number of tennis fans visiting Newport could walk through the doors of their beautiful museum each year, they were looking for ways to serve the broader fanbase.
To help them with this initiative, they turned to Braid to help strengthen their digital identity and to start opening their rich collection to the world — online. As a result, we’ve kicked off a series of collections that capture the uniqueness of physical museum exhibits and presented them in an entirely new way.
In our conversations with the International Tennis Hall of Fame, it quickly came to light that their focus should be centered around their expertise in content curation. Their collection, while vast, is not nearly as valuable as their ability to adroitly curate their content to guide visitors through an experience. While digitally archiving assets is important, it’s much more interesting to leverage that collection to tell an engaging story.
The International Tennis Hall of Fame museum contains in excess of 25,000 physical artifacts. Of this collection, there were over 600 tins, cans, and cartons that needed representation in their online collection.
This assortment of the sport’s distinctive containers — dating as far back as the 1880s — served as a lens through which to chronicle the history of tennis
Braid worked with The International Tennis Hall of Fame to organize this vast collection into something users could easily digest, while also showcasing the full diversity and art contained in each unique can design. To achieve this, we created a custom digital feature called “Tins, Cans, and Cartons” which organizes the artifacts into distinct groups and curates a notable selection of each for special treatment — thus providing both breadth for the full collection and depth for a curated few.
Advanced search filters play into a greater searchable digital collection, now serving as a resource to tennis researchers across the globe. Because many of the can designs have been used to create replica travel mugs, interested users perusing the collection have the opportunity to purchase mugs and display some of their favorite iconic cans at home and on the go.
To accomplish our goals for the digital collection we used Contentful, a hosted and headless CMS, to manage the content represented in the can collection. The International Tennis Hall of Fame was able to import assets and handle content updates easily without any dependence on Braid. This flexibility meant the International Tennis Hall of Fame team could continue focusing on what they do best: promoting the history of tennis and celebrating its champions.
With the International Tennis Hall of Fame equipped to manage the over 600 assets represented in the can collection, we got to work on engineering the application that would display them.
How do you load over 600 detailed assets without creating absurdly long load times? Very carefully.
Braid heavily leveraged advanced lazy-loading techniques to allow content to flow into the application as it was needed and not a moment sooner. While there are over 100MB of images represented in the collection, users are able to start browsing with a less than 5MB initial payload. Images are also coded in a way that allows the document to know the ratio of the image before it is loaded. This technique allows us to ensure that even if images take longer than expected to fully load, the user does not experience jarring jumps as they load in.
The final engineering challenge was handling the display and filtering of all 600+ assets on the final “full collection“ section. Normally when dealing with front-end engineering challenges it’s enough to filter data and replace your full collection with a new set of data that represents the desired subset. In our case, asking the browser to remove 600 nodes was easy, but asking the browser to inject all 600 items back at once caused performance issues. In the end, we elected to always maintain the full array of items and only toggle their visibility in response to the filtering. This resulted in a far less taxing set of operations being expected of a user’s web browser. Cue Bruce Banner (The Hulk), “That’s my secret, I’m always 600 items long”.
The goal of the “Tins, Cans, and Cartons” collection was to create an easy way to experience both the depth and breadth of the International Tennis Hall of Fame’s physical collection.
The experience was broken into several smaller collections centered around specific time periods and other shared attributes. The experience concludes with the full tennis can and container collection, in its entirety, being presented with advanced search and filtering controls. The finale strives to recreate the “shock-and-awe” moment found in the International Tennis Hall of Fame’s physical museum which concludes with a large display case packed with hundreds of varied tennis ball containers from their collection.
The mixed approach of depth and breadth allowed us to strike a balance between the guided structure a visitor would expect when viewing display cases at a physical museum exhibit with the freedom and advanced control that can only be achieved through a digital experience.
Other features currently underway to improve the International Tennis Hall of Fame’s existing site include a fan-voting application, helping to increase fan voting and induction into the International Tennis Hall of Fame, as well as several other digital features to follow the can collection. As we continue to explore innovative ways to tell stories with digital assets we’re confident we’ll be able to help the International Tennis Hall of Fame better serve their growing community for years to come.