VIACTIV Activ-o-mat

A twelve-question sports quiz with ranked results and a page per sport

Redesign and relaunch
UX and UI design
Web development

VIACTIV health insurance helps its members lead a more active life. We redesigned the Activ-o-mat on viactiv.de and rebuilt it from the ground up. Twelve questions lead to six sports out of more than 60, each with a video, the reasons behind the match and exercises to get started.

Project

From slider to sport

A relaunch of design and technology: a new interface, a Svelte 5 frontend and content managed in a Statamic backend.
Twelve questions, one per screen: you start by picking two goals, then answer the other eleven on a four-step slider.
Every step comes with its own illustration and its own line, such as the stand-up paddler for “I enjoy it”.
Before the evaluation, an overview lists all answers, and each one can be changed right there.
The result names six sports ranked by fit, with medals for the top three, plus one trend sport.
Each sport has its own page: a video, the reasons it suits you, exercises to prepare, a few facts and a matching VIACTIV offer.

Fünf Ansichten des Activ-o-mat als lange Streifen auf Anthrazit: Startbildschirm mit den Fragen darunter, Frage 1, Frage 8, die Übersicht der Antworten und das Ergebnis.

Frage 8 als Karte auf Orange: die Überschrift „Wenn ich ins Wasser soll, dann …“, eine Paddlerin, der Satz „genieße ich es.“ und der Regler mit Rettungsring und Schwimmer an den Enden, darunter die Knöpfe zurück, Direkt zur Übersicht und weiter.

Fünf mobile Ansichten nebeneinander: Startbildschirm mit Kletterfoto und Start-Knopf, Frage 1 mit zwei gewählten Zielen, Frage 8 mit Regler, die Übersicht der Antworten und das Ergebnis mit Radsport Mountainbike auf Platz 1.

Schriftmuster „Finde die Sportart, die zu dir passt!“ in Univers Bold Condensed, daneben die Ergebniskarte Radsport Mountainbike mit Goldmedaille und die Flächenfarben Orange, Weiß und Anthrazit.

Seite der Sportart Radsport Mountainbike am Desktop und mobil, auf Orange: ein Video mit Handschuh am Lenker, darunter Kurztext und Prof. Dr. Ingo Froböse als Botschafter des Activ-o-mat.