TRMS Content Management System
Software Engineering of America
Expertise: Enterprise Design, Usability Study, Design System
The TRMS Web application is a content management tool for the company’s customers to be able to search for large reports by filtering via data attributes and transform attributes of the reports and convert them into other platforms.
|
My Role
I was the sole lead product designer with the task of creating the detailed wireframes, mockups, high-fidelity prototypes and developing the design system for the Web application.
The Challenge
The challenge was to redesign the existing application in order to meet customer expectations in terms of how effective it was to allow customers to perform their primary tasks of filtering, searching and transforming reports derived from the mainframe.
The current design, shown below, was a mismatch with the user’s mental model. When searching for reports, users had to first select catalog, then individual attributes like date, recipient ID and cycle number. However, the way the fields were laid out caused confusion over what to do first and selecting more than one attributes was unclear since there was no affordance given to users. Also, the search results was separate from the search fields which meant users had to go back to perform another search if they needed other reports.
Information Architecture
I created a information architecture for the newly redesigned TRMS Website. I organized it by hierarchy of parent-level and child-level pages. Also, I created a depth chart of the navigation menus and pages.
I conducted multiple discovery sessions with the stakeholders to better understand the problem, review functionalities of the current Web application, conduct competitive analysis and provide designs to gather input and iterate on the designs. To validate the designs, I conducted a usability study on the prototype to understand user engagement and the ability of users to successfully accomplish their primary tasks.
Primary tasks associated with:
Primary tasks associated with:
- Search for a report using at least 2 attributes (e.g. Report ID, Cycle Number)
- Find a specific report based on a set of search results
- Change the settings for how users view search results
- View an indexed report based on a specific index value
- Convert a report to a version with defined values
Design Explorations
During the ideation phase, we considered some alternate designs. Here are a few design ideas we explored.
Final Designs
The user interviews and the two personas helped to inform the final designs of the SPA application. Here are some key design decisions I made based on the research.
- Context-driven approach to performing price audits on products on the shelf
- Create a hub where associate can take action, review product details and get alerts about important information
- Easy to use navigation utilizing modal layer template