Enhancing Usability and Accessibility of Financial Endowment Management System
Team
Product Owner
Application Development Manager
Developer
UX Designer (Me!)
Timeline
June 2024- October 2024
Tools Used
Figma
Figjam
Google Analytics
Wave Accessibility Checker
What did I do?
-
Conducted user research and usability testing
-
Created wireframes and interactive prototypes
-
Executed conceptualization and ideation processes
-
Performed accessibility audits to ensure inclusivity
What was the impact?
-
Reduced task completion time by 40% for the data-entry team
-
Improved accessibility compliance by 35% by finding issues through accessibility audits
-
User Interface consistency boosted by 30% as a result of re-designs
Due to the NDA, I cannot share full design process as it includes financially sensitive information. Thank you for reaching this far in the case study, hope you enjoy reading further!
Introduction
What is FEM?
The Financial Endowment Management System (FEM) is like the banking system of Indiana University. Thousands of transactions take place through this system. I was hired to conduct usability testing on the system and make recommendations to make the experience better. I re-designed existing features and also designed new features that were included in the system.
Understanding the users
Who are our users?
The primary users of the Financial Endowment Management (FEM) system are financial reporters, account admins, and accountants.
Research Goals
1. How do users use the system, and what problems do they face?
2. How well does the system work for users who rely on keyboard shortcuts, and where are the roadblocks?
3. How do users feel about the system, and what changes would make it better?
4. How do accessibility problems affect users who need screen readers or other assistive tools?
Understanding the problem space
Method 1: Heuristic Evaluation
I conducted a heuristic evaluation of the FEM system to analyze its usability. This process revealed key issues impacting user experience.
Heuristic: Consistency and Standards- Problem
There are 2 searches on the dashboard which have 2 different purposes, but the difference isn’t apparent.
The top right search is to search document numbers.
And the other search is to find any form(document) from the catalog.
Heuristic: Error Prevention- Problem
There is no way to delete a document if a mistake is made while filling it out. It sits in the action list of he user with no way to deleting it.
Method 2: User Interviews
Participants interviewed: 8
User interviews revealed the pain points of the users while navigating the system. Their feedback was critical in guiding design decisions to create a more user-friendly and efficient system.
Account Admin
Accountant
Me :)
Image is intentionally blurred to protect sensitive financial information displayed on the screen.
Highlighting the user pain points
Navigation
Finding the document user wants to fill out is difficult
Two Searches
There are 2 searches on the dashboard, and the users don't know their function
Multiple Clicks
The day-to-day work requires users to fill same documents multiple times. This is resulting in multiple clicks
Redundant elements
There are some redundant UI elements in documents such 2 different buttons for "OK" and "Enter" which both act in the same way
An accessibility audit was conducted to identify barriers preventing users, including those with disabilities, from efficiently interacting with the FEM system. The goal was to ensure alignment with U.S. accessibility standards (Section 508, WCAG 2.1)
Core Areas Reviewed for Accessibility Audit
Navigation
Assessed site structure for intuitive, keyboard-friendly navigation and logical focus order to ensure ease of use for all users.
Color Contrast
Evaluated color palettes against WCAG standards, ensuring sufficient contrast ratios for readability and visibility, especially for users with visual impairments.
Documents
Analyzed forms/documents for proper labeling, error message clarity, and ease of input for assistive technology users.
Key accessibility issues
Issue 1: Missing Labels
Critical labels, such as those for document IDs and input text fields, were missing. This caused issues for screen reader users, as the screen reader would not announce the "Description" field, leading to confusion and difficulty in completing tasks.
Issue 1: Required Fields
Screen readers did not announce required fields, as the ARIA required attributes were missing. This issue left visually impaired users unaware of necessary fields, complicating form submissions.
Issue 1: Session Timeout
The system logged users out without a warning, leading to data loss and frustration for users unaware that their session had ended.
Re-design goals
1. Improve Navigation and Task Efficiency
2. Fix Accessibility Issues
3. Streamline UI Elements and Reduce Clutter
4. Simplify the flow to add document to favorite
Final designs
1. Dashboard
Before
Icon changed to indicate document search
After
Categories added to simplify navigation
Added a favorite icon to mark documents as favorites directly from the dashboard.
2. Session timeout
Before there was no session timeout warning and users were logged out directly. A session timeout warning was implemented to enhance system accessibility.
After
3. Delete document
Before, documents with errors could not be deleted, leaving them in the action list and requiring the creation of a new document. Delete option was added to discard documents with errors.
Before
After
Due to the NDA, I cannot share additional designs or processes as they include financially sensitive information. Thank you for reaching this far in the case study—Read ahead for validation and my learnings!
What did the users say?
After prototyping, I showed the new designs to 8 participants I had initially interviewed to gather their feedback.
1. Dashboard Improvements
"The categories make it so much easier to find what I’m looking for."
"Adding favorites is a game-changer for frequently accessed documents."
2. Session Timeout Warning
"Finally, I won’t lose my work if I step away for a bit!"*
- "This will save us a lot of frustration."
3. Delete Document Option
"This saves me so much time—I used to have to start all over."
"Finally, I can clean up my action list."
System Usability Score
56.42
Mean SUS Score
Before re-design
Below Average
74.37
Mean SUS Score
After re-design
Above Average
There was a significant rise in the average SUS score of FEM, indicating that the redesign efforts effectively improved the system's usability, making it more intuitive and user-friendly for its audience.
My Learnings
-
Stakeholder Collaboration is Crucial: Regular feedback loops with stakeholders ensured the design aligned with organizational goals while addressing user challenges.
-
The Impact of Micro-Optimizations: Simple changes like optimizing document categorization and significantly improved task efficiency and user satisfaction.