Redesigning our website with AREA 17.

Shelley Bernstein
Aug 9, 2017 · 7 min read

I’m happy to announce that we’ve just launched our website redesign. In selecting a firm we were looking for a team that could bring excellent design and strategy skills to the table and, also, a firm that would take our lead in engineering specifications, and would open source code and knowledge about the project. It took us a lot longer than we anticipated to find the right match, but the choice was clear when we landed on AREA 17.

check out the newly redesigned www.barnesfoundation.org

Here’s a run down of our main objectives and the broad brushstrokes of how we handled them. Kemp Attwood from AREA 17 will expand in greater detail in posts that follow on the Barnes publication.

Telling the story of who we are.

Old homepage (left) and new (right). The new homepage works feature more than just the collection while keeping focus to just three unique things at a time.

We restructured the site to put different types of activities forward — notice the homepage works to highlight three varied things, but just three so we can maintain a focus. We also worked to bring certain aspects of our activities together and, as a result, we’ve consolidated “exhibitions” and “programs” into an area called “What’s On.” This helps foreground all types of activities equally while generating cross-traffic among them. The same thinking is behind the “go further” areas across most pages of the site — while this is somewhat expected in sites today, it was critical given our goals.

You’ll also see threads of our audience development strategy at work in the new design. In “What’s On” you’ll find a series of filters with labels like “free” and “family” and “social” — all of these represent ideas we might not be immediately known for, but in bringing forward enable audiences to discover us in new ways.

Filters use themes or ideas to impart things people might not normally think of us as presenting.

It’s also worth noting that many people are confused by our name — The Barnes Foundation — and wonder…do we give money to others? Well, we don’t— a grant giving organization is the one thing we’re not, so even though the formality of our full name remains, you’ll find we refer to ourselves more informally across the site as, simply, “The Barnes.”

Putting visitors first, ahead of staff needs.

The easiest way to see this is in our old top navigation….

…and comparing it to the new top nav.

But, you’ll also find visitor driven thinking in other places, too. There is always a want from internal stakeholders to put everything on the website just because it’s infinitely expandable, but our challenge was to create a focus — a minimalist and highly curated one — and stick to it. As a result, we’ve thought a great deal about reducing density and complication while offering people more focused information. This is easily seen in the “Plan Your Visit” section where you’ll find collapsable choices with specific information based on how you plan arrive — by car, public transit, or bike — or how you’d like to use the museum — what services, how many in a tour. All need to be here, but we’ve reduced the density and designed the page to hide the things you don’t need while giving you the things you do.

Old visit page (left) and new (right) where information has been condensed and put behind user-driven choices, so information is delivered need-to-know.

Notice, too, every section has a large text to call out a main idea. Every section, in both its navigation and subsequent text, also pitches to specific audiences.

Every section has a text call out, clear calls to action, and navigation geared toward the needs of visitors.

This kind of focus required a lot of discipline during the redesign process, but, even more importantly, will be critical to continue as we move forward into growing the site.

An immersive experience.

New exhibition page (left) and event page (right) — the modules are the same but the weight of the image differs.

Additionally, we asked AREA 17 to think about “every page as a landing page.” This is important on the modern web where social sharing often lands you at a place within the site, not at the home page. As a small org, we can’t build a microsite for everything — we need clean, immersive, and clear landing pages for everything — as if any page could function as its own microsite…without it being one. A17 really delivered here and the event and exhibition pages easily demonstrate this.

Ditching templates for modules.

Now we have modules that apply to pages instead of a template structure.

We’ve got a run book in suggested use cases, so we don’t muck up AREA 17’s design, and we get to glide forward. This idea builds on things we’ve seen in the commercial sector where “build-your-own” hosting engines like Squarespace, SplashThat, etc., utilize this kind of thing. I’ve just never seen the concept used for a site of this size and in a cultural application.

A practical CMS choice.

End to end — from our first kickoff meeting to launch — the entire process took us seven months. That said, it took us five months to find the right firm. In looking back this was the most important step in the process.

I hope you can see the results in AREA 17’s work — we sure do.

Barnes Foundation

Visitor experience, digital content, and strategy from…