Final Project Brief

For my final project, I want to create an interactive and animated quiz that tells you which kind of plant you are based on characteristics of your personality.

Comparison Project 1: 10 Misconceptions on UX Quiz

I wanted to work on a different take of the Every Picture assignment where I simply displayed my houseplants with a hover and click interaction. In this remake, I wanted to take a totally different approach to utilizing my plant photos and instead creating a fun plant-themed quiz that pairs the user with a plant that is most similar to them based on some characteristics.

With that said, I did some research on Awwwards to look at examples of quizzes. This project has many interesting interactions and animations that I think would be fun trying to replicate or draw inspiration from.

Comparison Project 2: Discover Your New Ambition Quiz

This was another example of an interactive quiz that cleverly uses animations to communicate what the quiz question is about and what options are representing. I really like how they animated along with the cursor as you drag through the slider and I want to see if I can do something similar to this in my own project.

I liked how this example had a very simple interface with minimal text. While I imagine my questions will include more text on my own quiz, I do want to achieve a sort of minimalistic look to it so that the screen is not too crowded with each question.

Project Goals

For my project, I want to have a simple quiz that asks questions about personal characteristics, and pairing users with a plant that is most similar based on "similar" characteristics. For example, if a person considers themselves as more introverted, they are more likely to be paired with plants that are more low-light tolerant rather than ones that prefer bright light. I want to be able to ask the questions in an interesting way utilizing JavaScript animations and small interactions that the user can do. Similar to the previous examples, I want to do full page questions that lead to the next until the results are shown.

Design Strategies

For the overall look, I'm aiming for a minimalistic design with possible a mix of sans-serif and serif fonts or just pure sans-serif fonts. I imaging there would be a starting screen for the start of the quiz and each question would take up a full screen. I'm debating if I want to have it scrollable but based on the examples that I saw I think it would work best to have it without any scrolling so that people cannot skip questions. For colors, I'm thinking about using rather earthy tones and I was considering having a forest green colored background with lighter text color for the home page. I want to be able to change the backgrounds for each questions so the color schemes may change between each screen. I imaging most things to just be centered on the screen with possibly a static set of navigation buttons so that users expect where to click to go to the next question. I also wanted to include indicators of where the user is in the quiz so they know they're almost done.

Interaction Strategies

Animations would be triggered by user input whether it may be clicking on certain buttons or simply moving the mouse. I imagine that there would be time-based animations that trigger at the beginning and end of questions to add a smooth transition between screens since I don't think that I will actually link to new pages. I also want to experiment with changing the cursor of the mouse so that it changes with hovers over certain elements. While I don't know exactly what forms of interaction I want yet, I have the idea of making creatively placed buttons or sliders that animate with the cursor as you interact with it.

Experience Strategies

Since the topic of this quiz is so casual, I want to invoke a feeling of relaxation and peace when navigating this website. I hope to achieve this through smooth animations and minimalistic interfaces. I want to use a set of fonts that are easy to read and that look good on their own with a lot of space around them. Since I would only be pretty much asking only a sentence for every question, there is a lot of empty space that I need to place wisely. My hope is that since there is not too much going on in each screen, it will invoke a sense of calm and relaxation since there is not too many things going on at once. I hope to also invoke a sense of satisfaction when interacting with the buttons and inputs and I would want users to play around with them to see the animations.

Audience

My intended audience is practically anybody who is curious about themselves and about plants. They don't necessarily need to have prior knowledge of plants since all the explanations in the end will be very simplified and easy to understand even to beginners. I guess the only knowledge you would need to know about plants is that they need sunlight and water. I hope the takeaway from this is that people get some interesting new knowledge about plants or about themselves in relation to plants.