In den letzten Jahren dreht sich bei Google alles um das Material Design, mit dessen Weiterentwicklung und Umsetzung viele Designer im Unternehmen beschäftigt sein dürften. Regelmäßig wird diese Design-Richtlinie erweitert und um neue Tools ergänzt. Ursprünglich wurde das Ganze einmal für Android Smartphones und Tablet PCs entwickelt (wir verwenden es natürlich auch in unserer nativen Android App). Doch mittlerweile ist es auch das aktuellste und mächtigste UI-Framework im Web.
Fast jeder kennt die bekannten Design-Guidelines aus dem Hause Google (bewusst oder unbewusst): Klare Linien, Animationen zur Illustration von Veränderungen, klare Farbschemata.
Immer mehr Menschen sind mit dem Look des Marterial Designs vertraut, da eine wachsende Anzahl großer, bekannter Plattformen und Websites auf diesen Baukasten setzt. Außerdem profitieren wir sowohl technisch als auch konzeptionell von den zur Verfügung stehenden Ressourcen, die bestens dokumentiert und durchdacht sind. Außerdem geben sie uns die Möglichkeit mehr Ressourcen in die funktionale Seite zu investieren und hiervon profitieren die Kunden und Nutzer eben nunmal am meisten.
Technisch haben wir uns für das Open Source Framework “Material UI” entschieden, welches auf dem von uns geliebten und verwendeten React-Framework basiert. Dieses stellt aus unserer Sicht die vielleicht fortgeschrittenste und populärste Umsetzung eines Material Design UI Kits dar.
Abgesehen von dem Einsatz von Google´s Material Designs haben wir mit dem letzten Deployment noch ein paar weitere Verbesserungen implementiert. Die umfassende Überarbeitung unsere Dashboards bringt konkret folgende Vorteile für unsere Nutzer:
1. Bessere Lesbarkeit
Wir haben unsere Hausschrift “Basier Circle”, die wir schon auf der neuen Website verwenden, nun auch in unserem Dashboard integriert. Dies verbessert die Lesbarkeit auf allen Geräten, auch in den unterschiedlichsten Screen-Größen. Die Schrift sieht in allen relevanten Browsern klasse aus.
Wir sind große Fans dieses kleinen spanischen Design-Studios, das diese Schrift entwickelt hat: http://atipofoundry.com/fonts/basier
2. Einheitliche Formen und Formularen
Material Design bietet einen breiten und toll gestalteten Baukasten an unterschiedlichen Formen, Formularen und UI-Elementen, die aus unserer Sicht kaum Wünsche übrig lassen. Durch die Verwendung dieses Baukasten stellen wir sicher, dass bspw. das Formular für die Eingabe von Texten bzw. Inhalten überall gleich aussieht und sich auch überall gleich verhält.
Effiziente, saubere Funktion steht beim Material Design im Vordergrund und ist bis ins letzte Detail sehr hochwertig ausgearbeitet. Ziel ist es, eine positive, benutzerfreundliche Interaktion zwischen User und Website (oder auch App) zu schaffen. Klare Formen helfen dem User, sich zu orientieren und verringern so die notwendigen Navigationswege.
3. Eine homogene Farbpalette
Aber nicht nur die Auswahl von Elementen ist eine wichtige Grundlage für ein UI Framework, sondern natürlich auch die Auswahl der Farbpalette. Es darf nicht zu bunt sein, nicht zu eintönig und gleichzeitig dürfen sich Farben natürlich nicht beißen oder in Kombination unlesbar werden.
Die von Google zur Verfügung gestellte Farbpalette ist eine wunderbare Basis, die wir je nach Bedarf in Teilen anpassen bzw. adaptieren. Sie bietet neben einer einheitlichen Arbeitsgrundlage auch komplexe Funktionen und stellt Inhalte sauber dar.
Wie gesagt: da immer mehr populäre Plattformen das Framework benutzen, gewöhnen sich die Nutzer schnell daran. Material Design verspricht wie wir finden daher eine gleichbleibend gute Benutzererfahrung auf allen Endgeräten.
Wir sind gespannt auf Ihr Feedback und freuen uns natürlich über Anregungen und Anmerkungen aller Art.