×
ACREL Shares Redesign
Our team of five UCI MHCID students worked with The American College of Real Estate Lawyers (ACREL) to evaluate their internal Microsoft SharePoint website named Shares over a twenty-week timeframe. The website was originally created in 2014 to serve as the organization’s digital library and platform for committee administration and collaboration. However, the website was no longer being used by Fellows and had numerous usability issues to examine.
Discovery Research
In order to better understand the problem space, we used a variety of discovery research methods separated into two phases.
Phase 1 was meant to establish a baseline understanding of Shares and ACREL as an organization. Much of the work during this phase was to get a broad understanding of general problems with the website and its usage. We analyzed historical artifacts, conducted a baseline heuristic evaluation, completed an automated accessibility check, and created a website map.
Phase 2 consisted of user research to gain a deeper perspective by hearing directly from the users. We used a combination of surveys and interviews that gave us quantitative and qualitative data to inform our problem space understanding.
The Problem Analysis
Our primary findings from all research efforts were regarding Shares value and usage that informed our two problem statements:
How might we give members an accessible document repository that is easy to search and share expert content from?
How might we improve the Shares login experience so members can easily access expert content?
User Personas
To help define our users and the way they interact with technology as a whole, we developed several personas along with their empathy maps.
Identifying Solutions
In order to design our solution to the problems we identified, we conducted a competitive analysis, conducted user driven cognitive walk-throughs, developed user flows, conducted card sorting exercises, as well as continuing primary research.
In order to conduct our competitive analysis, we needed to first determine clear criteria for comparing the different software solutions. We outlined user needs statements using insights from our affinity map, personas, and secondary research. Then, we derived features for each user need statement and rated their importance on a scale of 1 to 3 with 3 being the features of highest importance.
We conducted a competitive analysis on ten alternate software options. Five were specifically designed for law firms and the other five were general solutions for all. We had two core reasons for conducting a competitive analysis:
Understand the document management system competitive landscape.
Offer alternatives to the Microsoft SharePoint software.
User Flow Visualization
Primary User Research: Senior Citizen Technology
We conducted a literature review on senior citizen technology users to better understand and empathize with our user base. Based on that research, we identified several key components to incorporate into our design to help our users navigate the website. Some of those finding included:
Provide large enough touch targets (like a button or text field) with appropriate space for human error—the typical recommendation is at least 44 x 44 pixels (W3C).
Reduce mouse clicks, double-clicking, and interactions where users are required to drag and drop an element.
Allow and design for a keyboard-accessible interface. This is where users utilize their keyboard to navigate websites (e.g., using the Tab key to move around a website or using the Spacebar to ‘check’ a checkbox).
Card Sort
As we started to ideate some of our initial design sketches, two user research questions arose in regards to Shares’s information architecture.
How did the Fellows organize documents in Shares?
How did the Fellows apply search filters to find documents?
We conducted two separate remote and un-moderated card sorts through Optimal Workshop to address these questions.
We learned, that although research shows that people most commonly click through the hierarchy of folders to retrieve files in document repositories, creating a navigation tree based on file topics would not be effective for Shares because it is a shared repository. We also learned that users were unlikely to apply more than 3 types of filters.
The Solution
In order to provide users a familiar experience to promote ease-of-use with our document management system, we looked at popular software used at law offices and software lawyers used on a daily basis such as the Microsoft Office Suite. We found inspiration for color and typography trends by reviewing popular law office websites.
Not wanting to venture too far from current standards when it comes to file organization software, the initial sketches had a system of nested folders that would open a window next to the selection, similar to the MacOS’s column view. In our research, we found that a folder structure system would be hard for users to find specific files if they did not know exactly where to look. We then explored a searching mechanism as the primary method for finding documents. By using the metadata tags many of the files already had, users would be able to apply a keyword search and filters with an interface similar to those seen on shopping websites.
Initial wireframes utilized a three window structure, with the leftmost window having a checkbox filter system with a keyword search, the middle window housing the search results, and the last window showing a preview of the document selected.
We developed unique branding for the Shares website, including a new logo, primary color, secondary color, and fonts.
Design Prototype
The final design prototype given to ACREL utilized several of the insights we discovered through our research and design iterations. some of those features included:
Preview Pane Updates: After the initial prototype, we decided to hide the preview pane of a document located on the right side of the screen until a user clicked on a document. We made this decision because the pane was not being utilized at all times and resulted in document metadata being hidden in the center window. Once a user clicked into a file, the preview pane would slide open showing the document in full view and allowing the user to read or download it.
Favorite Feature: A favorite feature was designed into the system to allow users to save documents to folders and return to them easily later using “Favorites” on the navigation menu.
Uploading System: Since the document repository is user-driven, creating a user-friendly upload system was imperative. We wanted to ensure the user inputted all necessary document metadata, and so we created required input fields marked by a simple red asterisk. We used progressive disclosure when displaying the input fields to not overwhelm the user with tasks.