• responsive website

    ZDF Terra X

    www.muellermeter.zdf.de

Terra X produced a TV documentation about the average german citizen. To accompy the documentation, ZDF was searching for an agency to develop a questionnaire which the audience could answer along the TV show.

My role

I joined the team early as a concepter and user experience designer for the pitch. I developed the idea to design a questionnaire that's fun to fill out. As a result, I planned to present the user an individualized infographic where people can compare their own answers with the answers of the average german male or female citizen. ZDF loved the concept because it went much more further than the questionnaire they had in mind and so we won the pitch and started working on the idea.

Merken

The Challenge

We decided to produce a responsive website, so people could easily fill out the questionnaire with a mobile phone or a tablet in front of TV. It was mostly challenging to optimize the input fields for several mobile types, we definetly underestimated debugging time, but we were able to solve all issues in time.

THE APPROACH

sketching

sketching

I started the user experience design for mobile devices with rough paper sketches, some wireframes and a selection of input types for questionnaires.

creating moodboards

creating moodboards

After it was clear which questions we have to include, I started researching possible web input types for mobile devices. We wanted people to have fun while filling out the questionnaire, so I was searching for playful ways to design the questions.

designing questions and statistics

designing questions and statistics

Together with a graphic designer, we then started to design the questionnaire with the preferred input types and adapted them according to the style guide of the ZDF.

The result

We developed a playful questionnaire to fill out while watching the TV show.

 

 

playful questionnaire

playful questionnaire

We developed a qustionnaire with 15 questions. To create a more playful experience we were using special ways of entering the answers.

illustrations

illustrations

The graphic designer additionally developed illustrations for each possible answer.

infographic

infographic

After the user answered the questions, the user received an HTML5 infographic with his answers in comparison to the answers of the average germen.

MEDIA ECHO

Page, a popular german magazine for design and media reports about the website

read article

Merken

Merken

Merken

Merken

Merken

Merken

Merken

Merken