Fiserv-Premier Advanced Print

Fiserv - Premier Advanced Print Page

Role: Creative Direction, UX, UI

Figma, Photoshop

My team was tasked with designing a print page option using the Advanced Print option that would offer more printing options better suited to the clients needs.

Problem to be Solved

As an end-user, I want to be able to quickly print the page of the Account or Customer that I am actively viewing.

By default, "sensitive data" is set to be masked

Additional Information

The end-users (Bank employees) needed the ability to print information from the new UI that was consistent
with the view and information present in the New UI. That information could be used to give to a customer,
or financial institution employees to perform research for legal matters and record keeping. When printing, considerations needed to be made to optionally enforce masking, particularly when printing off for a new customer.

Process

The Design team started a kickoff with representatives from other teams to focus on what we wanted to accomplish with the new designs and layout. We conducted a whiteboard session with next steps and established a process flow with how we wanted to launch and dates for each. In consideration of deadlines, we decided to work in 2 week sprints, and utilized a Jira board to keep track of the teams project initiation and progression throughout the process.

Miro Board Ideation exercise with team

The Design team started a kickoff with representatives from other teams to focus on what we wanted to accomplish with the new designs and layout. We conducted a whiteboard session with next steps and established a process flow with how we wanted to launch and dates for each. In consideration of deadlines, we decided to work in 2 week sprints, and utilized a Jira board to keep track of the teams project initiation and progression throughout the process.

Audit of Legacy Site

To kick off, we had to conduct an audit of the Precision legacy site, and understand what information was available, and what was needed. We then started to prioritize, through User Interviews with bank employees, what features were most important, and which information and features were less important. We then need to figure out how to prioritize the information, based on hierarchy.

Problem Statement

• Sensitive Data includes Account number, Tax ID Number, and Date of Birth

- If Print Masking is On, then all digits of the above fields would be replaced with an "X" or "#" or something, except for
Account number

- Account Number, when masking is applied, will be masked where all but the last 4 digits of the Account number will be
masked. Provide the appearance of a 10 digit account number, when masking is applied, regardless of the account
number length.

• For example, if the account number is 200050, masking of this account number in the print out would be XXXXX0050

• For example, if the account number is 50, masking of this account number in the print out would be XXXXX0050

• For example, if the account number is 11200050, masking of this account number in the print out would be XXXXX0050

If Print Masking is off, then the sensitive fields will be printed as the same as on the UI screen. Client may have UI level masking rules turned on and thus the UI will be applying client specific masking rules as defined in PRM1152.

• No right side drawer component will print with Quick Print.

• Any expandable/collapsible rows will print as they are on screen, ie. if a user has expanded on hold or recurring charge, the printout
will include those element expanded and the others closed, just like the user view on the screen.

• As an end-user, I am able to easily understand which Account/Customer the printout was done for.

- There is context as to which account or customer the print out is for.

• As an end-to-end user, I am able to choose which printer, or output option (eg. PDF, OneNote, etc.) I would like to have my printout directed to.

Why is this important?

Our client's customers will ask for printout's of their transactions that have posted. We hear this as a popular requirement. These printouts need to be in the context of what is on the screen, as to not show the customer any internal value information if they don't need to see printing and exporting options also assist with back office research.

How do we know we've delivered value to the customer (Acceptance Criteria)?

• End user is able to quickly find the print mechanism for the Account/Customer they have brought up

• End user is able to print information in the context that is being displayed.

• Printout applies to the proper masking, when masking is applied, in such cases that the end-user is giving the printout information
to a customer

• Account Number is properly masked (all but last 4)

• TIN is completely masked

• DOB is completely masked

• Phone number(s) is completely masked

• End user is able to print out to paper or PDF.

Audit of legacy site

We started by conducting user interviews to get a better idea of the current user journey, pointing out any pain-points and discrepancies to make all internal team expectations were still accurate.

DEFINE

Business Goals

In addition to conducting stakeholder interviews, we decided to deploy a double-diamond methodology to make all internal team expectations were still accurate.