Website-Redesign: Software-Unternehmen ASD Personal-Informationssysteme

Die ASD Personalinformationssysteme GmbH bietet Software für Personal-Abteilungen von Unternehmen und sozialen Organisationen an – und das seit mehr als 20 Jahren. Personalarbeit ist Arbeit mit Menschen. Personaler:innen wollen nicht ständig am Rechner hängen, sie wollen sich um ihr Team kümmern. Deswegen ist bei ASD immer im Fokus: Personal-​​ und Zeitwirtschaft so gestalten, dass die Nutzer:innen sich auf ihre eigentliche Arbeit konzentrieren können. ASD hat sich an uns gewandt, um dies deutlicher auf der Webseite sichtbar zu machen.

ZIELFORMULIERUNG:

Die fokussierte Ausrichtung des Unternehmens zeigen – modern & menschlich, klar & geordnet, genau & kompetent.

Strategische Entwicklung

Website Zielgruppen

Webseite-Redesign-ASD-FORMLOS-Berlin

Bevor wir uns an die Gestaltung der Seite gemacht haben, wurde recht schnell klar, dass wir die Zielgruppen hier sehr genau betrachten müssen. Die Webseite richtet sich sowohl an Personen aus der Pflegedienstleitung als auch an die Geschäftsführung und die IT-Abteilung bis hier zum Bereich „Gebäudetechnik“.

Außerdem waren die Bestandskund:innen auch noch eine weitere wichtige Gruppe. Sie sollen sich über die Webseite nämlich direkt zu Schulungen anmelden können. Die Bedürfnisse all dieser Menschen haben wir gemeinsam mit dem Webseiten-Team bei ASD analysiert. Die Ergebnisse waren für alle weiteren Arbeitsschritte prägend.

Inhaltliche Konzeption

Auf der alten Webseite gab es sehr wenig Informationen. Daher haben wir in unserem Webseiten-Workshop bei Projektbeginn alle notwendigen Inhalte gemeinsam mit ASD identifiziert. Schnell wurde klar: die Bereiche Dienstplanung und Personalwesen müssen einzeln beleuchtet werden.

Die Gestaltung der einzelnen Seiten baut daher auf dem Anspruch von ASD auf, dass sich die Anwender:innen bestmöglich auf die eigentliche Arbeit konzentrieren können. Der Mensch steht daher im Vordergrund. Dies erreichen wir durch entsprechende Bilder – aber auch die sprachlichen Formulierungen sowie die Grafiken und Icons tragen dazu bei.

ASD-Home
»Über das gesamte Projekt hinweg haben wir uns gut und kompetent unterstützt gefühlt. Gerade zu Beginn war es wichtig einen (ungeplanten) zusätzlichen Iterationsschritt zu gehen, um die Projektvision passgenau zu konzeptionieren und einen genauen Blick auf die Zielgruppen zu werfen.«
Sina Gantenbrink | Leitung Marketing & PR

FORMLOS hat uns dabei mit Knowhow zu Personas und suchmaschinen-optimierter Informationsarchitektur umfassend beraten und neue strategische Ansätze beigesteuert.

Mit einem agilen Projektmanagement war es möglich, im Projektverlauf neue Erkenntnisse direkt zu implementieren. Dabei hat uns besonders gut die Kommunikation über ein Online-Tool gefallen, zu dem wir Zugang erhalten haben. Dies hat den gesamten Prozess sehr übersichtlich gestaltet und vermehrte E-Mail-Konversationen obsolet gemacht.

Seit dem Relaunch der Website hat sich das Interesse an unserem Angebot definitiv erhöht. Das neue Design wirkt modern und persönlich. Mit der neu gestalteten Website fühlen wir uns mehr als gut repräsentiert.

DesignEntwicklung

Webdesign-Formensprache-Herleitung-FORMLOS-Berlin
Webdesign-Formensprache-Herleitung-FORMLOS-Berlin-mobil

Richtlinien

Bei der Ausgestaltung der einzelnen Elemente haben wir das bestehende Corporate Design als solide Basis verwendet und entsprechend weiterentwickelt. Markante gestalterische Aspekte aus dem Logo haben wir für das Webdesign wieder aufgegriffen. So findet sich die vorhandene Schräge und die abgerundete Formensprache an vielen Stellen im Screendesign wieder.

Die runden und weichen Formen sind dabei ein wesentlicher Bestandteil, um die „menschlichen“ Aspekte bei der Arbeit mit der Software von ASD zu verdeutlichen.

Die Form des sogenannten „Segels“ aus dem Logo taucht als dekoratives Element immer wieder auf. Sie transportiert damit ein weiteres Mal unterschwellig die Konsistenz der Gestaltung.

ASD-Mockup-Laptop
ASD-Icons-Slide3

Farben

Die Corporate Design Farben haben wir aus den bestehenden Kommunikationsmitteln (Broschüren, Verträgen, etc.) entnommen. Bisher wurden die Farben teilweise stark gemischt verwendet. Im Zuge der Webdesign-Gestaltung haben wir hier ein entsprechendes System etabliert.

Es existierte bis dahin auch noch eine weitere Farbe für Hervorhebungen. Diese haben wir im Zuge des Webseiten-Redesigns nun für andere Einsatzzwecke vorgesehen. Das Design basiert vordergründig auf dem dunklen ASD-Blau mit grünen Highlights. Die zwei weiteren Blau-Töne unterstützen das Design als Hintergrund-Farbe für einzelne Abschnitte. Außerdem kommen sie in den Überschriften und Icons bzw. Grafiken zum Einsatz.

Typografie

Schrift-Styles

Das Schriftsystem für den Einsatz bei Überschriften und Fließtexten leitet sich ebenfalls aus dem Logo ab. Der größte Anteil der Überschriften ist in Versalien bzw. Großbuchstaben gesetzt, wie der Firmenname „ASD“ im Markenzeichen auch.

Für alle Anwendungen kommt die „Myriad Pro“ zum Einsatz. Sie verfügt über viele Schnitte und unterstreicht den schlanken Charakter aus dem Logo optimal. Gleichzeitig ist sie durch die vielen schmalen Schriftschnitte (Condensed) recht kompakt aber dennoch gut lesbar.

Wir haben die Überschriften-Hierarchie möglichst gut zur visuellen Unterscheidung ausgelegt. Die Überschriften sollten nicht zu aufdringlich sein, aber dennoch gut erkennbar beim schnellen visuellen Scannen der Seite.

Icons für ASD Website

Die Webseite der ASD Personalinformationssysteme lebt an vielen Stellen von der abstrakten Erklärung der technischen und oft umfangreichen Funktionen der Software. Hierzu haben eine Vielzahl von Icons konzipiert und zusammengestellt. Die Icons verdeutlichen schnell die entsprechenden Rubriken. Bei einem flüchtigen Blick unterstützen sie das Verständnis der Funktionen, Vorteile und einzelnen Abschnitte der Webseite.

Wollen wir zusammenarbeiten?

Wir freuen uns sehr, wenn wir gemeinsam die Welt ein wenig besser gestalten können.

Jetzt Kontakt aufnehmen