Divisso
Web app
Introduction
Divisso is a Chilean startup linked to the real estate and mortgage loans sector.
Challenge
The challenge was to design the UI for Divisso’s mortgage loan application flow. It had to be with a mobile-first focus due to the mayority of traffic comming from mobile devices.
Research
Mostly of the research was already been done by the company, through user interviews and usability testing, so the user flow was already in place. I got togheter with the CEO and the CTO and they put me up to date.
Design
The first step to start designing the user interface was to take into account the brand guidelines, previously established. Color palette and typography.
The starting point was the desktop version of the web app, with basic styles.
First stop: Buttons. I decided to go with the attention grabbing green for main buttons and blue for secondary buttons.
Then I worked with the forms, keeping the same shape style of the buttons
For the radio buttons I went with a more visual-appealing style than the traditional style.
For the stepper there were some elements that had to be present: the step number, the step name and the description, it also had to indicate which step the user is on. Finally, I added a progress bar so the user knows when the process is about to finish.
To navigate between the steps of the flow I decided to work with a bottom navigation bar with “Continue” and “Back” buttons.
Results
Putting in all together:
This was the final design.
