Overview
The Product

The Challenge

Team

My Role

DWV is an application that caters to the needs of the real estate market.

Structure a form for website and mobile.

1 UX/UI Designer

UX/UI Design

I initiate the discovery phase with a brief Desk Research to identify the best practices for structuring forms. Thus, I've found important insights at the Nielsen's Norman Group website:

  1. Keep it short.

  2. Group together related fields.

  3. Present fields in a single-column layout.

  4. Use logical sequencing.

  5. It is recommended to use radio-button options instead of dropdown menus.

  6. Placeholders: if you have to use it, the best option is to place the instruction between the label and the field.

  7. Distinguish optional and required fields.

  8. Avoid the "Reset" or "Cancel" buttons.

  9. Provide highly visible and specific error messages.

After reading some articles about forms, I had some questions about the challenge I was facing.

  • How do people feel when they request services in their condos?

  • Which information do they want to provide first?

The next step defined was to interview users with a card sorting activity.

Seven people who live in condos with different ages and financial statuses were recruited for the activity.

The first question was an open question asking how was their experience of having to call the condo administration in the past.

The second task requires users to arrange the provided stickers in order of importance. Each sticky note represents a form field that is required in the test briefing. The goal is to understand how users share information based on their needs and feelings at the time of the request.

+important

-important

Insights
  • "Every time I had to request services, I was stressed out"

  • Most users send WhatsApp messages to the condominium group to ask for information about requesting services.

  • "Instant feedback is crucial for the condominium as people are often stressed."

  • The form fields name of the condo and type of service most often appear as more important.

  • The form fields contact, date, and attach files most often appear at the end of the form.

  • One of the users told me that they have an application in their condo, but the app doesn't work properly. "Here we report the problems but we can't see the status of our requests."

The Test

The goal of this test is to create a request form for condominium services.

The company offers maintenance, consulting, and support services for condos. To request a service, users must fill out a form that includes specific fields.

  1. Name

  2. E-mail

  3. Telephone

  4. Condominium Name

  5. Service (Choose as maintenance, consulting, support, other)

  6. Description of the service

  7. Date for the service to occur

  8. How you would like to be contacted (e-mail, telephone)

  9. Attach files.

Requirements:

  • The interface should be designed solely for specific services in condominiums.

  • Ensure a clear and logical sequence in the form to prevent users from getting lost.

  • Proper validation of the fields is crucial to prevent any errors.

  • Please create a design that is responsive and can adapt to different screen sizes and devices.

Additional Elements:

  • Create a section with instructions or tips for users to request services in condos.

  • Incorporate a "Cancel" button to allow users to withdraw from the process at any given time.

  • Consider adding a clear visual confirmation after form submission.

How might we

  • How might we improve the experience of the user requesting services?

  • How might we arrange the fields on the form to ensure it gets filled out properly?

  • How might we reduce the stress of the users at the moment of filling out the form?

  • How might we offer information on the request status?

  • How might we ask for feedback about the form efficiency?

  • How might we classify the requests based on urgency?

  • How might we remove the load of WhatsApp requests?

  • How might we offer an instant reply to the user?

  • How might we improve the experience of the user requesting services?

  • How might we arrange the fields on the form to ensure it gets filled out properly?

  • How might we offer information on the request status?

  • How might we reduce the stress of the users at the moment of filling out the form?

  • How might we offer an instant reply to the user?

  • How might we ask for feedback about the form efficiency?

  • How might we classify the requests based on urgency?

  • How might we remove the load of WhatsApp requests?

What did I learn from this project?

Discovery

Development

Now

Later

Next

Development

Wireframes

  • Workshop facilitation.

  • Online forms best practices.

  • Rapport with users.

Design

Next

Later