Das Datenvisualisierungsformat des Jahres: Der interaktive Taschenrechner

Ein großartiges Beispiel, um Ihnen zu zeigen, wie es gemacht wird

In diesem Jahr gab es einige großartige Datenvisualisierungen. Von interaktiven Karten über Virtual-Reality-Schnittstellen bis hin zu unglaublich effektiven Business-Intelligence-Dashboards – es gibt eine Menge da draußen. Und da sich die Technologie ständig weiterentwickelt, steigen unsere Erwartungen immer weiter. Als es also an der Zeit war, den diesjährigen Gewinner des besten Datenvisualisierungsformats zu küren, müssen wir zugeben: Es war eine schwierige Aufgabe. Aber ohne weiteres – wir nennen Ihnen den Gewinner 2016 …

Der interaktive Taschenrechner

Es gibt zwar schon seit einigen Jahren eine Menge da draußen, aber interaktive Taschenrechner bringen neue Fortschritte auf den Tisch, die sie weitaus hilfreicher und aufschlussreicher machen und viel besser aussehen lassen (zum Glück haben wir das Zeitalter der klobigen Designs mit Farbverläufen auf jedem Element hinter uns gelassen).

Nehmen Sie zum Beispiel diesen Rechner: Den Rechner “Ist es besser zu kaufen oder zu mieten?” veröffentlicht auf der Website der New York Times. Der Titel selbst sagt Ihnen bereits, welchen potenziellen Wert dieser Rechner hat. Es ist die uralte Frage, die sich jeder schon einmal gestellt hat. Und leider haben sie es auf den Punkt gebracht. Hier ist der Grund:

Berücksichtigung der Anforderungen eines komplexen Datensatzes

Zunächst einmal gibt es bei der Frage “Mieten oder Kaufen?” viel zu beachten. Dieser Rechner erkennt dies an und geht dies perfekt an, mit nicht weniger als 21 verschiedenen Finanzfaktoren, die in interaktiven Diagrammen angezeigt werden, damit der Benutzer ihn an seine eigene Position anpassen kann. Einer der wichtigsten Schlüssel zu jeder Datenvisualisierung sind solide Daten. Und dieser Rechner erfasst alles, um ein wirklich aufschlussreiches Ergebnis zu gewährleisten.

Großartige Designentscheidungen treffen, um dem Benutzer ein großartiges Erlebnis zu bieten

Als nächstes konnten wir einfach nicht über die unglaubliche Benutzeroberfläche (UI) und die Benutzererfahrung (UX) hinwegsehen, die wirklich dazu beigetragen haben, das interaktive Taschenrechnerformat an die Spitze unserer Liste zu bringen – und das aus mehreren Gründen.

• • Das Design ist übersichtlich und nutzt nur zwei Farben und effektive Abstände. Dies ist besonders wichtig für komplexe Datenvisualisierungen, da es ein Gefühl der Einfachheit vermittelt, was für den Benutzer leicht zu einer überwältigenden und schwierigen Erfahrung werden kann.

• • Die Ergebnisse sind sofort verfügbar und basieren auf jeder Anpassung, die der Benutzer vornimmt. Abgesehen davon, dass es super cool aussieht, da sich die Diagramme und Zahlen nahtlos synchron über die Seite anpassen, ermöglicht diese Interaktivität dem Benutzer, die Auswirkungen zu sehen, die jeder Faktor auf seine Entscheidung hat. Es ist unglaubliches Engagement und Einblicke in einem. Nett!

• • Bei allen Elementen kommt modernes, flaches Design zum Einsatz – mit Ausnahme der Slider-Elemente, mit denen interagiert werden kann und die sich durch klare Konturen und Cursor-Hover-Over-Effekte abheben. Dies sorgt für eine leicht unterscheidbare Benutzeroberfläche – selbst für die wenigen Menschen, die unter einem Felsen leben und noch nie einen Schieberegler verwendet haben!

• • Das Endergebnis ist immer sichtbar. Der Rechner verwendet alle seine Metriken, um eine wichtige Zahl zu ermitteln: die monatlichen Kaufkosten (damit der Benutzer weiß, dass er besser dran ist, wenn er eine ähnliche Wohnung billiger mieten kann). Dieser allumfassende Wert wird übersichtlich mit einigen unterstützenden Nebenfiguren in einem eigenen Feld rechts neben dem Taschenrechner angezeigt. Und während der Benutzer durch die verschiedenen Schieberegler im Taschenrechner scrollt, bleibt das Panel in einer konstanten Position, sodass der Benutzer bei Bedarf intuitiv dorthin schauen kann. Darüber hinaus enthält jeder der einzelnen Schieberegler innerhalb des Rechners diesen grün hervorgehobenen Gesamtwert.

• Der Rechner ist komplett mobilfreundlich! All diese Attribute funktionieren immer noch gut und sehen auf Geräten mit einer Bildschirmbreite von nur 250 Pixeln fantastisch aus (zum Vergleich: Die Bildschirmbreite des iPhone 6/7 beträgt 375 Pixel). Die Funktionalität bleibt auch auf Geräten mit kleineren Bildschirmbreiten ungetrübt. Das gute Aussehen beginnt jedoch zu verblassen, und die Lesbarkeit des Textes nimmt ab. Aber wir beschweren uns nicht!

Aufschlüsselung komplexer Daten, um Ideen zu vereinfachen

Um auf den Inhalt selbst zurückzukommen: Der Taschenrechner ist ein großartiges Beispiel dafür, wie die logische Reihenfolge und Kategorisierung von Daten genutzt werden kann, um komplexe Ideen zu vereinfachen. Zuerst werden die einfachsten Fragen gestellt – der Preis des Eigenheims und die geplante Aufenthaltsdauer – gefolgt von den kniffligeren Fragen wie Hypotheken-, Steuer- und Gebührendetails, von denen jede geschickt gruppiert ist, um den Benutzer themenweise durch die Daten zu führen.

Es einfach halten, ohne das Wesentliche zu vernachlässigen

Und schließlich verwendet der Taschenrechner Text – aber nur dort, wo er benötigt wird. Dies ist ein kniffliges Thema, daher muss der Benutzer die verschiedenen Faktoren verstehen, was sie bedeuten und wie alles mit seiner Entscheidung zusammenhängt. Die Seite beginnt mit einem kurzen einleitenden Absatz und enthält ein oder zwei Sätze zur Erläuterung jeder Kategorie von Datensätzen. Zusätzliche Informationen sind bei Bedarf in Hover-Over-Tooltips verfügbar, und ausführlichere Erklärungen der Methodik des Rechners sowie Definitionen einiger der überall verwendeten Finanzbegriffe werden am unteren Rand der Seite angezeigt – so dass nur diejenigen, die nach den zusätzlichen Informationen suchen, sie sehen müssen.

Alles in allem ist dies ein fantastisches Beispiel für einen interaktiven Taschenrechner … Und Grund genug für uns, dieses Datenvisualisierungsformat als das beste zu bezeichnen!

Inspiriert von interaktiver Datenvisualisierung?

Nehmen Sie direkt Kontakt mit uns auf, indem Sie eine E-Mail an hello@datalabsagency.com
senden oder indem Sie auf den Link “Kontakt” in der Navigation klicken.

Möchten Sie weiter suchen? Informieren Sie sich hier über interaktive Datenvisualisierungen.