Perfect Properties
I found the following to be beneficial methods for my design development
Discover
Research
Most of the discover phase research was included in the project brief, such as a user persona, user stories, and feature requirements. The provided objective was to create responsive web app that provides property buyers with information on properties of interest. I familiarized myself with all the brief’s content, and additionally conducted some light market research with apps such as Zillow, Realtor.com and Trulia. These enabled me to understand responsive layouts and general market features.
Identify
User Flow
Now that I understood the objectives and common design patterns, I was able to create three user flows. Click Images to expand.
Flow One : As a user, I want to create a profile containing all my property criteria, so that I am recommended results most relevant to me
Flow Two: As a user, I want to be able to search and filter properties, so that I can find good matches based on my needs. As a user, I want to be able to save or mark properties I am interested in, so that I can easily revisit them.
Flow Three : As a user, I want to be able to contact the right people if I am interested in viewing a property, so that I schedule a viewing.
Design
Low Fidelity Wireframes
After some quick sketches on pen and paper, the designs became digital with Figma. Here are the first low fidelity frames.
Mid Fidelity Wireframes
Now that the designs were brought to life, I was able to start further developing the frames into a mid-fidelity scope with the addition of various UI elements such as color, grid spacing, iconography and images.
Define
With the designs beginning to take shape, it was time to take the design in a specific direction
Style Guide
Once the style guide was completed, and applied to the mobile first design, I adapted the prototypes for larger screens. I used an 8 column grid for tablet and a 12 column grid for desktop to cohesively expand designs from mobile onward.
Takeaway
Both these applications offered great inspiration for Vela. They both included simple interfaces and were very intuitive and easy to navigate. These applications offered (across three platforms) a variety of features desirable for Vela, such as the community uploads, or up to date condition information. These apps were an excellent representation of the market, and a wonderful jumping off point in my design process. I was also pleased to see that no application currently offered exactly what Vela hoped to accomplish, thus an empty niche market!
Experience the Perfect Properties prototype here
Reflection
Overall, I had a very pleasant experience designing this application. I have strengthened my skills with Figma, and feel more comfortable with the design process as a whole. I have a clear understanding of how to build a design system and the value of naming elements appropriately from the beginning. I learned to keep my design simple and elegant, and allow it to speak for itself. I also understand the importance of following an emotion and theme to have a cohesive feel for your application/website. I am excited and proud to have accomplished this new challenge.