Digital Alchemy: Mortgage Loan App

HOME  /  PRODUCT DESIGN  /  DIGITAL ALCHEMY

Brand Identity for Real Estate Brokerage App

Objective. Polish the UX/UI for bank loan iOS app

Background. Digital Alchemy is a white label financial product for real estate brokers and agents. It non-intrusively guides home owners and house hunters through each stage of the complex home financing process with in-depth information uncommonly found in tools for mass markets.

Timeline. 9 months, completed in 2017

Approach. I worked with Digital Alchemy's leadership team to refine their existing UI and provide branded mockups for client presentations. For particularly cumbersome interactions, such as searching for properties on a map, messaging, and reviewing ever-changing mortgage rates, I presented multiple user flows and animation for them to consider.

Mortgage Options

Keeping an eye on interest rates is top-of-my-mind for house-hunters. I explore a few design concepts that would allow users to cycle through saved mortgages without having to navigate through the app to get to them.

My Account My Mortgages Font Updates

Saved mortgages. The ability to save mortgages made it easy to shop for the best rates.

Digital Alchemy Tab Bar Discussion Notification Orig

Shortcut for saved mortgages. Mortgages were displayed in the tab bar to help keep an eye on fluctuating interest rates.

Digital_Alchemy_Tab Bar My Mortgages Summit Opt 2

Stock-ticker style mortgages. This design treatment allowed users to glance at interest rates without having to interact with the tab bar. They could drag along to view previous and next rates.

Digital_Alchemy_Group 158

Expanding tab bar. A long-press would animate to display mortgage details, and allow the user to cycle through a few saved mortgages.

Mortgage Application

The app drastically reduced the burden of finding properties, gathering and comparing mortgage estimates, and hunting down loan officers' contact information. Once a house-hunter found their ideal property, the app made it convenient to connect them with a loan officer directly to begin their mortgage application.

Summit Cash to Close May 2017

Dynamic sliders. Users could explore financing options based on their desired downpayment.

Summit Saved Loan Estimates

Saved for comparison. Weighing the pros and cons of each loan was made easier by consolidating saved estimates in one place.

Digital Alchemy Summit Cash to Close Total Expanded

Cash-to-close. Cash to close is a complex set of calculations, so scrolling is required to see it all (hover to scroll).

Digital Alchemy Loan Application Request

Convenient in-app messaging. Rather than having to hunt down a number for a loan officer, users could simply click a button to be connected with one in-app.

Digital Alchemy Contact Loan Officer Modal

Recent Threads. If a discussion had previously been initiated, the thread would conveniently appear above the message box so users didn't accidentally contact multiple loan officers.

Digital_Alchemy_My Account wLoan Application In Progress

Loan Application Status. Once an application is submitted, house-hunters can see the status as it moves throughout the lengthy approval process.

Digital Alchemy Mortgage Application Status Rev

A face to go with a name. The loan officer's portrait appears next to the status bar to reassure the user they're in good hands.

Digital Alchemy Mortgage Application Status Filled

Confirmation. Once the loan is approved, a confirmation message is displayed, and the loan application process is marked complete.

Messaging

Discussion threads support conversations with verified loan officers assigned via the app, as well as personal contacts, such as a spouse who may need to co-sign documents. Images, property links and documents are consolidated from messages in a separate area for easy reference.

Digital_Alchemy_Discussion Landing

Message inbox. Arranged with most recent messages on top.

Digital_Alchemy_New Message

New Message. Contact names would populate as users typed.

Digital_Alchemy_Discussion Contacts

Contacts. Loan officers' images were automatically imported, and were used to help build trust.

Digital_Alchemy_Discussion Contacts Copy

Contact search. Dynamic search made it faster to find contacts by typing the first letter or two.

Digital Alchemy Discussion Shared Empty State

Shared—Empty State. Until property links or documents are shared, this is displayed.

Digital_Alchemy_Discussion Properties 3 Msgs

Shared Content. Both property links and documents could be communicated in-app, cutting down on cluttered email inboxes.

Digital_Alchemy_Messaging Archived Animating 1

Message archives. Discussions can get long, so the app archives them by month. Tapping on the count unfurls them for viewing.

Digital_Alchemy_Discussion Message Thread wAttachments

Unarchived messages. After a session, the messages archive again to keep threads tidy. (hover to scroll)

Digital_Alchemy_Discussion Shared

Built-in organization. Important content is consolidated in one place keeps all parties organized throughout the process.

Digital_Alchemy_View Shared File Portrait

Save time uploading. Rather than using a scanner, users could take pictures from their phone and upload important documents to keep things moving.

Digital_Alchemy_View Shared File Expired

Automatically locked content. As an extra security precaution, sensitive documents could be set to expire after a number of days.