SPOILER ALERT: If you’d rather skip all the words and play with the new site, scroll to the end of this post, find the groundhog and watch the short video for login instructions.
One great pleasure of working in a creative environment like an art museum is that on occasion, we actually get to create things that are unique, tangible, and if we’ve done our job… useful.
It’s one of the reasons I love to cook. The process of pulling together all the right ingredients and a little skill to create a delightful experience that can be shared with others seems so personal, meaningful, visceral. In short, very different from most of what keeps me busy on most days. So, it was a great honor to have the chance over the last six months to work together with so many talented staff from around the museum in creating and reformulating a new website for the IMA.
Over the last several years, the IMA has invested a lot of energy and resource in understanding and making use of the web in ways that help the museum meet its goals and carry out its mission. Along the way, we’ve learned a lot. We are constantly learning from our audience and visitors – watching the way they interact with content, reading comments, and listening to feedback. We’ve learned immensely through our relationships and collaborations with other museums about what has worked and not in the past and about new thoughts, strategies and approaches we might try. If I’m honest, we’ve definitely learned the most from our failures. Hopefully, we’ve disguised most of them cleverly, but come join us for a beer in the cafe and we’ll share a bunch of the “less-than-superstar” moments.
In talking about how we might launch this new site we’ve been working so hard on, it only seemed right to give the first sneak peeks and behind-the-scenes privileges to our online followers. So, like any great dish, this one’s hot off the grill and just for you!
One of the first things you’ll notice about the new website is that we’ve gone with a completely different design-feel from our earlier site. Part of this is inspired by a new brand for the IMA which you’ll notice featured prominently across the site. We wanted to shoot for a design that is clean and well structured, but still very visual and full of color. You’ll notice that we stuck to a consistent grid layout on the site which lets us be pretty modular in the way we mix and match content.
As you dig deeper into the site, you’ll see that we kept the visual stimulus going, using a mix of video, photography and some interactive elements to capture attention and provide an engaging experience. On most pages, you’ll notice a sidebar called “More Like This”. This sidebar features content relations from across the web that relate to the to the current page content. These relations are a mix of automated suggestions as well as hand-picked content that relates to the page you’re looking at.
One of the issues we wanted to address with this redesign was to make it easier for online visitors to find content on the site. One primary focus of this work was the simplification of the menu navigation. The IMA is an organization with an amazing breadth of programming and collections, so it was a challenge to streamline the navigation of the site and make it easier to find information. You’ll notice a single layer of top-level menus that expand when you roll over them. These menus are the same across every page of the website and provide a consistent anchor for visitors to turn to as they navigate around the site. Since many of our visitors enter the site from search engines, a significant number of them might not ever reach the front page of the site. You’ll see that we expanded a few of the menus to include additional information and tools. These Mega-Menus provide an easy way for visitors across the site to access tools for searching the collection, getting directions to the museums or linking to featured pages of content.
One of the core areas of the site that has undergone a complete transformation is the underlying search engine technology. This is one of those features that can’t be explained in a glossy image or paragraph of techno-jargon. You really have to experience it to understand its power. One of the easiest ways to play around with the search engine is with the Live search feature in the upper right-hand corner of the site. You’ll notice that as you start typing, the Live Search automatically provides a number of suggestions for you that might match your query. You’ll notice that these are broken out by type (Artwork, Exhibition, Artist) and provide thumbnail images when appropriate. What you may not notice at first is that in addition, this search can also access videos on ArtBabble, posts on our Blog, even images from Flickr. Every time you press a key, we’re searching over 60,000 pages of content to return the best answers to you.
Another area of the new website that benefits from the work we’ve done on the search engine is the Collection Search Page. We wanted to provide an experience that would let someone who has a specific search in mind, find what they want quickly… but also an interface that could support an enjoyable browsing experience that is both visual and simple. As you roll over the thumbnail images on the page you’ll notice that we add more information about the work you’re hovering on and show the full thumbnail of the work. From this roll-over you can easily tell whether the work is on view today, access a magnified image and link to a page with the full information about the work.
You’ll notice that when you type in a search, the left-hand menu expands to allow you to filter your results by creator and also by descriptive tags added by other users. Doing so provides a really powerful way to combine the information from our collection databases with the way these works are experienced and understood by visitors.
If you click on the “More+” button on the collection search toolbar, you’ll unroll some additional tools which let you restrict your search by department, materials, object type and a few sliders which let you set a date range you’re interested in.
In my experience, one of the most frustrating things about museum websites is that they frequently have really terrible calendars! Our own website was a prime example of that phenomenon. I must admit, it just wasn’t very good. In our defense (and the defense of all the museum webmasters screaming into their laptops), the problem is that museums have crazy calendars. The problem is just pretty darn hard. Some events repeat, some don’t. Some events (like exhibitions) last for months, others last only one hour. Events like classes meet many times over the course of a few weeks. Our desire, is that all of these events be accessible on one nice neat little page of boxes… aint gonna happen.
We’ve decided to take a little bit different approach for our calendar this time around. Instead of a traditional list, or box-based calendar, we’re opting for more of a timeline. In our design process, we found that timelines supported the kind of variation in events that we see in our museum much better than any of the more traditional options. In one eyeful of timeline, we can show you an entire month’s worth of events at the museum. Pairing the somewhat novel timeline interface with a traditional date picker on the left will be a nice fall back for those who prefer a more traditional interface, and provides a nice way to index directly to dates you’re interested in. The scrollable action of the timeline will let users browse to find out more about the pattern of offerings here at the IMA. A clickable legend in the right sidebar, lets visitors filter events down to see only the ones they’re interested in. Every event is available at your fingertips and it’s easy to see what exhibitions will be on while you’re here.
One of the things I think we’re all aware of is how much the mobile web is changing the way we seek and access information. As we’ve watched our web statistics, we’ve seen a steadily increasing number of users coming to our website from mobile platforms. We can only anticipate that this trend will continue. As such, we wanted to be sure to offer a specialized experience for mobile users which still let’s them bail-out easily to our full website. The new website features a specialized mobile page with information you might want to check while you’re on the go… hours, directions, showtimes etc… If you’re looking for the main site, just click the button on the bottom of the page. You can always toggle back to the mobile site by using the call out from the IMA homepage (note: this mobile page icon only appears in mobile browsers)
In addition to the calendar, the other area that was not very good on our old site was the way we handled ticket sales and memberships online. Not that there was anything insecure or hacky about the software, just that it was darn hard to use. We’ve done an extensive amount of work since that time to replace those systems with a new one that we’ve integrated in-house and customized to make this process as easy and painless as possible. Why should it be hard?
Finally, one of the new areas of the site that I’m most excited about is called “Interact”. Maybe this is preaching to the choir since you ARE reading this on the IMA’s Blog… but we’ve been doing some really amazing stuff around the web in the last few years. We’ve been sorting out the kinds of content and social media tools that give audiences an inside scoop on a pretty amazing institution. We’ve also been learning a TON from YOU. I think all of us here get totally jazzed when we see a really insightful comment on the Blog or when someone tells us a really cool story about experiences they’ve had at the museum. You also take us to task occasionally which is good for us, and helps us grow and get better!
The problem is that most of that content was really buried on our previous sight, and unless you knew where to look, you probably missed it. The Interact section is a much stronger attempt at providing a home where many of these efforts can live. Interact will be an easy place for you to find links to our social media efforts, comments you’ve left for us on twitter, on the site, or tags you’ve added to describe your favorite works of art.
Stay tuned to Interact for some pretty fun ideas we have about how to continue to give you all more and better sneak peeks and insider info on what’s next at the IMA.
One of the things that we’ve been dying to put together for a while is called TagTours. This new area of content on the site gives you a novel way to bring together works from across the collection that might not otherwise be thought of as connected. Need a way to impress a date? Like Sports? Animals? These tours provide a unique way to experience the IMA’s collections online.
Enough of the chatter, let’s get on to the good stuff… but first a word from our sponsors. Click through and watch this video to get the super secret and ever-so-clever username and password to access our new site
Over the next few weeks staff from the IMA’s webteam will go into a bit more depth on each of these features to explain a little bit more about how they work and why they do what they do. As always, the IMA is committed to continuing to help other museums develop better tools and techniques for succeeding online. We’ll be examining which of these features might be released as open-source tools that can be picked up and used by any museum that needs them.
Thanks for sticking with this rather lengthy article. As always, please leave comments / questions / suggestions for us in the comments. As I mentioned above, we learn a ton from you and your input and would so much appreciate your thoughts! -Rob
Filed under: Technology