8/25/2010
By Brendan Jonesrebandt
With online interactions continually on the rise, fewer and fewer activities require you to leave your home. An activity that has begun to move online is applying for a mortgage, which can now be done from the comfort of your favorite chair. No more waiting in line at a brick and mortar bank, the application process is just a few keystrokes away. However, there are still some obstacles blocking the way for online mortgage applications to be the norm. For example, some banks do not even offer an online application, such as Chase, but only tools to help you prepare to come into their bank to start an application. These tools are still essential components of the application experience, but the break between what can be done online and the need to come into a physical bank is jarring. In addition, there are security concerns and user experience issues. We’re going to look into the user experience issues by analyzing seven keys that work together to create a good experience with an online mortgage application: Clear Language, Obvious Calls to Action, Educational Materials, Calculators, Mortgage Rates, Consistent Navigation, and Progress Indicators using examples from four banks: Zions Bank, Wells Fargo, Citibank, and Chase.
1. Clear Language
Clear language, language that is understandable to a new user, is essential for driving traffic to the correct pages. Chase recently updated their mortgage starting page to provide clearer links to the user (Figure 1). The links on the page are presented in clear, concise statements. The links are broken up into two clear categories, purchasing a home and refinancing, with relevant, secondary links listed below. Each link has an unambiguous purpose.
Figure 1. Chase Mortgage Landing Page
2. Obvious Calls to Action
Figure 2. Zions Bank Mortgage Starting Page
3. Educational Materials
Buying a house is one of the biggest purchases an individual will ever make, so it is imperative to have enough information available to the user about the process. Wells Fargo presents an abundance of educational links broken up into five different categories: Achieve Your Goals, How Wells Fargo Can Help You, Tools & Calculators, Manage Your Mortgage, and Related Solutions (Figure 3). Each of these categories has four different links to additional information in that category. Clearer language would make the categorization and links more useful, such as changing Achieve Your Goals to First Steps to Buying a Home, but Wells Fargo does a good job providing many articles that a potential home buyer may find useful for their current situation.
Figure 3. Wells Fargo Educational Materials
4. Calculators
In order to calculate monthly mortgage payments, whether it makes sense to keep renting or to buy, or how much a 15 year mortgage would save over a 30 year mortgage, users rely on online calculators. Zions Bank provides a very useful calculator (Figure 4). The calculator can easily be changed to meet the user’s question. In addition, the graph updates in real time so the user can see how their input affects the outcome very quickly. There is also a more detailed report available if the user would like a summarized statement of the parameters and the mortgage information broken down into monthly statements.
Figure 4. Zions Bank Mortgage Calculator
5. Mortgage Rates
Figure 5. Citibank's Current Rates
6. Consistent Navigation
Between best practices, learned conventions, and usability heuristics, users have come to expect that the navigation, especially for filling out a form, should be consistent and straightforward. Citibank does a good job keeping their navigation buttons consistent throughout the online mortgage application. The buttons always have the same function and appear in the same location. In addition, the buttons are spatially mapped to their function, with Previous being on the left side to go back, and Submit on the right side to go forward (Figure 6). There are also arrows paired with these words which are associated with the direction of moving through the application. Cancel is differentiated from the two directional navigation buttons in color, size, and placement. Users would be unlikely to accidentally click cancel in its current location.
Figure 6. Citibank's Online Mortgage Application Navigation Buttons
7. Progress Indicator
When filling out a form, especially one as detailed and time consuming as an online mortgage, users have a much better experience if they know what to expect and where they are in the process. Providing information to the user on their progress and the different steps involved is invaluable for users when deciding whether they have time to fill out the application now, or whether they would rather go into a bank to fill it out. Wells Fargo provides a more informative progress indicator than others, but still falls short (Figure 7).Their process is shown to consist of four main categories with several steps per each category. This information is provided at the top of each page and is clearly visible. They check off the step once you have completed it, highlight the category and step you are on, and keep it to one page per step. They do not inform the user of how many steps fall under each category though until after the user has begun the first step in that category. There is also no description of each step or category, and they do not give an estimate as to how long the process will take.
Figure 7. Wells Fargo's Progress Indicator
Summary
To have a good user experience, these seven components must work in conjunction with each other. The mortgage rates must be visible so that the user knows what to enter in the calculator. The language should be clear so that the user can find the informational material they are looking for with obvious calls to action so they know where to go. The navigation must remain consistent on the forms, which also must show a progress indicator. By ensuring that all seven of these components are included in the online mortgage application process, the user will be able to apply for a mortgage online effectively, efficiently, and have a good experience with the process. This will be one step closer to moving the mortgage application process to a primarily online service.
