Arrow
Web app rewrite
Arrow is an internal tool used within REI, to support all of the REI.com products. Due to system instability and usability issues, it was determined that Arrow would be rewritten and converted from a Java application to a web application with implementation done by a third-party.
UX was tasked with making usability recommendations based on a thorough understanding of users goals, needs, and pain points. These recommendations were provided to the third-party company, in the form of an annotated wireframe design and an interactive prototype.
Responsibilities: UX Research & Design
Methodology
In order to gain a general understanding of Arrow’s functions and flows, a “power-user” of this tool, gave a thorough walk-through.
Contextual interviews were then conducted with users in varying roles from different departments. These interviews shed light on a range of pain points and opportunities for improvements.
Users interviewed:
Digital Merchant
Product Information Writer
Product Information Lead
Content Coordinators
Studio Production Manager
Search Program Manager
Search and Navigation Program Manager
The Problem
Findings revealed that there was much opportunity to improve not only the stability of Arrow like already determined, but also improvements around the usability, accessibility, and intuitiveness of the tool.
“Reliability is important”
“The standard underline[for misspellings] would be nice”
“Not an intuitive program at all”
Design
In order to address usability concerns and other various findings, an updated design was explored. This included the user interface, content, navigation, functionalities, and tools.
The overall strategy for the design was to provide users with an intuitive way of using the tools and improving the reporting functions, while being considerate of the amount of content users may need to access/view at a given time.
To validate these designs, user tests were conducted with Arrow users who ranged in roles. Design iterations were made based on users feedback and a second user test was conducted with the updated wireframe designs.
Prototype
The main function of this tool, was to search for a product, or a set of products and there are several ways to run a search. Those search functions are elevated in the universal-nav for easy access. Results would populate below, allowing the user the ability to toggle between results and SKUs, which is an important aspect of many roles.
Home page – Showing the user’s ‘Saved Results’ by default:
‘Create New Filtered Results’ function – Showing the filter options:
Filtered results with spreadsheet-type functions:
Product detail page – With the sections collapsed:
Product detail page – With the sections expanded:
Deliverables
A document with thoroughly annotated wireframes and the interactive prototype, were provided to the third-party company in order to assist them during their rewrite process. This documentation addressed the user interface design interactions, flows, accessibility requirements, as well as usability improvements throughout the tool.