Design: Enhanced Visual Design
The mockups below illustrate ideas for enhancing the design of Spotlight to provide a more "museum-like" or visually-oriented look and feel. We are implementing at least some of these ideas during our February, 2015 development sprints.
A relatively simple way we might be able to give the Spotlight exhibit a more visual feel is simply using a background image, drawn from the exhibit collection, for the site masthead. Below are a couple of examples of how this might look:
These homepage mockups illustrate a few new widgets that are intended to give the page (as well as feature pages) a more visual emphasis.
New "image-grid" widget (top) and a "highlight browse categories" widget:
A "highlight browse categories" widget (top), "highlight feature pages" widget (middle), and the existing "item + text" widget:
One idea we'd like to pursue is moving the facet sidebar to an overlay, thereby giving us the full width of the viewport to display page content. Here's an example of how that might look (the "Refine results" button is the trigger for showing the facet overlay):
And with the overlay displayed (not explored here is making the overlay wider; we now have more horizontal space to work with in terms of displaying the facets):
Another goal is to produce additional search result views that have a more visual emphasis. For example, we've already started work on a variation of this masonry-style layout (to be added to the Blacklight Gallery gem):
Another area where we believe we can improve the visual emphasis of a Spotlight exhibit is how we display the published Browse Categories (saved searches). Here, for example, is a revised browse landing page:
And below is an idea for a new browse detail page (shown after the user clicks on a specific browse category from the landing page). This idea collapses the site masthead and navigation so that we can show a browse category-specific masthead, to reinforce to the user the idea that they are now exploring the part of the exhibit represented by that browse category:
Finally, we hope to do something similar to browse with the feature pages. Our ideas for this are not yet as fully fleshed out as for the examples above, but we're interested in helping the user who has clicked on a feature page to focus their attention to that feature, while also making the other feature pages easily accessible.
For example, a parent-level feature page:
And a child page of that parent:
