Abode Apartment Finder
Category Web
Date May 2021
Tools Procreate, Figma, Adobe Illustrator, Adobe Photoshop, Whimsical
Challenge
A user wants to search for an apartment in a specific area, refine the results by a set of criteria, view the details about an apartment, and initiate contact with the owner.
Result
UI Mockups for the apartment site
As someone who likes to illustrate in my spare time and play around with organic shapes, I knew I wanted the logo for the apartment finder to be fluid and playful. I quickly decided I wanted the name and logo to relate to the idea of home. I also wanted to use bright colors, and through the use of photography, be very inclusive and relatable.
![](images/abode/logo-variations.jpg)
The Final Logo
![](images/abode/Artboard 1@2x-100.jpg)
Style Tile
![](images/abode/Artboard 1 copy 11@2x-100.jpg)
Next, I wanted to think more about how the user moves through the site and accomplishes the goal of contacting apartments so I created a task flow.
![](images/abode/Artboard 1 copy@2x-100.jpg)
![](images/abode/Artboard 25@2x-100.jpg)
Next step was to create a landing page for the application where the user gets an overview of the site, including mission statement and general information.
![](images/abode/Artboard 1 copy 3@2x-100.jpg)
![](images/abode/Artboard 1 copy 14@2x-100.jpg)
![](images/abode/Artboard 1 copy 15@2x-100.jpg)
Mobile Version
![](images/abode/Artboard 1 copy 50@2x-100.jpg)
![](images/abode/Artboard 1 copy 51@2x-100.jpg)
![](images/abode/Artboard 1 copy 52@2x-100.jpg)
![](images/abode/Artboard 1 copy 53@2x-100.jpg)
![](images/abode/Artboard 1 copy 54@2x-100.jpg)
![](images/abode/Artboard 1 copy 55@2x-100.jpg)
![](images/abode/Artboard 1 copy 56@2x-100.jpg)
![](images/abode/Artboard 1 copy 57@2x-100.jpg)
![](images/abode/Artboard 1 copy 10@2x-100.jpg)
![](images/abode/Artboard 1 copy 16@2x-100.jpg)
![](images/abode/Artboard 1 copy 17@2x-100.jpg)
![](images/abode/Artboard 1 copy 4@2x-100.jpg)
![](images/abode/Artboard 1 copy 46@2x-100.jpg)
![](images/abode/Artboard 1 copy 47@2x-100.jpg)
![](images/abode/Artboard 1 copy 18@2x-100.jpg)
![](images/abode/Artboard 1 copy 19@2x-100.jpg)
![](images/abode/Artboard 1 copy 48@2x-100.jpg)
![](images/abode/Artboard 1 copy 49@2x-100.jpg)
![](images/abode/Artboard 1 copy 20@2x-100.jpg)
![](images/abode/Artboard 1 copy 21@2x-100.jpg)
![](images/abode/Artboard 1 copy 22@2x-100.jpg)
![](images/abode/Artboard 1 copy 23@2x-100.jpg)
![](images/abode/Artboard 1 copy 24@2x-100.jpg)
![](images/abode/Artboard 1 copy 25@2x-100.jpg)
![](images/abode/Artboard 1 copy 26@2x-100.jpg)
![](images/abode/Artboard 1 copy 27@2x-100.jpg)
![](images/abode/Artboard 1 copy 28@2x-100.jpg)
![](images/abode/Artboard 1 copy 29@2x-100.jpg)
![](images/abode/Artboard 1 copy 30@2x-100.jpg)
![](images/abode/Artboard 1 copy 31@2x-100.jpg)
![](images/abode/Artboard 1 copy 32@2x-100.jpg)
![](images/abode/Artboard 1 copy 33@2x-100.jpg)
![](images/abode/Artboard 1 copy 34@2x-100.jpg)
![](images/abode/Artboard 1 copy 35@2x-100.jpg)
![](images/abode/Artboard 1 copy 36@2x-100.jpg)
![](images/abode/Artboard 1 copy 37@2x-100.jpg)
![](images/abode/Artboard 1 copy 38@2x-100.jpg)
![](images/abode/Artboard 1 copy 39@2x-100.jpg)
![](images/abode/Artboard 1 copy 40@2x-100.jpg)
![](images/abode/Artboard 1 copy 41@2x-100.jpg)
![](images/abode/Artboard 1 copy 42@2x-100.jpg)
![](images/abode/Artboard 1 copy 43@2x-100.jpg)
![](images/abode/Artboard 1 copy 44@2x-100.jpg)
![](images/abode/Artboard 1 copy 45@2x-100.jpg)