Rebranding
Webdesign
Icon-Entwicklung
LinkedIn-Vorlagen
Dokument-Vorlagen
LUPUS & COMPANY Redesign
LUPUS & COMPANY ist ein deutsches Beratungsunternehmen mit ausgesuchtem Experten-Netzwerk, bestehend aus freiberuflichen Berater:innen, die vorwiegend auf den IT-Bereich und digitale Transformation spezialisiert sind.
Die Herausforderung
Die bereits bestehende Webseite soll an die in den letzten Jahren erweiterten Services angepasst werden und die inhaltliche Struktur verbessert und vereinfacht werden. Dabei soll ihr ein frischer Look verpasst werden. Der Content der Seite soll einfach austauschbar bleiben und wenn möglich mit dem Tool WIX umgesetzt werden, da die alte Webseite damit erstellt wurde. Es soll ein einheitlicher Stil geschaffen werden, bei dem auch Farben und Schriften erneuert werden können. Das Unternehmen möchte professionell bezüglich Branding beraten werden und ist für weitere Vorschläge wie ein Logo-Redesign offen.
Ausschnitt der alten Webseite von LUPUS & COMPANY
Strategie- und Strukturierungs-Workshop
Auch, wenn die Firma bereits seit Jahren besteht, lohnt es sich, einen kritischen Auffrischungsblick auf die Strategie zu werfen. So organisiere ich gemeinsam mit meiner Projektpartnerin Katharina Liedl, die Teil des LUPUS-Netzwerks ist, einen kleinen Strategie- und Strukturierungs-Workshop, in dem nochmal gemeinsam mit den zwei Geschäftsführern Alexander und Jan die inneren Werte des Unternehmens überprüft und weitere Komponenten der Corporate Identity genauer herausgearbeitet werden. Im Anschluss daran können wir die bereits bestehende Webseite und ihre Struktur gemeinsam analysieren und restrukturieren. Durch die klare Definition der Markenstrategie können hierbei viele Fragen rasch und klar beantwortet werden: Wie und was möchten wir auf unserer Webseite kommunizieren?
Card sorting für die Inhalte der Webseite in Miro
Content first
Mit den gesammelten Infos erstelle ich eine erste Sitemap und skizziere damit erste Wireframes für die neue Seite an, mit denen ich die anderen Kooperationspartner an den Texten feilen lasse, während ich mich ans Redesign des Corporate Designs mache. Die Texte werden auf Grundlage der Wireframes in Miro besprochen und gemeinsam überarbeitet. Die Inhalte bedingen kleine Änderungen des Seitenaufbaus und werfen neue Fragen auf, die bereits vorm Webdesign-Entwurf beantwortet werden können.
Erste Text-Konkretisierung mithilfe der Wireframes
Dank der vorherigen Ausarbeitung der Tonalität von LUPUS & COMPANY ist auch klar, wie die neuen Texte klingen sollen
Sanftes CD-Redesign
Durch die konkrete Definition der Unternehmenswerte, sowie der Tonalität und Persönlichkeit von LUPUS kann meine Redesign-Arbeit in einem klaren Rahmen und mit Vision beginnen. Das bereits bestehende Logo mit dem geometrisch aufgebauten Wolfskopf soll verbessert werden und mehr wie ein Wolf aussehen.
Ich bediene mich dabei der geometrischen Form des Dreiecks, welche auch in der neu erarbeiteten Formensprache der Marke den Ton vorgeben soll. Da es sich um eine bereits bestehende Marke handelt, greife ich bewusst Altbewährtes auf und entwickle daraus eine durchgängige Gestaltungslogik für weitere Kommunikations- und Stilmittel.
Logovarianten sorgen für mehr Flexibilität in der Verwendung auf verschiedensten Kommunikationsmitteln
Die alten Brand-Farben werden von neuen, die Unternehmenswerte deutlicher hervorhebenden Abwandlungen angepasst. Mit der Reduktion auf vier Marken-Farben entstehen zwei Farbschemata, die als Dark und Light Modus fungieren.
Und natürlich braucht eine starke Marke auch eine starke Hausschrift, welche ich in der Catamaran fand. Diese passt unter anderem zu LUPUS & COMPANY, weil sie fürs digitale Zeitalter entwickelt wurde und altbewährte Qualität mit modernen Ansätzen verbindet. Interessant ist auch der Name der Schrift, welcher ebenso sehr gut zum Logo passt, weil ein Katamaran ein Schiff aus zwei parallelen gleich großen Rümpfen ist – genau wie beim Wolfskopf sind beide Seiten symmetrisch und beinhalten das Dreieck als markante Form.
Webdesign und Icon-Entwicklung
Mit den fertigen Texten und den Wireframes übersetze ich die neu definierten Designelemente auch gleich in ein Screendesign für die Webseite. Da die Seite mit dem Webseiten-Builder EditorX umgesetzt wird, denke ich dabei in einem Baukastenschema, das vom Kunden flexibel verwendet werden kann und alle vordefinierten Anforderungen erfüllt.
Für den Seitenentwurf werden auch erste Icons, die für die Leistungen stehen, benötigt. Hier bediene ich mich der Formensprache, welche das Dreieck aus dem Logo aufgreift und als Grundlage für die Icons dient. Um farblich flexibler zu werden, dürfen die Icons zusätzlich zum Grün eine Abstufung dieser Farbe verwenden. Es enstehen in gemeinsamer Abstimmung erste Piktogramme, die jeweils zwei gleiche Formen miteinander kombinieren, welche ihre Position verändern können, was bei späteren Content-Design-Vorlagen für LinkedIn für mehr Abwechslung, die unkompliziert vom Kunden selbst gestaltet werden kann, sorgt.
Webseite und Vorlagen sollen so angelegt sein, dass der Kunde meine Hilfe später im Idealfall nicht mehr benötigt, und sich trotzdem einer Gestaltungssprache bedient, die durch die Benützung durch Design-Laien nicht unprofessionell erscheint. Die dafür notwendige Simplizität des Designs begleitet meinen Designprozess. Ich möchte, dass sowohl ich als auch der Kunde Spaß an der Arbeit mit den Designelementen finden und tobe mich innerhalb dieses Usability-Rahmens kreativ aus.
Umsetzung in EditorX von WIX
EditorX ist ein ziemlich umfangreiches Werkzeug von der Saas-Plattform WIX und lässt mich mithilfe einer umfassenden Dokumentation und ein paar Tutorial-Videos fast alle Designelemente ohne Code umsetzen. Einzig das CMS zeigt noch ein paar Beschränkungen in seiner Funktionalität, aber auch hier ist bereits ziemlich viel unkompliziert möglich. Allerdings traten immer wieder vereinzelt trotz guter Internetverbindung sehr lange Ladezeiten und Fehlermeldungen auf, unabhängig vom benutzten Browser, weshalb ich von der Gesamtleistung von WIX nicht vollends überzeugt bin. Die Webseite konnte jedoch erfolgreich aufgesetzt werden und alle Funktionen erfüllen ihre Aufgabe.
Vorlagengestaltung für eigenständige Anwendungen
Um auch auf ihrer bevorzugten Social-Media-Plattform in einem kohärenten Stil überzeugen zu können, bat mich LUPUS & COMPANY auch um Content-Design-Vorlagen für ihre Kommunikation auf LinkedIn. Da ich dafür bereits gute Erfahrungen mit der Gestaltungs-Software Canva machte, wurde diese auch hier Mittel unserer Wahl, um einfach benützbare Vorlagen für ihre zukünftigen Beiträge, welche aus Zitaten, umfangreicheren Content-Carousels, Bildpostings oder Statistiken bestehen, zu erstellen.
Zur Vervollständigung ihrer benötigten Brand-Materialien durfte ich mich noch mit dem Office-Paket von Microsoft beschäftigen, um diverse Dokumentvorlagen wie PowerPoint-Präsentationen oder Expertenprofil-Vorlagen in Word ins frische Branding zu bringen. Die Vorlagen können vom Kunden ebenso selbständig verwendet werden und sorgen dafür, dass sich ihr neues Branding nicht nur nach außen, sondern auch innerhalb des Unternehmens entfalten kann.
Die Webseite von LUPUS & COMPANY findet sich unter www.lupusandcompany.com
Ihr LinkedIn-Profil findet sich unter linkedin.com/company/lupus-company-gmbh
Kunden-Feedback
Barbara hat für unser Unternehmen ein komplettes Re-Branding inkl. neuer Website und diverser Templates für Dokumente, Powerpoints, Mailings, etc. umgesetzt. Ihre fundierten Konzepte und die äußerst angenehme Art haben uns absolut überzeugt. Barbara hat unser Business und unsere Zielgruppe sofort verstanden und uns mit viel positiver Energie durch den gesamten Prozess begleitet. Wir sind mit dem Ergebnis sehr glücklich und können Barbara uneingeschränkt empfehlen.
– Alexander Wittkow und Jan Wilhelm