Quext Rental Application: from paper to pixels

Link to product

Quext is a family of property management software intended to simplify the complexities of competing property management software and provide innovation in a space that is typically not known for being innovative. The application process for Quext when we came to the table was completely on paper and physical, so our main reason for being brought on was to take that process and take it online for applicants to be able to apply online.

Client

Quext

Type

UX Research • UX Design

Year

2021

My Role

My role in this portion of Quext was to assist in taking an on paper application process and bring it online, allowing users to apply through a portal. More specifically, my focus was:
  • Conduct user and market research in order to learn the current context of the rental application for applicants
  • Execute UX Design practices and wireframing to both capture all requirements and establish usable and well defined flows
  • Apply insights from research and best practices to make the application easy and quick to complete
  • Collaborate with UI designers to create an easy to use and aesthetically pleasing UI
  • Collaborate with dev to ensure designs are implemented as intended

Foundations

Through research and discovery discussed below, our goals for the project were:

Goal 1: Reduce time on task. With a general idea of how long it takes applicants to complete an application, we aimed to improve that number by streamlining and simplifying the process.
Goal 2: Improve completion rate. We did not start the project with analytics on completion rate due to the application process being on paper and physical. However, through our research we found it was somewhat common for applicants to bail. We addressed this by designing a portal and application that allows to you save progress, leverage data that has already been entered, and utilizes progressive disclosure that only shows users what they actually need to see.
Goal 3: Reduce friction. Through design principles and best practices, we reduced the friction in the process as much as possible. Examples of this ended up being: yes/no questions that only shows fields and data based on a yes answer, and grouping questions and content together into a clear step by step process that gives the user clarity on where they are and how much they have left.

Process

Research

The first stop for us after discovery with the client was referencing existing research executed by both our team and the client. Discussed in the resident portal project, one of our first steps in this process was referencing user research with current and previous tenants that have experience renting and using a resident portal. For the application process, we wanted to take what was learned from that research and make sure those insights were baked into our approach. The highlights from that research were as follows:

  • Research participants often showed frustration with in person processes and not having the option to complete these tasks online, this was especially true with younger and middle aged participants. This insight applies to our application process and paying rent specifically. Participants showed interest in an online portal that would allow them to fill out applications online.
  • Participants showed interest in the ability to save applications and return to them as well as the ability to leverage a sort of "autofill" for applications.
  • Participants showed frustration with the time it takes to fill out the application, the questions asked, and having to reference information in multiple places in order to fill out the application. All these things boiled down to the application being somewhat of a burden to participants, leading to incomplete applications or avoiding applying completely if the applicant had other options.

These insights are where our foundations and main focus for the application began to form. Through this understanding, we felt we had the background we needed to move forward in addressing our client's goals and user's needs.

Information Architecture / Content Audit

This phase consisted primarily of gathering all the information required for the application including every question, disclosure, form, and piece of information that is currently involved in the process. We then worked with the client on identifying what had to be asked vs what was only a want. Once we had a clear idea of all the informational requirements for the application, we then were able to group and break down all the questions and content into relevant sections, giving us the start of our step by step approach.

Wireframe

Once we had a grasp on the information, questions, and content we needed to cover in the application, we then began our wireframing. In this phase, the flow and structure of the application began to take shape.

Add Flow
Example of the step by step section approach and collaboration on the questions

UI Design & Prototype

Once we had all the flows illustrated and approved in wireframing, the next step was collaborating with a couple of UI designers to bring the concept to life. My role in this phase was to work collaboratively with the UI designers on aesthetic and interactions, while ensuring the insights and foundations were communicated and implemented in this stage.

Application portal features and status
Step by step approach and yes/no question approach example with content added

Next Steps

The last step for me on this project was ongoing collaboration with an external dev team to ensure the designs and flows were implemented as intended. This was a challenge as our client outsourced this work, so extra steps were taken in terms of documentation and prototyping to communicate the designs, alongside presentations, walk throughs and constant review and feedback.

Want to hear about this project in more detail?

See more of my work