wrenaria
commented
5 years ago @spelkey-ucd I updated the UI design breakdown in my initial comment to include the addition of the "Browse by Subject" section.
Open wrenaria opened 5 years ago
wrenaria
commented
5 years ago @spelkey-ucd I updated the UI design breakdown in my initial comment to include the addition of the "Browse by Subject" section.
Metadata decisions are being finalized (should hopefully be done with that next week), which will affect the Database WP form, but the front end UI design is about ready to go, barring anyone suggesting changes. Let's get into it.
Search Box on Homepage
This stays close to the same with a few text placement adjustments.
Technically Advanced Search and Browse go to same place (Database page), but we want to display both options.
Search Box: Desktop Mockup
Search Box: Mobile Mockup
Database Page Search Box and Browse Functions
Advanced Search
The Library Search widget currently on the Database page will be replaced by the Database Search interface. Searching from the homepage will move users into this interface after they press search (or after clicking on Advanced Search or Browse A-Z).
The Database Search interface contains 3 filters beyond the standard keyword search field:
Results will display in order of relevancy. If a subject is selected (and only then), "recommended" core databases will float to the front and be marked by a star. Mouseover text will explain that this is a "Top recommended database in selected subject". Recommended/core databases are chosen by librarians via WP field -- see issue #6.
In addition, the Browse A-Z letters will respond to applied search parameters. Clicking on a letter will remove all results that do not begin with that letter but will retain order of relevancy in the results display.
Browse By Subject
In addition to the Search widget, the default Databases page will display a "Browse Databases By Subject" option with the possible subjects grouped under appropriate bucket headings. Clicking on a Subject essentially performs a Subject search for them, filling in the "Subject" drop down and displaying results by relevancy.
For the full list of bucket headings, see Issue #6.
Database Search: Desktop Mockups
Below is an example of the base Database page including the new Search Interface + Browse by Subject layout.
This next version of the mock-up shows what a completed search might look like, including an example of subject results, inactive A-Z button styling (button same color as background, #808080 color text), and recommended/core databases.
The "Sort by Relevance / Alphabetical" is a nice to have feature, but can be dropped if it becomes too complex to implement.
Database Search: Tablet/Mobile Mockups
Mock-up without subject selected, with examples of inactive alphabet buttons
In smallest mobile break, check boxes stack.