HF740-Expert-Usability-Review_BCBookstore

advertisement
HF740: Expert / Usability Review
Kristin Burgh
Name: Boston College Bookstore - http://www.bkstr.com/Home/10001-46404-1?demoKey=d
Figure 1 - Boston College Bookstore Landing Screen
Site Structure / Information Architecture
Is information logically grouped?
Excluding the use of the advanced product search bar, all merchandise is accessible via the
underlying menus of the Tier One navigation menu. Both the Tier One navigation menu and its
underlying drop-down menus are alphabetized from A-Z. Finally, the reasonable number of Toplevel navigational labels will not overwhelm the user.
Figure 2 - Top (Tier One) Navigation Menu
This top tier of information (see Figure 2) seems innocuous enough, however, when the user starts
to dig into sub-menus, he/she will find categories of merchandise that are redundantly grouped,
incorrectly tagged, inappropriately displayed and/or lacking in robust administrative and descriptive
metadata.
1
HF740: Expert / Usability Review
Kristin Burgh
Can I browse for and find what I’m looking for?
The site’s recall is superior to its precision in that queried objects can eventually be found, but they are
not grouped together in a logical fashion for easy findability.
Summary & Action Plan:
-
Inclusion of Best Practices (such as a “tag cloud”)
Map out the hierarchical relationships of all site merchandise to identify better-fitting
categorical buckets
o Special emphasis to be placed on parent/child/sibling relationships
Navigation
Can I get where I want to go? Do I know where I am? Can I get back? Are there strong visual cues?
The top-tier navigation bar is not necessarily intuitive. For example – the word “Collections” appears to
be used as a miscellaneous catchall category, which certainly does not help facilitate search. However,
once the user is able to find the desired merchandise, site navigation is actually quite easy.
Dynamic “breadcrumbs” at the top of each product page are extremely helpful to the user in being able
to navigate back to a previously visited level (or levels).
Figure 3 - Breadcrumbs help facilitate navigation
2
HF740: Expert / Usability Review
Kristin Burgh
Moreover, many of the product pages contain page numbers, so the user knows exactly where s/he is
with respect to viewing queried merchandise.
Figure 4 - Hyperlinks allow the users to jump back and forth between pages of content
Summary & Action Plan:
The Tier One navigation bar – and the “Collections” category in particular, have the possibility to send
users into the wrong area of search. However, once the user has found what he or she needed, it is easy
to navigate back and forth between the tiers of product categories and single-category merchandise.
Because the dynamic breadcrumbs and page number hyperlinks are already in play, no additional action
is recommended at this time.
Labels
Do they make sense?
The Tier One Navigation Labels are not entirely intuitive in that there is some ambiguity in the label
naming convention.
In some cases, the navigation menu labels are unnecessarily redundant. For example, the “Apparel”
Menu Heading offers a sub-menu item called “Men’s Accessories”, despite the fact that “Accessories” is
a separate Tier One Menu Label in its own right.
Moreover, these redundant Navigation Menu labels prevent the full range of menu categories from
being viewed “at a glance”. The user must make an extra click to see categories unfortunate enough to
start with letters at the end of the alphabet.
3
HF740: Expert / Usability Review
Kristin Burgh
Figure 5 - The Apparel Sub-Menu is too large to be displayed in its entirety
Figure 6 - Apparel>Accessories
4
HF740: Expert / Usability Review
Kristin Burgh
Are they descriptive?
The labels used to categorize merchandise are occasionally vague and confusing. For example, one
would expect that any category listed in the “Collections” menu would result in a variety of different
types of merchandise. In at least one instance – “Collections > St. Patrick’s Day” – only one item, a
hooded green sweatshirt, is displayed.
Figure 7 - BC's St. Patrick's Day "Collection" - a lone sweatshirt
Summary & Action Plan:
The labels used for categorization on the BC Bookstore website should be reviewed by prospective
users of different personas (Alumni, Current Student, Hockey Fan, etc.) for feedback and tweaked as
needed.
Terminology
Does it speak in the users’ language?
Improvements to terminology have the potential to dramatically increase sales through the website.
5
HF740: Expert / Usability Review
Kristin Burgh
Example 1 – Additional Recommendations
Regardless if the user is searching for workout attire, cufflinks or infant accessories, the same set of
objects are depicted as things the user “might also like”. These recommended items often bear no
resemblance to the queried merchandise.
Figure 8 - These 4 items are recommended to each user, regardless of his/her original search
Example 2 – Search term “Quilt”
When the term “Quilt” was typed into the index search, zero results were returned. Moreover, the site
did not suggest alternative keywords, such as “blanket”.
Figure 9 - "Quilt" vs. "Blanket"
6
HF740: Expert / Usability Review
Kristin Burgh
Is terminology consistent?
As previously outlined in two of the preceding sections (Labels and Information Architecture), the
language used within the site is occasionally redundant and inconsistent.
Summary & Action Plan:
-
Additional Recommendations should be tied to the parent or sibling terms of the requested
search terms
The list of synonyms should be expanded for greater findability.
The list of common misspellings should be reviewed and updated. A search on misspellings
of the word “blanket” resulted in 16 results. However, those results yielded everything
from blankets to gas grill covers.
Content
Is the information easy to scan?
The Content in any given search results or navigational category page is presented as easy-to-scan rows
of photographs with a brief description – each picture containing a brief description and price of the
product. Additionally, the stationary panel of filter options makes the act of refining the search an easy
one.
Figure 10 - Rows of merchandise with captions, Left-hand search filters
Read?
The Site Navigation Tabs and Labels employ an appropriate use of capitalization (very limited use of ALL
CAPS, which are more difficult to read). However, the font appears to be a little small onscreen.
Moreover, there is no mechanism for increasing the on-screen font size. The smaller font may present
challenges to visually impaired or older website users.
7
HF740: Expert / Usability Review
Kristin Burgh
Meet the users’ needs?
The content display could be improved at the product page level. For example, within the apparel
section, a link to a sizing chart would be helpful. Additionally, seeing the object from a number of
different angles (front, side, back) would be useful.
Figure 11 - Example Product Page
Summary & Action Plan
While there are many positive attributes about the manner in which the content is displayed on the
website, there is certainly room for a few improvements. The site should be reviewed to ensure
compliance with standards such as the Americans with Disabilities Act (ADA) Accessibility Guidelines.
Finally, the product page template could be compared against well-known retail websites – such as
Amazon.com or LLBean.com, to ensure that all industry best practices such as easy access to a clothingsizing chart are made available.
Workflow
Does a process follow a logical flow?
There is not always enough information about a particular product available to facilitate a workflow. For
example, upon selecting the ‘Top Sox® Boston College Women's Knee High Socks’, I had to take the
steps of selecting my size and color before I received a message that this particular product was on back
order. As such, I was unable to add the product to my cart.
Are the tasks I do the most easily accessible? Can tasks be segmented by role?
8
HF740: Expert / Usability Review
Kristin Burgh
At present, there does not seem to be an easy way to see previously viewed merchandise. Moreover,
while more research would be needed, BC may wish to consider exploring the ability to customize the
user’s shopping experience by role (Student, Alumni, etc.). A sophomore studying biology is less likely to
be interested in diploma frames than a recent graduate. An older alumnus probably won’t purchase
textbooks. As such, it would make sense to de-emphasize those items that are unlikely to be purchased
by a particular user group in favor of those that are.
Summary & Action Plan:
-
Recommend the implementation of role-based filter to facilitate navigation. Example “I am a
student” would emphasize and help facilitate the purchase of textbooks, backpacks, dorm room
sundries and the like. On the other hand “I am an alumni/a” could result in a workflow that helps
that BC grad shop for things like artwork, jewelry, Boston College Alumni license plate frames, etc.
-
Recommend increased focus on demographics capture (either through account selection or by onsite user selection)
Figure 12 - Captured Demographics could be used to create role-based views
-
Recommend implementation of Best Practices from the following websites:
- David’s Bridal - http://www.davidsbridal.com/HomeView
- Gilt.com - http://www.davidsbridal.com/Product_Chiffon-Sweetheart-Short-Dress-with-CapSleeves-F15406_Bridal-Party-Bridesmaids-Short-Bridesmaid-Dresses
9
HF740: Expert / Usability Review
Kristin Burgh
Page Layout
Are pages laid out in a manner that lets users easily find what they want?
In this example, the home page layout depicts the several features, including the Tier One
Navigation bar, offers on textbooks and what one can presume to be popular content (hockey gear,
etc.).
Figure 13 - BC Bookstore Website Landing Page
As mentioned in previous sections of this assessment, the Tier One navigation bar needs to be
revised and trapped white space would need to be removed to bring more content “above the fold”
– making it more visible to site users/consumers.
Is content presented in a hierarchical manner?
To some degree, content is presented in a hierarchical manner; however, site navigation would
improve with an additional level of classification. For example “Supplies > Dorm Supplies” results in
the display of everything from shower caddies to coffee makers. A better approach might be
“Supplies > Dorm Supplies> Small Appliances” for the coffee makes and “Supplies > Dorm Supplies >
Shower Supplies” for the caddy.
Can users easily understand where to go or what to do next?
Improved Tier One Navigation labels will help users better understand where to find desired
content.
10
HF740: Expert / Usability Review
Kristin Burgh
Summary & Action Plan
-
Implement an additional level of navigation as needed
Update Tier One Navigation Labels
Controls
Are controls consistently used and correctly used?
The BC Bookstore website appears to leverage a number of widely accepted conventions that
appear to function as they should.
-
Single-clicking on a navigation tab brings up a drop-down menu
Clicking the “Search” button next to the advanced index search begins the site search
Drop down menus are used to select colors or sizes of select merchandise. They
operate as expected when the drop-down arrow to the right is single-clicked.
Figure 14 - A Drop-down menu appears when the navigation label is selected
An industry standard that is not embedded in the website is the use of blue underlined text to
represent hyperlinks.
Are they in proximity to the area they control?
The controls seem to be in proximity to the areas they control. There do not appear to be any
significant usability issues on this front.
Summary & Action Plan
This area does not appear to need much re-work.
11
HF740: Expert / Usability Review
Kristin Burgh
Search
Is Search global and logically placed?
The search on this website is uniformly located in an easy-to-find, intuitive place on the top righthand side of the screen.
Figure 15 - BC Bookstore Website Search Bar
Are search results relevant and useful?
The test searches performed with a sampling of keywords (“football”, “women”, “diploma”, “golf”)
yielded very relevant results. In fact, searching consistently provided better results than browsing.
Figure 16 - Search results for "Golf" - All very relevant to the game
12
HF740: Expert / Usability Review
Kristin Burgh
Summary & Action Plan
The search feature on the Boston College Bookstore website is well placed, easy to use and yields good
results. No changes should be made at this time.
Visual Design
Does the visual design help organize the page for the user and guide them through the site?
Visually speaking, the Boston College Bookstore website meets a number of standards consistent with
the average online retailer.
-
The merchandise is displayed as easy-to-recognize rows of icons (Gestalt)
The familiar “shopping cart” mechanism should be well known to most users (existing mental
model)
The use of menus should help the user navigate the site, as does the “Refine your search”
product panel
The site employs a good use of color and contrast in color of the maroon main navigation menu
boxes and the white text
Bonus: The site employs Boston College Color scheme (Maroon & Gold - with accents of white or black)
Summary & Action Plan
A number of minor improvements would help improve the User Experience
-
Remove the abundance of trapped white space
Reposition the site content so that more of it is “above the fold”
Addition of a “home” icon
Move the site map and the social media/sharing component to the top of the screen
Figure 17 - Site Map and Facebook links should be re-located from the bottom of the screen (current) to the top
13
HF740: Expert / Usability Review
Kristin Burgh
References:
Amazon.com - http://www.amazon.com/clothing-accessories-men-womenkids/b/ref=sd_allcat_apr?ie=UTF8&node=1036592
Bentley University Bookstore http://bentley.bncollege.com/webapp/wcs/stores/servlet/BNCBHomePage?catalogId=10001&storeId=2
1552&langId=-1
Boston College Bookstore – https://www.bkstr.com/Home/10001-46404-1?demoKey=d
David’s Bridal - http://www.davidsbridal.com/HomeView
Gilt.com - http://www.davidsbridal.com/Product_Chiffon-Sweetheart-Short-Dress-with-Cap-SleevesF15406_Bridal-Party-Bridesmaids-Short-Bridesmaid-Dresses
14
Download