Unified Committing Platform

The Project

We worked together with Accenture and Fannie Mae to create a new portal with the goal of improving the customer experience of its existing offerings. The first business transaction to be optimized in the new portal will be Committing, with disparate committing applications brought together into a single interface called the Unified Committing Platform (UCP).

What did I do?

UX Discovery: Understood adequate detail around stakeholder requirements and user needs to inform UI Design work.

UI Design: Defined the structure of primary views and flows, as well as interaction patterns and navigation within the application.

The Workstream

The Workstream for UCP includes UX discovery, Technical analysis, UI design, visual design, acceptance criteria, development backlog, implementation support. I was deeply involved in the highlighted area below.


Stakeholder Interviews:Conducted and summarized findings from meetings with 4 internal stakeholders from technical and business domains.

Application Review:Reviewed the applications, informed by subject matter experts(SME) walkthroughs and demo access.

User Observation:Observed 3 users, in the context of regular workflow, completing all primary tasks/use cases in the application to uncover specific usability issues.

UI Sketches:Created a series of preliminary sketches to facilitate discussion and validation.

The Sketches

We did a collaborative sketch session with users and stakeholders to uncover the underlying user needs. The sketches drove the overall design and direction of the wireframes. They encompassed all major views and interaction patterns.

  • image

    1st Iteration Sketch(org modal)

  • image

    2nd Iteration Sketch(dashboard)

  • image

    2nd Iteration Sketch(widget)

  • image

    3rd Iteration Sketch(dashboard)

  • image

    3rd Iteration Sketch(pipeline)

The Org Model

The Org Model illustrate the relationship of users and the system.


The Agile User Stories

I helped generate the user stories in the agile framework. It is a quick way of handling customer requirements without having to create formalized requirement documents.


The Wireframe

I created a set of mid fidelity wireframes for each epic, these wireframes guided the direction of the design and development implementation. Below are some examples:

The Design

I contributed to produce the visual designs for key screens.

  • image
  • image

Implementation Support

I am the primary UX designer for the entire project. I was responsible for a year long implementation. I worked closely with the lead developer and client to conduct detailed wireframes and visual designs. I also helped create the style guide. The project was a big success and helped the company win two additional projects from the same client.

Things that can do better?

In this project, we spent a lot of time to reconcile our user stories and acceptance criteria with the business requirements. I could took an more agile approach using a single golden resource as our development backlog to make sure everyone on the same page.

To be more efficient, I showed more detail about the interactions and workflows of each activity. This allowed developers to have a better understanding of the business activities. The activities got progressively detailed towards the end of the project.