At long last, here’s the final group of wireframes we’ll blog about for our site redesign project: the individual collection homepages. Here’s an annotated look at one of our current collection homepages:
View this feedback (Collection Homepage – Current Site) on Notable
Prototypes
Here are six possibilities (A – F). We’ve used Ad*Access as an example, as it is our most-visited collection:
Analysis
The ideas in the prototypes stem from our analysis of the current site, per the following:
Web Analytics
- Collection homepages are big attractions. How big? Our most popular collections’ homepages are visited even more often than our portal page. Other than our main library homepage and our guide to citing sources, the AdAccess, AdViews, & EAA homepages were the most-visited pages in our entire library website (from June-Dec 2009).
- From our portal page, people are 3x more likely to browse to a collection homepage than they are to do a cross-collection search.
Interviews With Collection Sponsors
- Make it clear and obvious what a user should do upon visiting. Most people either want to search or browse. Put the search & browse options front & center.
- Move the paragraphs of text to a separate ‘about’ page.
- Give a visual taste of what kinds of things are in the collection.
- Show the most popular items in each collection.
- Let people more easily browse all of the available metadata for each collection (e.g., browse all companies in an ad collection).
- Use a better combination of fonts & colors to help the pages from feeling boring.
- Give each collection more character by using graphics that enforce branding.
Feedback Forms & Other User Feedback
- Avoid the “wall of text”; make the “home page copy read more like web copy.”
- Feature timelines more prominently
- Having two search boxes (one for inter-collection & one for intra-collection searches) is confusing.
Ideas From the Implementation Team
- Build a smart template that is 1) unified enough to make collection-publishing efficient and the user experience consistent, but 2) flexible enough to allow each collection to be individually branded (if desired) and to present the most optimal arrangement of browsing options given what’s in the collection.
- Incorporate blog posts on collection homepages, so experts have the ability to write about each collection on an ongoing basis.
- Provide advanced navigation options (like linked term clouds, timelines) for all collections.
Inspiring Examples from Around the Web
View this feedback (Brooklyn Museum Collection Homepage) on Notable
View this feedback (Hulu “Collection” Page) on Notable
View this feedback (Hugh Morton Collection Homepage) on Notable
View this feedback (Internet Archive: Moving Images Archive) on Notable
What do you think? Join in the conversation here in the comments, or comment anonymously via our feedback form.
Hi Sean,
My overall favorite is Design F, but would prefer to have categories moved to a browse tab as shown on Design D.
The placement of the various elements on Design F feels natural in light of how we know people have been using our current collections, and also in light of how we know people in general scan web page content (Jakob Nielsen has a good post about how people scan content on web pages)
I like the tabbed “highlights” and “most popular” options as shown on Design F. The multiple highlights images would be more visually appealing than having just a few images and would facilitate browsing.
The tabbed Facet links below the highlights images seems like a powerful and flexible way to appeal to our patrons’ demonstrated preference for browsing over searching, especially if the categories were included.
I like the layout of the collection logo and description as shown in Designs D, E, and F — at least it seems to work on the wireframes. I think it makes efficient use of the available space and creates a visual link between the logo image and the collection description.
Cheers,
Tom
Hi Sean,
I’ll be unable to attend your presentation on the prototypes, so I’ll just say here that my favorites are A,B, and F. I think A has a nice balance of images and text while still showing the search and browse possibilities without scrolling. I like the clean minimalism of B, though I’m sure it will get shot down as too text-heavy. F might be the busiest design to my eye, but I like that the content of the collection is explained right next to its logo and that you can still see searching and browsing capabilities and who to contact for help without scrolling (though it would be nice if you could see the tabs to browse on the first screen–can’t have it all, I guess).
Thanks,
Will