Homely AR App
UX & UI Design | Visual Design | Branding | Prototyping
Tools: Illustrator | Photoshop | InVision | Unity
2018
Intro
A partner and I created Homely, an application for users looking for easy and affordable decor solutions. We used augmented reality to help users visualize their space before purchasing new decor pieces. We ask you the user a few questions and find pre-existing design themes from existing sources.
Defining the Problem
My team started off by studying the interior design industry. We identified a few opportunities that could influence designers and consumers.
Some of the opportunities we discovered were:
Saving users time by not having to travel to stores to only see limited displays and cookie cutter layouts
Helping professionals and consumers visualize ideas in a physical space
Allowing user to share and gain approval efficiently
Challenges
Based off of our research we started to create our visual design, UX/UI work, and the prototyping of our final app as well as showcasing the augmented reality.
Some of the challenges we faced were:
Creating the app using AR even though the soul purpose of Homely isn't to play with AR
Making sure that Homely's main objective was to help users design their space and was customizable to them based off of the questions we ask the user to gage their preferences
A short timeline which was challenging for developing a working prototype
Storyboarding
We storyboarded three user scenarios that targeted various budgets and styles to demonstrate how our app would function for a variety of users. The users we selected were start-up studio owners, college students, and first home buyers.
Low Fidelity Wireframes
Because of our time restrictions, my team member created quick low fidelity wireframes so that there was something to base our design on. This became the building block for our high-fidelity mockups.
High Fidelity Mockups.
I designed our mockups using Illustrator. The user is first asked to determine what budget, room, and style suits them best. They can also take a photo of an already existing piece of furniture and Homely will generate different decor options based off of their responses. Augmented Reality is used to project the decor pieces in their space so they can visualize the look before purchasing items.
Prototyping Our Design
We presented Homely at the George Brown School of Design Year End Show. To showcase the app we prototyped it using InVision.
Presenting the AR
To present the Augmented Reality interaction, we designed four living rooms using the same pink couch as the focal piece. The themes we based the rooms on were, art deco, bohemian, minimalist, and industrial. We built the room in Unity using free assets and styled them using various textures.
We fabricated a 2ft x 2ft wooden cube made from plywood to display each of our rooms. We attached wooden boards to the perimeter to act like the "floor" of the space, as well as to have a spot to secure our AR markers. We created black and white AR markers and also included descriptions for each room. The cube was painted pure white to show contrast against the markers.
AR Markers
I designed the AR markers in Adobe Illustrator and imported them into Unity using Vuforia. Then using Xcode, built the AR to an iPad and our iPhones. We used these devices to present the augmented reality feature to people attending the year end show.