UpToCode User Research Analysis
Project Overview
This project focuses on improving the usability and accessibility of the UpToCode website, which provides essential legal resources for Massachusetts renters. Our usability testing focuses on refining the platform to better serve its users, especially those with limited technology skills.
-
Objective: Enhance the user experience of the UpToCode website to make legal resources more accessible for renters in Massachusetts.
-
Methodology: Conducted comprehensive usability testing using advanced tools like eye-tracking to gather detailed user interactions and feedback.
-
User Demographics: Focused on the predominantly African American renter population in Baltimore, with considerations for age-related accessibility and literacy levels.
Research Methodology
​Our research methodology was designed to capture authentic user interactions and gather actionable insights. The study involved 13 participants from Baltimore, primarily older African American renters, during February 23rd to March 5th. This setup allowed us to research the specific challenges faced by this demographic, particularly focusing on their technology usage, literacy levels, and accessibility needs, shaping our understanding and guiding our design improvements for the UpToCode website.
-
Testing Environment: Utilized the User Research Lab at the University of Baltimore, equipped with a one-way mirror and Tobii Fusion Pro eye-tracking.
-
Participant Profile: Engaged 13 Baltimore residents, primarily renters, with a median age of 63.5 years, to understand the accessibility needs of an older demographic.
-
Inclusion Criteria: Focused on participants with an average 7th- to 8th-grade reading level, tailoring content to their literacy needs.

Proposed Visual Hierarchy of the UptoCode Website.

The Original UptoCode website.
Usability Testing Findings
​Our usability testing revealed important insights into the user experience of the UpToCode website, focusing on the specific needs and challenges of our participant group. Through comprehensive sessions, we identified several key areas where the website could better serve its users, particularly those with limited tech-savvy and varying literacy levels. These findings are needed to inform our recommendations for enhancing accessibility and usability. Below, we detail the main areas of concern and the direct observations that led to our actionable suggestions:
​
-
Discovering the UpToCode Tool​: Many users were unaware of the tool's existence prior to the study, indicating a need for better SEO and visibility.
-
Navigating the Tool: Users experienced difficulty navigating through the website, often feeling lost between steps.
-
Clarifying Instructions & Actions: Instructions and calls to action were not clear to many users, leading to confusion and incorrect use of the tool.
-
Not Everyone Is a Computer Expert​: A significant number of participants had limited computer literacy, which hindered their ability to use the website effectively.
-
Make It Easier to Register/Sign In​: The registration and sign-in process was a major barrier for users, with many finding it complicated and discouraging.
-
Final Success or Failure​: Users’ ultimate success or failure in using the tool greatly affected their overall satisfaction and the likelihood of future use.
Discovering the UptoCode Tool
Our findings revealed barriers when accessing the UpToCode tool, primarily due to its low visibility and user misconceptions about available resources:
​
-
Lack of Discovery: None of the participants were able to find the UpToCode tool through Google Search, as they did not specifically search for a digital tool but rather looking for legal advice or solutions for their problems like "exterminator".
-
Website Navigation Issues: The Northeast Legal Aid site, which hosts the tool, did not effectively guide users toward UpToCode. Participants who visited the Northeast site struggled to find relevant resources.
-
Homepage Clarity: The homepage of UpToCode failed to immediately communicate its purpose or value, leaving users uncertain about what the tool offers and how it could assist them.



Eyetracking Software showing participant trying to navigate with current progress bar.

Navigating the Tool
Our usability testing highlighted several navigation issues within the UpToCode tool that hinder user experience and functionality:
-
Inadequate Global Navigation: The current global navigation does not adequately reflect the full functionality of the site, making it difficult for users to understand what the site offers and how to access various features.
-
Unpredictable Button Behavior: Buttons within the tool do not behave consistently, leading to confusion and frustration among users. Predictable and standard button actions are essential for a smooth navigation experience.
-
Ineffective Progress Bar: The progress bar does not effectively communicate the user's current position within the process or facilitate navigation between sections of the tool. A more functional progress bar should clearly show progress and allow users to easily navigate to previous steps if needed.
Proposed progress bar with indicates for active and inactive sections.
Clarifying Instructions and Actions
Effective communication within the UpToCode tool is very important for user comprehension and engagement. Our usability testing indicated several areas for improvement in how instructions and actions are conveyed to the user:
​
-
Plain Language Usage: Continue to apply plain language principles consistently across the tool to ensure that all instructions are easily understandable.
-
Sentence Decoding: Utilize strategic bolding within sentences to highlight key information and guide users through important actions, aiding in quicker and clearer comprehension.
-
Sentence Structure and Visual Order: Adjust the sentence structure and the visual layout of information to enhance the logical flow, making it easier for users to follow and understand the intended steps.
-
Jargon Management: Remain vigilant about 'jargon creep' — the tendency for specialized terms to become commonplace in content intended for a general audience. Reduce jargon where possible and clarify necessary technical terms.
-
Just-in-Time Guidance: Incorporate just-in-time guidance for users by providing external links or tooltips for unfamiliar terms directly when they appear, facilitating learning and understanding in context.
-
Reinforcement of User Actions: Ensure that the text on the page clearly reinforces the actions users need to take, establishing a direct connection between instructions and the actions required.



Participant didn't recognize the loading icon in the top center of the screen, which caused her to feel frustrated and confused.

Not Everyone Is a Computer Expert
Our usability testing shows the importance of designing the UpToCode tool with all levels of computer literacy in mind. To accommodate users who are not technologically savvy, we identified several user interface improvements that could enhance the overall user experience:
-
Informational Icons: Implement question marks as clickable icons next to complex terms or features. These icons should link to additional information, helping to demystify the content and process for users unfamiliar with digital tools.
-
Simplified Navigation: Minimize the need for excessive scrolling and use accordions for lengthy sections to allow users to expand and collapse information as needed. This approach helps manage content overload and focuses the user's attention on one section at a time.
-
Form Design Conventions: Clearly distinguish between required and optional fields in forms to prevent confusion. Use familiar label conventions, such as 'First Name/Last Name', to ensure clarity in what information is needed.
-
Monetary Inputs: Include a visible '$' symbol in fields requiring monetary inputs to specify the type of data expected, reducing errors and enhancing form usability.
-
Visual Feedback for Loading: Integrate a loading icon for actions that require processing time, informing users that the system is working and to wait, thereby reducing uncertainty and frustration.
Proposed solution for loading icon was to grey out the background and provide users with a loading icon that indicates process.
Make it Easier to Register/Sign In
Enhancing the registration and sign-in processes is necessary for improving access to the UpToCode tool. Our findings indicate that simplifying these processes can significantly impact user engagement and retention. Here are the suggested changes to make these functionalities more user-friendly:
​
-
Simplify Registration: Simplify the registration process to reduce barriers for first-time users. This could include minimizing the number of fields required to register and providing clear, step-by-step instructions.
-
Flexible Registration Options: Introduce multiple registration options, such as using email, social media accounts, or even mobile numbers, to accommodate user preferences and make the process more convenient.
-
Simplified Password Creation: Revise the password creation process to include clear guidelines on password requirements. Consider integrating visual indicators of password strength to assist users in creating secure passwords without the frustration of repeated attempts.
-
Clear Menu Vocabulary: Update the vocabulary used in menus during the registration and sign-in processes to be more intuitive and less technical. Words should be simple and actions should be obvious, aiding users in understanding what steps they need to take without confusion.

The current website register/sign in form.
.png)
The proposed layout for logging in/signing up for the website.

Registration Screen with Password Requirements and show password options included.


Final Success or Failure
The ultimate success of users interacting with the UpToCode tool, particularly in tasks like filing and mailing, rely on clear and effective cues throughout the process. Our usability testing has revealed areas needing further refinement to ensure users feel confident and successful in their interactions:
-
Review Screen Enhancements: The current review screen, where users finalize their inputs before submission, requires additional testing and improvement. It is important that this screen clearly displays all information entered by the user and provides an easy way to edit details before final submission. Also, it should tell the user know they have to file in person.
-
Printing Cues: Enhance the visibility and clarity of printing cues. Users need explicit guidance on how to print documents if required, including steps to troubleshoot common issues like adjusting printer settings or locating the print button.
Next Steps
Since our goal is to enhance the user experience of the UpToCode tool, we have outlined a strategic plan with actions categorized by immediacy and impact:
​
Immediate Action:
-
Content and Navigation Enhancements: Initiate quick, impactful changes such as updating content for clarity and accuracy. Simplify the site's navigation and enhance readability to immediately improve user engagement and ease of use.
​​
Medium-Term Focus:
-
Technical Improvements: Address specific usability issues identified during testing. Key projects include redesigning the progress bar to better communicate user progression and optimizing the loading icon to reduce perceived wait times. These technical adjustments will contribute significantly to a smoother user experience.
​​
Long-Term Strategy:
-
Comprehensive UX Enhancement Plan: Develop a detailed plan to systematically enhance all aspects of the user experience, from initial entry through final site interaction.
-
Ongoing Testing and Refinement: Continue rigorous usability testing to gather new insights and iteratively improve the design and functionality of the tool based on user feedback and emerging needs.

Additional Information
Project Title:
Tools Used:
-
Tobii Eye Tracking
-
One-Way Mirror
Project Type:
Year:
Client User Research
2024