Dream of Homes

Project Overview

Dream of Homes is an interactive calculator we created for one of our clients. It begins as a quiz that allows users to answer different home style questions through visual guides and dynamic interactivity. At the end of the quiz, several properties will be recommended based on the user’s choices. As the user answers questions, the game will offer specific home style to match the user’s choices. Then, the quiz will generate a visual home scenario along with a list of home values, so that user will knows the value of his/her dream home style. User can also share the results on the social networks.

Screenshot of the welcome screen.

Concept

Our three original concepts allowed users to interact with the quiz differently.

Concept 1: Standard Picture Quiz

Users select the picture that best matches their response to a particular question, and hit “Next Question” to move forward. The ultimate outcome will be a picture that combines all of the user’s responses along with a share function. There is also a CTA button on the results page that will direct users to the Mortgage Calculator page so they can accurately calculate their mortgage payment.

Wireframes of concept 01.

Concept 2: Scenario Stage Quiz

Users can select one answer at the left of the question which simultaneously changes the scenario stage on the right according to users’ choice. Then, a calculator appears on the stage and the value changes accordingly. At the end of the quiz, the stage will amplify as a full window and users can share the results. There is also a CTA button on the result page that will brings users to the Mortgage Calculator page in case they want to calculate an accurate payment.

Wireframes of concept 02.

Concept 3: Flipping Cards Quiz

Users will choose the best scenario by flipping one of the scenario cards. Once one card is flipped, it will go to the next question. At the end of the quiz, users will see the result in a scenario card format that has the home value and share functionality. There is also a CTA button on the result page that will brings users to the Mortgage Calculator page in case they want to calculate an accurate mortgage payment.

Wireframes of concept 03.

Final Mockups

Illustrations of different families.
Choose your character screen.