Product Browsing_UAR_2019.pdf

Unicor

Usability Audit Review

Product Browsing

Sunny Beach Senior Usability Analyst

April 2019

Property of ForeSee – Proprietary & Confidential

AMD 02 – ATTACHMENT 02

Agenda

› ForeSee Usability Methodology

• Scope and Specifications

• Top Usability Issues

• Bottom Line

Audit Analysis Findings

ForeSee Usability Methodology

• Comparison against proprietary usability indicators

• Pass/Fail metric

• Measures specific aspects of usability

• Established best practice standards

• Expert analysis prioritizes key improvements

• Most pervasive and severe issues

• Most impactful opportunities

• Top issues illustrated

• Tactical recommendations

• Best practice examples from inside and outside industry

• ForeSee Usability Methodology

› Scope and Specifications

• Top Usability Issues

Scope and Specifications

This analysis begins on the homepage and includes navigating to product information, comparing options, and selecting items to purchase or receive a quote. It focuses on listing pages, detailed product information, and product configuration messaging as well as saved and shared carts.

• April 2019

• 1366 x 768

• Iterative Evaluation

• ForeSee Usability Methodology

• Scope and Specifications

› Top Usability Issues

Top Usability Issues

• Site Structure

• Orientation

• Save Cart

• Shared Cart

• Quote Request

• Imagery

• Specifications

• Visual Hierarchy

• Expected Location

Site Structure

Unicor does not adequately separate products from services. While the homepage includes a link to Our

Products and Our Services , both links lead to the same page.

This disorients customers who anticipate specific information for each type of product.

Recommendations:

• Provide dedicated landing pages for

Products and Services.

• Ensure links from the homepage and cascading menu provide access to both Product and Service landing pages.

Products and Services links lead to the same page

Issue 1: Site Structure

The Unicor.com site includes instances where it is unclear if products are stock or customized. As shown here, the link to Print Products leads to a page with the heading of Print Products and Bindery

Services. This category includes products which can be ordered as well as custom items which require a quote.

In order to streamline online purchases and guide customers to relevant custom capabilities, each type of offering should be presented in a separate section of the site.

Recommendation: Provide separate browsing pathways for stock products and for items that require a quote for service.

Products can be stock or customized

The creation of dedicated browsing pathways for Products and Services would help set customer expectations and guide them to relevant information. Within products, a distinction could be made for items that are stock and those which require customization.

Example: Site structure

Issue 1: Site Structure

Mockup

• Products

- Stock

- Customized

• Services

- Customized

Site Structure

• Provide dedicated landing pages for Products and Services.

• Ensure links from the homepage and cascading menu provide access to both Product and Service landing pages.

• Provide separate browsing pathways for stock products and for items that require a quote for service.

Recommendations

Orientation

The global navigation lacks an indication of the current category customers are viewing. Providing this visual cue is important, not only for those who have navigated to the page from within the site, but also for those who have arrived from an outside source, such as an external link or search engine results.

Recommendation: Differentiate the global navigation item corresponding to the page customers are currently viewing.

Global navigation lacks orientation cues

Issue 2: Orientation

Additionally, subcategory navigation in the left sidebar lacks highlighting to indicate the current page. Without this information, visitors must spend more time to understand the relationship between the current content and other information within the section. Visitors rely on these visual cues as a reference point to understand where they are; thus, they should be clearly visually differentiated.

Recommendation: Provide navigational highlighting to indicate the current page in the left sidebar.

Current subcategory page is not highlighted

Furthermore, the global navigation label is different than the site structure indicated by the breadcrumb trail. Customers must pause momentarily to recognize that the Shopping label refers to the Products &

Services category. Even small labeling issues add to customers’ cognitive load and should be avoided.

Best practice calls for breadcrumb trails to accurately reflect the path to the current page by displaying the category and subcategory structure.

Recommendation: Ensure breadcrumb link labels match the terms used in the global navigation.

Breadcrumb trails are inaccurate

Orientation

• Differentiate the global navigation item corresponding to the page customers are currently viewing.

• Provide navigational highlighting to indicate the current page in the left sidebar.

• Ensure breadcrumb link labels match the terms used in the global navigation.

Recommendations

Save Cart

Unicor lacks messaging to inform customers how long their cart will be saved by default. Without this information, customers will be disappointed when they return and cart contents are no longer available. Best practice is to retain cart contents for both logged in and non-logged in visitors.

Recommendations:

• Ensure the cart retains items for both authenticated and non-authenticated visitors.

• Provide messaging about the length of time items are retained.

The Cart lacks information about how long it will be saved

Issue 3: Save Cart

Customers who click Save Cart are not provided with guidance. The Save Cart page lacks information about items in the cart or the cart cost.

As shown here, the fields for Quantity, Name, Description, and Total are blank. Customers are forced to remember what items they selected as they name the saved cart.

Recommendation: Provide an overview of cart contents during the Save Cart process.

Save Cart page lacks Cart contents

Furthermore, the Save Cart page lacks guidance to help customers understand what is required. The lack of page headings and instructions along with the inclusion of previously saved carts forces customers to pause momentarily to understand what is required.

Recommendations:

• Streamline the Save Cart functionality by prominently presenting the primary task— adding a name and saving.

• Consider providing a modal window on the existing cart page whereby customers can name and save their cart.

Save Cart page lacks instructions

Finally, the Save Cart confirmation page lacks adequate messaging to help customers understand that the cart is saved and has been named. As shown here, the “Your cart has been saved.” message is shown in small text in the upper right of the page. The cart name is omitted.

Recommendation: Provide the cart name as a heading for the group of products.

Confirmation does not provide labeling

Save Cart

• Ensure the cart retains items for both authenticated and non-authenticated visitors.

• Provide messaging about the length of time items are retained.

• Provide an overview of cart contents during the Save Cart process.

• Streamline the Save Cart functionality by prominently presenting the primary task— adding a name and saving.

• Consider providing a modal window on the existing cart page whereby customers can name and save their cart.

• Provide the cart name as a heading for the group of products.

Recommendations

Shared Cart

Customers who use the Share Cart functionality are not provided with information about the content being shared. As shown here, the page lacks a list of items, cost information, and lead times.

Recommendation: Incorporate a summary of cart contents on the Share Cart page.

Share cart page omits detailed information

Issue 4: Shared Cart

The action mechanism of Submit can also be improved as it is not specific and does not describe the process.

Recommendation: Relabel Submit as Share Cart on the Share Cart with Colleague page.

Submit is not descriptive

Furthermore, the Share Cart page does not inform customers that sharing a cart will save it to their account or provide the opportunity to name the cart.

Customers managing many saved carts may be unable to differentiate based on the label that is automatically assigned.

Recommendations:

• Inform customers that sharing a cart will save it to their account.

• Provide functionality to name the cart during the sharing process.

Share lacks instructions and relevant functionality

Furthermore, the Share Cart confirmation page lacks adequate messaging reiterating what information has been sent and to whom. The presence of the data entry fields forces customers to question if the desired action was successful.

Recommendation: Provide a robust confirmation message, reiterating the cart contents, time sent, and the recipient.

Confirmation messaging is inadequate

The email sent from the shopping cart is not formatted in a manner that helps the recipient understand the content. All text is presented in a block which hampers reading. The email also lacks information about products or total cost which would be useful for the recipient to understand at a glance.

Recommendations:

• Format the Shopping Cart email with subheadings and paragraphs.

• Include information about the cart products and total cost in the Shopping Cart email.

Email lacks formatting

Shared Cart

• Incorporate a summary of cart contents on the Share Cart page.

• Relabel Submit as Share Cart on the Share Cart with Colleague page.

• Inform customers that sharing a cart will save it to their account.

• Provide functionality to name the cart during the sharing process.

• Provide a robust confirmation message, reiterating the cart contents, time sent, and the recipient.

• Format the Shopping Cart email with subheadings and paragraphs.

• Include information about the cart products and total cost in the Shopping Cart email.

Recommendations

Quote Request

Customers who are interested in a quote for a specific product are transported to a form which lacks specific product information. As shown here, Quote linkage leads to generic form. This forces them to spend additional time and effort locating relevant information and typing product details in the quote data entry fields. Instead, the site should streamline the quote process for products which have specific specifications.

Recommendation: Provide a tailored quote form for products with detailed specifications.

Quote request requires customers to remember details

Issue 5: Quote Request

Furthermore, the request for Quote form is separate from the product detail page. This forces customers to have two browser windows open in order to locate adequate information to complete data entry.

Recommendation: Consider incorporating Request a

Quote functionality on product detail pages to simplify data entry.

Quote request is separate from the product information

This site populates the quote form with product information, eliminating the need for customers to remember details and enter data.

Example: Product information is transferred to the quote

Quote confirmation messaging can be improved

Issue 5: Quote Request

Finally, the Request for Quotation confirmation message is labeled as Feedback which does not adequately describe the action that has been completed.

Recommendations:

• Ensure the quote confirmation is descriptively labeled.

• Provide a quote request confirmation page which reiterates the information transmitted such as the items selected and the contact details.

Quote Request

• Provide a tailored quote form for products with detailed specifications.

• Consider incorporating Request a Quote functionality on product detail pages to simplify data entry.

• Ensure the quote confirmation is descriptively labeled.

• Provide a quote request confirmation page which reiterates the information transmitted such as the items selected and the contact details.

Recommendations

Imagery

Unicor does not provide the level of visual detail customers expect when making online purchase decisions. Many products are represented by a single image which lacks detail.

It is important that the images used on the site reassure customers that they are viewing the correct item and provide an adequate sense of the product.

Customers may become frustrated if they are unable to distinguish product features within the single product photo.

Recommendation: Show products from various angles and levels of granularity in alternative views.

Products lack adequate alternative views

Issue 6: Imagery

The site also fails to provide conventional, robust

Zoom functionality for products. As shown here, customers are unable to manipulate the product image to view key parts of items up close, denying them the ability to understand attributes. Customers expect Zoom functionality for all products to provide them access to the type of detail they would expect if they were viewing the product in person.

Recommendation: Provide Zoom functionality on product pages.

Zoom functionality is not provided

Imagery

• Show products from various angles and levels of granularity in alternative views.

• Provide Zoom functionality on product pages.

Recommendations

Specifications

Unicor includes many products that have specific dimensions and installation criteria, but the site lacks adequate information about specifications. As shown here, limited information about dimensions is provided but inadequate. Customers are instead forced to contact Unicor to find relevant information about these items.

Recommendation: Provide additional product specifications and technical illustrations.

Products lack detailed specifications

Issue 7: Specifications

Specifications

• Provide additional product specifications and technical illustrations.

Recommendations

Issue 7: Specifications

Visual Hierarchy

Page elements within Unicor are not presented in a distinct hierarchy which guides customers through the purchase or quote process. As shown here View

Cart, Print, and Share links are more prominent than the Add to Cart action mechanism immediately above them. This forces customers to pause and consider the appropriate action for each product.

Instead, the Add to Cart options should be more prominent.

Recommendations:

• Ensure the Add to Cart mechanism on the page is prominent.

• Consider relocating the option to print and share away from Add to Cart.

• Consider removing the option to View Cart at the bottom of the page.

Buttons do not reflect importance of actions

Issue 8: Visual Hierarchy

This site provides a prominent button to Request a

Sales Rep and uses links for options such as product catalog, directions, patient education and contact customer support.

Example: Prominent action mechanism

Visual Hierarchy

• Ensure the Add to Cart mechanism on the page is prominent.

• Consider relocating the option to print and share away from Add to Cart.

• Consider removing the option to View Cart at the bottom of the page.

Recommendations

Expected Location

Several links within the site lead to a 404 File Not found error page. This undermines confidence in the site and may lead to customers abandoning their purchase. As shown here, Clicking on Cart from the my account page leads to an error.

Recommendation: Ensure the cart is accessible from the My Account page.

Broken links defy expectations (1 of 2)

Issue 9: Expected Location

Similarly, customers who click on a product link in the checkout process are unable to find desired information. These links return a 404 File Not found error page.

Recommendation: Ensure product links from the checkout process transport customers to product information.

Broken links defy expectations (2 of 2)

While a link to License Plates is provided in the global navigation, this option leads to Sign In or the My Account dashboard. If these products are only relevant for specific customer types, information should be provided outlining the required criteria.

Recommendation: Transport customers to license plate information or provide guidance about requirements for purchase.

License Plates links lead to My Account

Expected Location

• Ensure the cart is accessible from the My Account page.

• Ensure product links from the checkout process transport customers to product information.

• Transport customers to license plate information or provide guidance about requirements for purchase.

Recommendations

• ForeSee Usability Methodology

• Scope and Specifications

• Top Usability Issues

› Bottom Line

Enhancements to the visual presentation of products will help customers evaluate and select items to purchase. Improvements to messaging and confirmation for cart actions will promote sharing and saving in an efficient manner.

Bottom Line

Loews Royal Pacific and Sapphire Falls Resorts Universal Studios Orlando

May 20-23 – Orlando, FL

Property of ForeSee – Proprietary & Confidential