JAWID ELYACY | USER EXPERIENCE DESIGN
  • Home
  • UX/Visual Design
    • BMC Success Journey
    • Shelf Price Audit
    • PIT Inspection
    • Task Manager
    • TRMS Content Management System
    • Request for Information
    • ECHO Refund Transparency
    • Mobile Wallet
    • Fast Track
    • Customer Profile Engagement
    • Erica AI Assistant
    • Single Service Card Experience
    • Smart Services User Experience
    • SEPTA Designs
    • SmartDrive
    • Pet Adoption
  • Contact Me
  • About Me

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.

Picture

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.
Picture

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.
Picture
Picture
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:

  • 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
Picture
Picture
Picture
Picture
Picture
Picture
Picture
next project
© COPYRIGHT Jawid Elyacy 2025 ALL RIGHTS RESERVED.
  • Home
  • UX/Visual Design
    • BMC Success Journey
    • Shelf Price Audit
    • PIT Inspection
    • Task Manager
    • TRMS Content Management System
    • Request for Information
    • ECHO Refund Transparency
    • Mobile Wallet
    • Fast Track
    • Customer Profile Engagement
    • Erica AI Assistant
    • Single Service Card Experience
    • Smart Services User Experience
    • SEPTA Designs
    • SmartDrive
    • Pet Adoption
  • Contact Me
  • About Me