First Republic Bank

First Republic is a private bank tailored to high net worth individuals.

First Republic Bank’s online banking

First Republic Bank’s online banking

I worked within a small team of designers to update the online banking web and mobile applications. Shortly after I joined First Republic there was a large platform migration for the banking applications. The bank was transitioning to a new vendor with more customization possibilities. We began looking at new designs for web and mobile applications through a series of sessions with stake holders. We iterated on the ideas through testing prototypes with clients.

I was focused on authentication and enrollment. I was also responsible for building low-fidelity prototypes of the application as a whole. These prototypes were for discussions with the larger team, testing with users, and a reference for developers. Once we had our initial designs completed I began creating a set of Sketch libraries for the team to use.

After the initial launch I was responsible for working with our vendors on updates to the mobile application. I was also working with a team tasked with creating an online bank account opening feature.


Enrollment and Authentication

Prototype screen for client enrollment

Prototype screen for client enrollment

Business goal: reduce need for bankers to enroll clients into online banking.

Enrolling into online banking at First Republic required a lot of information. This includes personal identification, contact information, and addresses.

In the redesign I audited the fields that were in the original and worked with other teams that knew why each piece of data was collected. Based on the agreed upon approach going forward we were able to remove a lot of fields. We knew that a lot of data was already collected from a client in person and opted to remove fields if it did not help identify them. After many discussions about how enrollment will actually work I designed a change to the 2-factor authentication flow that we were using. This change was to visually clean up the form and to make it clearer to the user what was sent and what they could do.

After the new enrollment form went live bankers were much more confident in allowing clients to self-enroll. Of the 20,000 new client enrollments we received 1 complaint - that the tone of our form did not include the word “please.”


Account Opening

The Certificate of Deposit selection in our account request flow

The Certificate of Deposit selection in our account request flow

Business goal: Allow existing clients to request new accounts online. Future goal: Allow prospects to request an account at First Republic.

Requesting to open an account online is something very new to First Republic. This project was led with very ambitious goals, the main being that users should take less than 5 minutes to submit a new account request online. New accounts require a lot of information by the bank. Through user testing we were able to help a core banking team improve data collection by revising their form. This has helped with our completion time but there is a lot of room for improvements.

Prototype screen for account selection

Prototype screen for account selection

Prototype screen for account activity - this proved to be the most difficult portion in user testing

Prototype screen for account activity - this proved to be the most difficult portion in user testing


Mobile Application Updates

My goal: Work closely with agency responsible for our mobile application to ensure an easy and consistent experience across platforms for clients.

The mobile application ideation started from our internal team of designers. This became a joint design project with our vendor’s team. I was responsible with working with external designers to create new and update existing features. Some of the features were transfers, Zelle integration and card management.

We have been able to bring iterations of visual design into the mobile platform while maintaining most interaction patterns.

 
Zelle menu integration

Zelle menu integration

Transfer visual updates

Transfer visual updates

Card controls concept

Card controls concept


Pattern Library & trying to establish a design system

My goal: Reduce the need to continue remaking or copy/paste components within our design team.

As we iterated through different features we refined components and reused them. We were constantly having file conflicts and re-making elements. During some of my down time I decided to build out a Sketch pattern library that our designers could pull from. This started to help in rapid prototyping and will continue to grow.

The first attempt was a single component file - this had many issues in terms of findability and maintenance

The first attempt was a single component file - this had many issues in terms of findability and maintenance

Another attempt that used reference files to link everything together

Another attempt that used reference files to link everything together