UNO redesign - Australian online mortgage broker platform

UNO is an Australian online mortgage broker that combines unparalleled service with advanced technologies to simplify the entire process of obtaining and maintaining a home loan, saving time and money. UNO is a tool that makes life easier for mortgage brokers, and we've made this tool even more convenient and understandable!

UNO is a valuable tool for clients with: limited free time; the need to simplify the process and reduce effort; a desire to have a positive experience, free from the usual stress associated with these processes; and to ensure the best financial outcome.
In this video, UNO's founder, Vincent, briefly and in simple language, explains his platform and how it improves the lives of brokers by assisting in their daily work.

UNO's target audience is brokers who work with mortgage approvals for homes. Usually, these are users aged 30-55 working on large monitors, as they need to see a large amount of data at once. They usually use one or more screens with a resolution of 1920-2880px. The UNO interface has a large amount of data and fields that need to be placed on one screen, and our task was to create a contrasting and maximally clear UI that will be convenient to work with all day long.

Vincent came to us with a very original request - we had to create the best case in our portfolio by updating his platform and we were hooked by this idea 😅. Since the client definitely knows UNO better than anyone, he practically joined our team and the cooperation was very close. Our responsibility was to update the UI, increase the information density (information architecture - IA), improve navigation, expand datasets, and generally improve the UX of the product. As usual, you're probably used to us talking about it in every case, we created a single design language UNO to unify the user experience. Check out what we did!

And this is what the old UNO interface looked like that we had to change. The old UI was too colorful and sometimes difficult to work with, and the data was not clear enough. We reduced the overall color scheme to a blue accent color and a black and white main palette, improved navigation, taking into account the user audience (30-55 years old) and screen sizes (1440-2880px) that brokers work with. The interface's font styles, as well as the detail and variability of components, have also undergone significant improvements.

Since Vincent came to us looking for a new visual solution for the interface and to improve the UX, this task was entirely our responsibility.
We started by diving into the business, familiarizing ourselves with the platform, finding references, and creating a lot of sketches. Below, we show our workflow for creating sketches and the style of the future interface.

Since the UNO interface is multi-level in its information branching, we had to focus on developing modal windows and popups for different levels of the IA. We started with understanding the concept of multi-level interface. As a result, we came to the conclusion that layering modal windows that would overlap each other is not a very correct and convenient solution, because the broker needs to see all the information about the deal opportunities at the same time. As a result of the analysis, we came to the conclusion that it is necessary to apply the already familiar but understandable side-accordion system. When the user uses the action to open the next modal window, the modal window will open next to the neighboring one. Three is the maximum number of open modal windows in UNO. This is due to the desire to ensure that the user does not get confused about what level of IA he is at.

Of course, we could not develop such a large-scale and complex interface as UNO without creating our own unique design system that would meet all the needs of the product's users. The UNO design system is completely custom. We took into account all the properties and states of the components, from multi-level complex combo boxes to simple buttons and their states. Thanks to this new design system, UNO will be quickly and efficiently updated, maintained and developed.
You can check out our work on the component library in the Figma preview below.

A broker works with a large number of trades and data at once. It is very important for them to have convenient and quick access to each application, a calendar with schedules at hand, and to set reminders and communication timelines. Having filters in Apps, a broker can quickly find and identify the deal he needs right now without wasting time searching. Using the calendar, the broker learns about plans for the near future. By creating message templates, a broker can automate communication with his clients via email and SMS.

The broker's dashboard is a set of working tools for concluding deals, namely: Needs analysis, Applicant, Securities, Financial position, Documents, Assessment, Loan details, Events & Reminders, Product search, Shortlist, Recommendations, Company, and others. Each of these tools gives the broker insight into the status of transactions, the status of buyers for a particular home, and helps to calculate the mortgage. Below we show what we managed to create with the new navigation and design of the UNO system.

The new UNO interface is still in development at the time of this case creation. Despite this, the first comments from the beta testers and the UNO team are very positive. They like the new UI, they note that it is more understandable and not tiresome to use. Real usefulness and increase in business efficiency, which is achieved thanks to our work - is the best praise. But don't hesitate to praise us when you become our client, because we really appreciate it too 😊