Das neue Design der Lecturio Homepage soll dem Nutzer ein besseres Produkterlebnis bieten. Über das neue Design der Video-Vorträge haben wir kürzlich berichtet
Tipp: Keine Lust zu lesen? Dann lernen Sie doch einfach online. Wählen Sie hier einfach einen oder mehrere Online-Kurse und starten Sie kostenlos.

responsive-design-horizontales-layout


. Nun wurde auch das Layout der Homepage überarbeitet. Im Doppelinterview sprechen der Leiter der Produktentwicklung Steffen Lohaus und Grafikdesigner Markus Reinecke über neue technische Raffinessen und über Harmonie und Eleganz. Außerdem wagen wir einen kleinen Ausblick in die Zukunft von Lecturio.

Was ist neu am Design?

Markus Reinecke: In den letzten zwei Monaten haben wir intensiv an unserem Layout gearbeitet. Neu ist, dass wir unsere Inhalte nun in der ganzen Breite des Bildschirms präsentieren. Das „Streifenkonzept“ bzw. das neue horizontale Layout verschafft den Inhalten mehr Fokus und wir können sehr schnell und flexibel inhaltliche Veränderungen vornehmen. Sowohl die großen Bereiche als auch die einzelnen Kurse erscheinen jetzt in einem völlig neuen Gewand. Screenshots aus den Vorträgen geben ein sehr viel authentischeres Bild von den Kursen. Die sogenannten Verticalkacheln sind jetzt abgedunkelt und mit weißer Schrift. Das soll es dem Nutzer leichter machen zwischen Kurs- und Bereichskacheln zu unterscheiden.

KurskachelnSteffen Lohaus: Die zweite große Neuerung ist das responsive Design. Dabei passt sich das Layout nun an die jeweils benutzte Bildschirmgröße automatisch an. Das schont die Nerven der mobilen Nutzer. Umgesetzt wurde das neue Design mit Bootstrap – einem HTML-CSS-JavaScript-Framework. Bootstrap steht für State of the Art in Sachen Design und Benutzerfreundlichkeit, ermöglicht eine schnelle Entwicklung und sichert ein widerspruchsfreies Aussehen der Website.

Die Smartphone-Ansicht

Wie setzt Bootstrap das responsive Design um?

Steffen Lohaus: Das funktioniert über so genannte Breakpoints, die bestimmte Bildschirmgrößen festlegen. In Abhängigkeit von der Größe kann dem Browser mitgeteilt werden, welches Layout für das jeweilige Endgerät gelten soll. Da es mittlerweile sehr viele mobile Geräte gibt, muss im Prinzip für jedes Endgerät ein Layout bestimmt werden.

Das „o“ in Lecturio ist jetzt grün, wie kommt’s?

Markus Reinecke: Grün wirkt beruhigend und harmonisierend und steht dennoch für Fortschritt und Bewegung – das möchten wir repräsentieren. Der gewählte Farbkontrast soll den Besucher auch helfen, sein Augenmerk schnell auf das Wesentliche lenken zu können. Neben dem grünen Logo haben wir auch Schrift und Farbe angepasst bzw. vereinheitlicht. Proxima Nova ist eine sehr elegante Schrift, deren Stile – trotz großer Auswahl – gut miteinander harmonieren. Harmonischer wirkt die gesamte Website auch aufgrund weniger sowie besser aufeinander abgestimmter Farben. Das Design besitzt nun – so hoffen wir – mehr Klarheit und Fokus.

Steffen Lohaus: Mit Bootstrap nutzen wir auch die Stylesheetsprache SASS. Damit lassen sich – im Gegensatz zu regulärem CSS – Variablen einmalig definieren, die es uns zum Beispiel erlauben, Farben an einer Stelle im Quellcode zu verwalten . Der Vorteil ist, dass über die Variablen immer dasselbe Hellgrau oder Grün auf allen Seiten verwendet wird.

Was bedeutet der Wandel für unsere Kunden?

Markus Reinecke: Wir erhoffen uns natürlich für unsere Kunden ein schöneres Produkterlebnis, weil das Layout klar strukturiert und das User Interface viel harmonischer ist. So profitieren die Besucher unserer Website von einem sehr hohen Fokus auf die Lerninhalte. Insgesamt steigt der Wiedererkennungswert der Seite.

Steffen Lohaus: Die Usability ist deutlich besser geworden, weil durch das moderne und zeitgemäße Design User sich sehr viel schneller orientieren werden. Das soll Freude machen und davon profitieren auch wir.

Die neue Kursseite

What’s next?

Markus Reinecke: Die Homepage, Themen- und Kursseiten sind nur der erste Schritt bei der Komplettüberholung der Seite. Es folgen alle anderen Bereiche, an erster Stelle der persönliche Bereich, in dem Kunden ihr Dashboard zu all ihren Inhalten und Quizfragen vorfinden. Der Nutzer möchte aber schon vorher wissen, wie sich das Produkt anfühlt. Daher wollen wir zukünftig auf der Startseite auch den Lecturio-Player mit seinen Funktionen in Szene setzen und verschiedene Features um das Produkt herum zeigen wie zum Beispiel unsere zahlreich vorhandenen Quizfragen.

Steffen Lohaus: Der Player soll übrigens nicht nur in Szene gesetzt werden sondern wird ebenfalls überarbeitet und mit neuen Features ausgestattet. Im Oktober planen wir einen Relaunch. Dann können sich die Nutzer unter anderem zum Beispiel an einem Player-Speed-Button erfreuen.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *