Redesign für unsere Website
Nachdem die bitegra solutions im Herbst 2020 den Splash Award Switzerland in mehreren Kategorien gewonnen hat und sogar den Gesamtsieg über alle Kategorien feiern darf, wurde es Zeit für die Neugestaltung und die visuelle und benutzerfreundliche Aufwertung unserer Website.
Die Herausforderung
Unsere bestehende Website wurde damals ohne die Hilfe eines Designers erstellt. Folglich wurden die Informationen ohne einen speziellen visuellen Stil oder eine Struktur dargestellt. Das Potenzial, das Aussehen und Verhalten unserer Website zu verbessern und die Navigation einfacher und zugänglicher zu gestalten, war sehr groß.
Aus alt mach neu, so blieb so gut wie kein Stein über dem anderen und wir haben, was die Konzeption unserer Website angeht, komplett von vorne gestartet. Im Folgenden werden die ausgeführten Schritte gezeigt und erklärt, dass auch Sie ein erfolgreiches Redesign Ihrer Website vornehmen können. Die bitegra solutions ist Experte im Bereich Digitalisierung und im Aufbau und Betrieb von digitalen Lösungen. Sprechen Sie uns daher gerne an.
Design Principles
Zum Anfang analysierten wir den bisherigen Zustand der Website und fixierten einige Potenziale, die wir in der Neugestaltung nutzen wollen. Inspiriert von Don Normans Principles of Interaction Design und Dieter Rams zeitlosen Geboten für gutes Design haben wir uns unsere eigenen Designprinzipien geschaffen. Dieser Teil des Designprozesses muss sehr diszipliniert durchgeführt werden, da im folgenden alles von dieser Analyse abgeleitet wird. So konzentrierten wir uns auf folgende Aspekte besonders:
Konzeption & Wireframing
Mit diesen Leitlinien konzipierten wir einen ersten Prototyp, der durch mehrere User Testings von ausgewählten Personas durchgeführt wurde. Das erhobene Feedback in den User Testings arbeiteten wir in unseren Prototyp ein bis wir eine erste Alpha-Version der Website gestaltet hatten.
Mit den umfangreichen Erkenntnissen aus der Alpha-Version wurde dann eine Beta-Version des Designs erstellt, was wiederum durch ein User Testing validiert wurde. Über mehrere Feedback-Runden näherten wir uns so dem fertigen Beta-Design an, welches die User Needs ausgesprochen gut erfüllt.
Visuelle Gestaltung
Anhand der sehr ausgereiften Ergebnisse des Beta-Designs wurde dieser Design-Entwurf dann durch minimale Verbesserungen fein gezeichnet und in einem Auswahlverfahren anhand der oben definierten Leitlinien als finales Design ausgewählt.
Die Design-Umsetzung und Iteration auf Basis des Design-Tools Figma hat uns erlaubt, kollaborativ und schnell in die Umsetzung zu gehen und Entscheidungen effizient auf Basis einer einheitlichen Entscheidungsgrundlage zu treffen. Zusätzlich bietet Figma einen optimalen Designer – Developer Workflow, der den Developer in die Designprozesse mit einbezieht.
Site Building und Theming
Die alte Drupal 8 Seite wurde hinsichtlich der Neugestaltung auf Drupal 9 aktualisiert, was vollautomatisiert durchgeführt wurde. Die Stärke von Drupal wurde bei dieser Aufgabe wieder bestätigt, da das Update völlig problemlos funktioniert hat und die komplette Inhaltsstruktur der alten Website 1:1 übernommen werden konnte. Hierbei kommen unzählig viele Open Source Komponenten zum Einsatz, welche die Basis-Funktionalität von Drupal erweitern, wie das Gin Admin Theme oder das Twig Tweak Modul.
Mit den sehr ausführlich gestalteten Seiten und Komponenten der Website wurde dann ein Atomic Design Pattern für das Styling inklusive Styleguide umgesetzt, welcher eine hohe Wartbarkeit und gleichzeitig problemlos Skalierung ermöglicht. Mithilfe des neu erschienen Bootstrap v5 setzen wir hierbei auf modernste Frontend-Architektur und konnten dabei unser Design schneller als üblich umsetzen.
Wir sind stolz mit dieser schönen Neugestaltung ins Jahr 2021 zu starten und wünschen allen unseren Lesern, Kunden und Kollegen ein gutes neues Jahr. Wir freuen uns von Ihnen zu hören und Ihnen bei Ihrem Projekt helfen zu können.
Añadir nuevo comentario