Site Design Feature of the Month: thestlbrowns.com

June 15, 2015 Hannah Green

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.

Homepage

First Impression
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

History Image

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.

players image

More Content
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

Final Thoughts
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.

Subscribe

The One North Ideas Update delivers each month’s latest posts on digital for PSOs—including industry trends, news and our latest research—directly to your inbox. Although it’s our goal to always include thought-provoking and compelling content, you can unsubscribe at any time. 

See our Privacy Policy to learn more about how we protect and manage your submitted data.

Hannah Green Art Director

As Art Directorr at One North, Hannah designs thoughtful, engaging and visually stimulating digital experiences. Leveraging her collaborative partners across pillars, she delivers innovative concepts that push her clients creatively and function seamlessly across all devices and platforms. 

  • Last thing you geeked out about: My tomato plant at home finally producing purple heirlooms… only to be destroyed by a tree rat (i.e. a squirrel) shortly after.
  • Favorite Chicago spot: It’s a toss up between Wrigley Field, my apartment rooftop or anywhere that serves a great dirty martini with bleu cheese-stuffed olives.

One North Interactive 
222 North LaSalle St, #1500
Chicago, IL 60601

+1 312.469.1740