Who is happy?

Thetaris GmbH

“Wer-ist-zufrieden.de” is an online survey with gamification elements. It answers the question of what contributes to happiness and what contributes to unhappiness.

Target Group: Consumers.
The site allows users to anonymously share their experiences and opinions regarding different aspects of life and how these contribute to their personal happiness.

Style: We are looking for a website that has a clean and modern aesthetic style. It should appear lightweight and easy to use. Colors should be fresh and modern. See (hands.png) for a reference that we like. Our logo is a placeholder logo (logo.png), you may change its color.

The five pages are:
1) Start page
2) Choose-your-happiness page
3) Happiness distribution report
4) Answer-a-question page
5) Happiness impact report

In detail:
0) Page format
The appended overview.png underlines our requirement. All pages should show nicely on a smart phone and on a desktop computer. The phone is in the focus. The desktop also needs some graphical element to fill up the enlarged screen space.

1) Start page
The start page (see mainpage.png) shows:
- Project title “Wer ist zufrieden”, translates into “Who is happy”
- An area for a picture gallery that cycles through the images in the attached illustrations.png. All images are black/white now. Their colors can be adjusted to fit into the design.
- An introductory text
- A button “Los geht’s”, which translates as “Lets’ start”
- A footer, containing our logo and a link to “Über uns” (about us)

2) Choose-your-happiness page (see choosehappiness.png)
The second page asks our users to rate their personal happiness with regard to some context. The page shows:
- The header “Wer ist zufrieden”
- A progress bar, showing the first step of about 5-6 questions
- One sentence of text describing the context
- A clickable element (star rating, slider, etc. ) that queries the user input
A preview of the chosen happiness as a facial expression. Please view the emoticon palette (emoticons.png), which can be adjusted in color, size, etc. to fit into the design.
- A “Weiter” button (continue)
- The footer

3) Happiness distribution report (see happy-distrib-report.png)
This page shows how many users share a common level of happiness regarding the current context. The page shows:
- The header “Wer ist zufrieden”
- The progress bar
- A repetition of the context (one sentence of text)
- A graphical report showing all choosable happiness levels with their emoticon in the first column. The number of users sharing that happiness is in the second column.
- A “Weiter” button
- The footer

4) Answer-a-question page (see answerquestion.png)
This page is repeated for the remaining 4-5 questions and shows:
- The header “Wer ist zufrieden”
- The progress bar
- A text explaining the question for our users
- A list of choosable answers, somewhere between 2 and 10
- A “Weiter” button
- The footer

5) Happiness impact report (see happyimpactreport.png)
This page shows how people choosing a specific answer are happier or unhappier than the average user. The page shows:
- The header
- A progress bar
- A text (one sentence) describing the context
- A report with two columns:
First column: the list of available answers together with the percentage. The answer you have chosen is highlighted.
Second column: Emoticons corresponding to the happiness level of all users sharing each answer. If that happiness is lower than the average the face will be unhappy and left of the median line. If that happiness is higher than the total average the face will be happy and right of the median line.
- A “Weiter” button
- The footer