Each month, we will be showcasing out-of-industry sites that exhibit creative and innovative digital design. This post features thestlbrowns.com - the new St. Louis Browns Historical Society site.
The St. Louis Browns were a major league baseball team for 52 years. In their relatively short run, they lost most of their games, had some of the worst attendance records to date and are considered to be one of the least remembered teams of all time. In an effort to share the rich (and mildly disappointing) history of the team and its players, the St. Louis Browns Historical Society recently launched thestlbrowns.com - and it’s a lot more impressive than the team's record.
The design of the site is very vintage. The large textured type and old baseball reels are reminiscent of newspaper headlines and wartime movies. Together, these rustic homepage elements do a fantastic job of setting the tone for what is undoubtedly an interactive story. Throughout the rest of the site, small details help to visually incorporate the baseball theme into the design.
Notable thematic design features include:
- Baseball diamond loading animations
- Hover states that transform a hamburger menu into a baseball
- Baseball-card style bio pages
- Baseball-themed buttons
Designed to Tell a Story
Once you’ve made it to the homepage, the site prompts you to "Play Ball." This call-to-action opens up a digital storybook of sorts. From the early years to the Bill Veeck era, the site presents each major point in the team's history as a chapter. The horizontal scroll even gives you the same feeling that you get when you turn the pages of a book. Clicking on one of the chapters brings you to a flickering title page followed by a vertical timeline. Between short paragraph long stories and bold infographics, the site tells the story of the St Louis Browns in an easy, comprehensive way. The chapters are relatively short and flow nicely with subtle scoreboard-esque animations along the way.
While the primary focus of the site is the history of the team, the other pages were no afterthought. The ‘Players’ page in particular is one of my favorites. Again, we find ourselves using a horizontal scroll to fade in and out from one player bio to the next. Players are presented in alphabetical order and highlight some of the more colorful individuals on the team. By viewing more details, a baseball-card-style synopsis appears. For even more player information, you can click ‘More Stats’ to open up a different page with a more in-depth biography. Other pages include:
- An about section that introduces the board and the intent of the site
- A membership page that allows you to read the ‘Membership Pledge’ and fill out a form to join the Browns Historical Society
- Links to the blog and social media
Let’s be honest, I was not exactly enthralled by the lackluster history of the St Louis Browns, BUT I didn’t fall asleep either. A number of thoughtful design and strategy decisions, with a hint of comedy sprinkled throughout, helped me to effortlessly get through the material. They aren’t trying to make the team out to be something they weren’t. They actually pay homage to how truly awful the team was (note some of the site snapshots above). But more importantly, the design of the site presents content in a manner that is somewhere between a traditional book and a simple film. When combined, the animations, alternating scroll, digestible content length and interesting imagery create enough intriguing interactivity for me to take a pleasant journey through the full story - and, hey, wasn’t that the point? Well done, St Louis Browns Historical Society, well done.
P.S. Go Cubs
Want to see more featured sites and digital trends? Explore One North's monthly Best of series.