Kontakt

040 36138 777 hkbis@hkbis.de
FOKUSTHEMA HR MANAGEMENT mehr erfahren
HKBiS Handelskammer Hamburg Bildungs-Service | German-Brand-Award-2023 | von links: Christian Hameister, Adrian Hönig, Philipp Fischbeck

Herzklopfen

German Brand Award 2023 🏆 für unseren Website Relaunch

19. Juni 2023 , Christian Hameister

German Brand Award 2023 🏆 für unseren Website Relaunch

19. Juni 2023 , Christian Hameister

German Brand Award 2023 Gold fĂĽr Excellence in Brand Strategy & Creation

Kategorie: Brand Communication – Web and Mobile

Mit unserem Website Relaunch wurde uns am 15. Juni der German Brand Award 2023 in Gold verliehen. Guter Grund fĂĽr einen Blog-Artikel, der beschreibt, wie es dazu gekommen ist.

Wir bieten unseren Kunden nicht nur eine umfassende Palette an Weiterbildungskursen, die sich an den jeweiligen Bedürfnissen orientieren, sondern verstehen uns auch als Innovationstreiber in der IHK-Weiterbildungslandschaft und garantieren dabei höchste Qualität. Das war auch unser Anliegen bei der Konzeption und Umsetzung unserer neuen Website, die im Sommer 2022 live geschaltet wurde. Ziel des umfassenden Website-Relaunchs war es Aufgeschlossenheit abzubilden – bedeutete für uns: Staub wegpusten und zeigen, dass Weiterbildung Spaß macht!

Denn wir sind der Meinung, dass Lernen nicht nur effektiv sein sollte, sondern auch Freude bereiten kann. Deshalb haben wir uns fĂĽr ein modernes und ansprechendes Design entschieden, das unsere Kunden begeistert. Unsere neue Website bietet unseren Kunden nun eine noch bessere Ăśbersicht ĂĽber unser Angebot an Weiterbildungskursen. Dabei legten wir besonderen Wert auf eine intuitive Navigation und klare Strukturen. So finden alle schnell den passenden Kurs fĂĽr ihre BedĂĽrfnisse.

Aber nicht nur die Optik wurde verbessert: Auch inhaltlich haben wir unsere Website komplett überarbeitet. Mit unserer Story möchten wir unseren Kunden einen umfassenden Einblick in unser Unternehmen geben – von unserer Philosophie bis hin zu unserem Team. Zudem bieten wir jetzt noch mehr Möglichkeiten zur Interaktion mit uns. Wir sind stolz darauf, dass es uns gelungen ist, unsere Idee einer zeitgemäßen IHK-Weiterbildungslandschaft auch online umzusetzen. Mit unserer neuen Website wollen wir zeigen: Weiterbildung muss kein trockenes Thema sein! Bei uns steht der Spaß am Lernen im Vordergrund – denn wer Freude hat beim Lernen wird schneller Erfolgserlebnisse verbuchen können!

HKBiS Handelskammer Hamburg Bildungs-Service | Logo German Brand Award 2023

JurybegrĂĽndung

„Die Handelskammer Hamburg Bildungs-Service gemeinnĂĽtzige GmbH (HKBiS) bedient mit 129 Kursen nicht nur ein ĂĽberaus breitgefächertes Angebot, sondern vertritt auch Werte wie Ethik und Nachhaltigkeit. Die neue Website besticht mit einem frisch und jung wirkenden Look-and-Feel, der in vier verschiedenen Farbwelten verfĂĽgbar ist und von den Userinnen und Usern nach Belieben ausgewählt werden kann. Hinzu kommt eine motivierende und effiziente User Experience, bei der Interaktivität und SpaĂź eine zentrale Rolle spielen, was sich auch positiv auf die Verweildauer und das Ranking in den Suchergebnissen auswirkt. Alles in allem kann man der HKBiS zu dieser groĂźartigen Website nur gratulieren. Wie hier Kursangebote und ethische Werte emotional vermittelt werden, ist herausragend und hebt die Marke vom Wettbewerb trennscharf ab.“

HKBiS Handelskammer Hamburg Bildungs-Service | German Brand Award 2023 | Jury: Dr. Saskia Diehl (Geschäftsfuhrerin GMK Markenberatung), Axel Löber (Leiter Global Brand & Marketing E.ON SE), Katrin Menne (Head of Brand & Research commerzbank AG), Günter Moeller (Geschäftsführer hm+p. Herrmann. Moeler + Partner), Stefan Raake (Geschaftsfihrer AMC Finanzmarkt GmbH), Prof. Ute Röseler (Professorin für Markenkommunikation Brand University of Applied Sciences Hamburg), Michael Rösch (Co-Founder TOMINO Mitgründer wirDesign AG), Prof. Dr. Simone Roth (Professur für Marketing Hochschule Ruhr West), Christian Rummel (Deputy Global Head of Brand Communications & CSR Deutsche Bank AG)

Mit unserem innovativen Ansatz setzen wir neue Maßstäbe in der Branche

Neben einer Reihe von technologischen Innovationen haben wir auch neueste Trends in der Gestaltung bzw. Darstellung unserer Angebote im Netz berĂĽcksichtigt. Und wie es fast bei Allem ist, ist der GroĂźteil fĂĽr Nutzer gar nicht sichtbar. Mit einem eigens programmierten All-in-One-Webservice haben wir nun fast alle Services im Login-Bereich „Mein HKBiS“ abgebildet, die fĂĽr unser tägliches Tun unabdingbar sind und unseren Lehrenden und Lernenden einen umfassenden Service bieten. Dieser Service ist so intuitiv und benutzerfreundlich gestaltet, dass sich jeder Nutzer schnell zurechtfindet. Die Navigation erfolgt einfach ĂĽber eine ĂĽbersichtliche MenĂĽstruktur, die alle wichtigen Funktionen enthält. Optisch haben wir unsere Angebote auf den neuesten Stand gebracht. Mit einem modernen Design und einer klaren Strukturierung präsentieren wir uns im Netz nun noch ansprechender fĂĽr unsere Zielgruppe.

Auch in puncto Sicherheit haben wir keine Kompromisse gemacht. Unsere Plattform ist mit den neuesten Verschlüsselungstechnologien ausgestattet und erfüllt höchste Datenschutzstandards. Wir sind stolz darauf, unseren Lehrenden und Lernenden einen allumfassenden Service bieten zu können – von der Anmeldung bis hin zum Abschluss. Unser All-in-One-Webservice vereinfacht nicht nur unseren Arbeitsalltag enorm, sondern bietet auch ein Höchstmaß an Komfort für unsere Kunden.

Inhalte einer umfangreichen Lernumgebung in einem attraktiven Design

Eher funktional, oder doch mit modernem Design, ausgefeilter UI, UX und ĂĽberzeugendem Brand Storytelling? Diese Frage haben wir mit unserer Agentur Nova Digital ganz klar beantwortet. Vielen Dank an dieser Stelle fĂĽr die vertrauensvolle Zusammenarbeit!

Gemeinsam haben wir uns auf ein modernes Design mit einer klaren Struktur und intuitiven Bedienung geeinigt. Wir wollten, dass „Mein HKBiS“ nicht nur funktional ist, sondern auch optisch ansprechend und motivierend fĂĽr die Nutzerinnen und Nutzer wirkt. Dabei war es uns wichtig, dass das Design zum Inhalt passt und unsere Brand Story authentisch widerspiegelt. Mit gezieltem Einsatz von Farben, Formen und Bildern haben wir eine visuelle Sprache entwickelt, die den Charakter unserer Marke mehr als zuvor unterstreicht.

Auch bei der User Experience (UX) haben wir besonderen Wert auf eine hohe Qualität gelegt. Die Navigation durch die Lernumgebung sollte einfach sein – ohne lange Wartezeiten oder umständliche Prozesse. Stattdessen setzen wir auf schnelle Ladegeschwindigkeiten sowie einen benutzerfreundlichen Aufbau der Inhalte. Um sicherzustellen, dass unser Konzept funktioniert, hat Nova Digital verschiedene Tests durchgefĂĽhrt: Von Usability-Tests ĂĽber A/B-Tests wurden alle Aspekte des Designs sorgfältig evaluiert.

Das Ergebnis kann sich sehen lassen

hkbis.de ist nicht nur funktionaler als je zuvor – es sieht auch noch großartig aus! Dank des gelungenen Zusammenspiels von UI/UX-Designs sowie einem überzeugenden Brand Storytelling konnten wir die Zufriedenheit unserer Kundinnen und Kunden steigern – was will man mehr?

Farbgestaltung

Starke Farben sind in den letzten Jahren ein wichtiger Design-Trend. Mutige Farben sind reichhaltig, hell und sogar extrem lebendig. Sie können primäre oder sogar sekundäre Farbtöne sein. Über den fast schon normalen Dark Mode hinaus haben wir einfach mal 4 Farb-Modi integriert. So kann sich jeder User seine Lieblings-Ansicht selbst auswählen: Classic, Dark, Pride oder Pastell.

  • Der Classic-Modus ist perfekt fĂĽr diejenigen, die es klassisch mögen. Hier dominieren neutrale Farben und natĂĽrlich Classic Blue.
  • Der Dark-Modus hingegen ist ideal fĂĽr alle Nachtschwärmer oder Menschen mit empfindlichen Augen. Dunkle HintergrĂĽnde in Kombination mit hellen Schriftarten sorgen dafĂĽr, dass das Lesen auch bei schlechten Lichtverhältnissen angenehm bleibt.
  • FĂĽr all jene, die gerne auffallen oder einfach ihre Persönlichkeit zum Ausdruck bringen wollen, gibt es den Pride-Modus. Hier erwarten einen kräftige Regenbogenfarben – ein klares Statement gegen Diskriminierung und eine Hommage an Vielfalt und Toleranz.
  • Last but not least haben wir noch den Pastell-Modus im Angebot: Sanfte Farbtöne wie RosĂ©, MintgrĂĽn oder Babyblau schaffen eine beruhigende Atmosphäre – perfekt um sich zu entspannen oder konzentriert zu arbeiten.

Egal wer welchen Modus bevorzugt – unsere Plattform bietet immer das beste Nutzererlebnis!

Animierende Grafiken

Sie sind ein äußerst wichtiger Trend in unserem UI-Design und machen den Unterschied zwischen einer einfachen und einer außergewöhnlichen Website. Mit animierten Icons, wiederkehrenden Bewegungen und Memojis anstelle von Bildern heben wir uns von vielen Mitbewerbern ab. Wer im UI-Design auffallen möchte, sollte nicht nur auf Ästhetik setzen, sondern auch innovative Elemente wie animierte Icons integrieren. Denn diese kleinen Details können den Unterschied ausmachen!

Liebe zum Detail

Mehr Liebe zum Detail war uns im UI-Design sehr wichtig. Von den Schaltflächen, Symbolen, dem Laden bis zur Navigation machen die kleinen Details ein außergewöhnliches Design. Denn es sind gerade die kleinen Dinge, die den Unterschied ausmachen und das Nutzererlebnis verbessern. Wir haben uns daher intensiv mit der Gestaltung von Icons und Schriftarten beschäftigt, um eine klare Lesbarkeit zu gewährleisten.

Auch bei der Farbauswahl haben wir uns Zeit genommen. Denn jede Farbe hat ihre eigene Bedeutung und kann unterschiedliche Emotionen hervorrufen. Deshalb haben wir bewusst auf bestimmte Farbkombinationen gesetzt, um ein harmonisches Gesamtbild zu schaffen.

Ein weiteres wichtiges Detail ist die Ladezeit unserer Website. Hierbei achten wir darauf, dass unsere Seiten schnell geladen werden können, ohne dabei Kompromisse beim Design einzugehen.

Und nicht zuletzt spielt auch die Navigation eine entscheidende Rolle in unserem UI-Design-Konzept. Wir möchten unseren Nutzern einen intuitiven Weg durch unsere Anwendung bieten – damit sie sich jederzeit sicher fĂĽhlen und einfach navigieren können.

All diese Details tragen dazu bei, dass unser UI-Design nicht nur ästhetisch ansprechend aussieht, sondern auch funktional überzeugt!

Fette Typografie

Das war ein wesentlicher Wunsch für unser Design, der das Bild als Hauptelement ersetzt. Tapfere Typografie kann sowohl im Webdesign als auch im Grafikdesign einen Unterschied machen – das haben wir mit variablen Fonts umgesetzt. Wir sind uns sicher: Variable Fonts werden sich mit hoher Wahrscheinlichkeit als zukünftiger Standard in der digitalen Netzwerktypografie – z.B. bei Websites, in Mobil Apps oder als Systemschriften – etablieren. Denn sie bieten eine noch nie dagewesene Flexibilität und ermöglichen es, dass sich Schriftarten automatisch an verschiedene Bildschirmgrößen oder Geräte anpassen. Das bedeutet nicht nur mehr Komfort für den Nutzer, sondern auch ein gesteigertes ästhetisches Erlebnis.

Auch in puncto Barrierefreiheit spielen variable Fonts eine große Rolle: Durch die Möglichkeit einer dynamischen Anpassung können Texte besser lesbar gemacht werden – egal ob auf kleinen Smartphone-Displays oder großen Monitoren.

Wohlgeformte Funktionalitäten

Der wichtigste Teil unseres UI-Designs war die Funktionalität, das heißt, jedes Element wird basierend auf seinem Zweck und seiner Funktion ausgewählt. Viele Leute denken, dass man sich zwischen Design und Funktionalität entscheiden muss, aber mit den neuen Technologien gehen diese beiden sehr gut zusammen und ergänzen sich gegenseitig. Das Design ist dafür verantwortlich, die Aufmerksamkeit auf die Website oder Anwendung zu lenken, und die Funktionalität erleichtert die Erfahrung. Dadurch kann der Benutzer die Informationen schneller finden.

Darüber hinaus sollten auch die Bedürfnisse verschiedener Zielgruppen berücksichtigt werden. Ein Design, das für junge Menschen ansprechend ist, mag ältere Nutzer abschrecken oder umgekehrt. Daher ist unser UI-Design so gestaltet sein, dass es für alle Altersgruppen zugänglich und verständlich ist.

Neben den ästhetischen Aspekten spielt auch die Barrierefreiheit bei unserem Design eine wichtige Rolle. Es gibt viele Menschen mit unterschiedlichen Behinderungen wie Sehbehinderungen oder motorischen Einschränkungen, die ebenfalls auf unsere Website zugreifen möchten. Das Design muss daher so angepasst werden können, dass es diesen Nutzern gerecht wird.

Insgesamt ging es uns darum, ein positives Erlebnis fĂĽr alle Benutzer zu schaffen – sei es beim Besuch der Website oder bei der Nutzung unseres Login-Bereichs auf einem Smartphone oder Tablet. Durch einen gelungenen Mix aus Ă„sthetik und Funktionalität sowie BerĂĽcksichtigung der BedĂĽrfnisse aller Zielgruppen konnte dies erfolgreich umgesetzt werden.

Doch was steckt noch drin?

Und hier noch ein paar Details zu den Features unseres Login-Bereiches und Technischen Facts unserer Datenbank, denn bei uns ist mit unserer neuen Datenbankstruktur einfach alles Synchron: Website | Datenbank | Mailserver | Monitoring Tools. Das bedeutet für unsere Nutzer eine höhere Sicherheit und schnellere Reaktionszeiten bei Problemen oder Fragen.

Unser Login-Bereich ist benutzerfreundlich gestaltet und bietet die Möglichkeit, sich einfach und sicher anzumelden. Dabei legen wir groĂźen Wert auf Datenschutz und verwenden modernste VerschlĂĽsselungstechnologien, um Daten zu schĂĽtzen. In unserer neuen Datenbankstruktur haben wir auĂźerdem darauf geachtet, dass alle Informationen in Echtzeit synchronisiert werden. Dadurch kann sich jeder Nutzer sicher sein, dass immer die aktuellsten Daten zur VerfĂĽgung stehen – egal ob es um Bestellungen, Kundeninformationen oder andere wichtige Details geht.

Auch unser Mailserver ist perfekt integriert: So gibt es schon eine Reihe an automatischen Benachrichtigungen ĂĽber den Status der Bestellung oder Neuigkeiten zum Unterricht direkt per E-Mail zugesandt.

Und last but not least sorgen unsere Monitoring Tools dafĂĽr, dass mögliche Störungen frĂĽhzeitig erkannt werden können – noch bevor sie Auswirkungen auf einen Besuch unserer Website haben könnten. Denn Kundenzufriedenheit steht bei uns an oberster Stelle!

Features

  • Multi-Mandant mit benutzerdefinierten Rollen, Unterschiedliche Nutzergruppen,  Verschiedene Produktcluster und Kursangebote sowie individuelles Buchungsverfahren
  • Nutzer-Management fĂĽr personenbezogene Daten, Adress-, Kommunikations- und Bankdaten sowie Profiling
  • Kurs-Management mit Ausgabe aller Kursdaten, eigener Sortierung und diversen Filter- und Sortierfunktionen
  • Dozenten-Management zum verwalten von Dozentendaten,  organisieren von Dozententerminen und Stundenplänen und natĂĽrlich unser Upload-Center, in dem Dozenten Termin-, Fach & Kursdokumente organisieren und zum Veröffentlichen (Digital oder Print) beauftragen können
  • Dozenten-Termin-Verwaltung mit Terminplanung, einer Termintauschbörse und Stundenplanung
  • Dokumenten-Management fĂĽr Personendokumente (Zertifikate, Bescheinigungen, Digitale Zertifikate & Teilnehmerbescheinigungen inkl. Mailversand und Validierungsfunktionen, abrufen von Unterrichtsdokumenten (Präsentationen, Fachliteratur)
  • E-Commerce-Funktion fĂĽr individuelle Merklisten, einem Shop fĂĽr kostenpflichtige Buchungen, Buchungen fĂĽr Dritte (z.B. Unternehmen), Wartelistenbuchung, die Möglichkeit Addons zu buchen, Guthaben und Gutscheine anzuwenden und natĂĽrlich das Angebot unterschiedlicher Payments

Tech Facts

  • 250+ Funktionalitäten
  • Modernste Technologien mit Java 17/21, Spring Boot, GraphQL, MongoDB und Microsoft SQL
  • Kein Underfetching und Overfetching durch GraphQL
  • High Performance der Anfragen durch Caching und Query-Optimierung auf Datenbankebene
  • Vereinfachung der Zusammenarbeit mit Drittanbietern durch den Einsatz vom Altair-Web-Client
  • Skalierbarkeit durch JSON Web Token
  • Hohe Wartbarkeit durch Test-Driven-Development-Ansatz
  • Continuous Integration / Continuous Delivery Pipeline durch GitLab

DANKE! DANKE! DANKE!

Wir möchten uns an dieser Stelle bei allen Beteiligten bedanken, die mit uns zusammen dieses Projekt ermöglicht haben und uns dabei helfen, es stetig zu verbessern.

Widrige Bedingungen, wie zum Beispiel die organisatorischen Änderungsanforderungen der Corona-Pandemie oder eine groß angelegte bundesweite Cyberattacke auf das gemeinschaftlich von den Industrie- und Handelskammern betriebene Rechenzentrum, haben zunächst noch dafür gesorgt, dass viele der Funktionen nicht wie geplant fertig entwickelt werden konnten oder so wie angedacht funktioniert haben. Zahlreiche Anpassungswünsche und Hinweise durch alle Nutzer haben uns maßgeblich dabei geholfen, die Website zu dem zu machen, was sie jetzt ist.

Wir haben noch viele Ideen, wie wir die Funktionalitäten erweitern und optimieren können und gehen dies weiterhin mit Hilfe eines externen Entwicklers (SnapDev) und unserer Webagentur an. Danke für das entgegengebrachte Verständnis während der Phase der Widrigkeiten und danke für jegliche konstruktive Kritik und alle Anregungen.