Source: https://cd.union-investment.de/anwendungen/Digitalmedien/leitfaden_digitalmedien
Egal ob für die Gestaltung von Web- oder Microsites, internen Applikationen oder mobilen Apps: Im Kapitel Digitalmedien der CD-Toolbox finden Sie hilfreiche Informationen, um einen konsistenten digitalen Markenauftritt von Union Investment zu gewährleisten.
Die Gestaltung aller Digitalmedien basiert auf unseren Designprinzipien für Basis- und Grafikelemente, die bereits in unser Solid Design System eingeflossen sind. Um möglichst effizient zu arbeiten, wird Bestehendes verwendet – und auch bei notwendigen Neuentwicklungen auf Bestehendem aufgebaut.
* Bitte beachten: : * Nutzen Sie für alle digitalen Anwendungen unser Design System in Figma (Solid Design System). Mitarbeiter und Partner erhalten Zugriff auf die Solid Component Library, die Icons Library und die CMS Library.
Über den Digitalmedienbereich
Konzeption und Neuentwicklung
Tools
Im Kapitel Solid Design System finden Sie eine Erklärung zu unserem alle Digitalmedien übergreifenden Design System. Mit Hilfe des dort ebenfalls hinterlegten Solid Design Systems (SDS) in Figma und der CMS-Library können Sie die Webseiten-Komponenten als konzeptionelle Gestaltungsgrundlage auch für andere Digitalmedien nutzen. Die grundlegenden Komponenten, die sog. Solid Components stehen als Library in Figma zur Verfügung. Die CMS-Library veranschaulicht die komplexeren Komponenten aus dem CMS, basierend auf den SDS Components.
Im Kapitel User Interface finden Sie Layoutprinzipien für den grafischen Aufbau von Digitalmedien und im Kapitel User Experience Prinzipien allgemeine Hinweise für eine gute Nutzerführung. Zur Visualisierung von Webseiten-Komponenten steht Ihnen eine Komponentenbibliothek zur Verfügung.
Im Kapitel App-Icons finden Sie Vorlagen für deren Gestaltung. Im Kapitel Vorlagen Seitentypen werden hilfreiche Gestaltungsbeispiele gezeigt.
Beachten Sie die übergreifenden Prinzipien zum Einsatz der Basiselemente . Darüber hinaus sollten Seiten eines Digitalmediums stets stringent aufgebaut sein, um ein einheitliches Gesamtbild zu erzielen.
Erleichtert Ihnen den Start im Digitalmedienbereich
Mehr erfahren
Ein Überblick über die Magnolia-Komponenten und deren Varianten
Übersicht aller verfügbaren Icons im UI-Design
Nützliche Tipps und Hinweise für eine konsistente Gestaltung von Websites
Unser Figma-basiertes Design System (Solid Design System) gekoppelt mit der CMS-Library zur Veranschaulichung von komplexeren Komponenten ist die ideale Grundlage für die Konzeption und Gestaltung digitaler Medien: Figma enthält bereits ein umfängliches Set an Bausteinen und Komponenten, die Sie für den Aufbau Ihres Kommunikationsmittels nutzen können.
Das Solid Design System (SDS) hat den Anspruch nicht nur Webanwendungen, sondern alle digitale Medien bedienen zu können und die Einzelelemente, wie beispielsweise Buttons, in jedem Digitalmedium von Union Investment einheitlich erscheinen zu lassen.
Bitte achten Sie insbesondere bei der Erstellung von Inhalten oder Oberflächen für Endkunden auf die Einhaltung der Richtlinien zur Barrierefreiheit. Zwar sind die Komponenten des SDS an sich "accessible", dennoch kann die Einhaltung der Richtlinien über das Design System allein nicht garantiert werden. Diese obliegt in der finalen Umsetzung dem Ersteller der jeweiligen Oberfläche.
Wir achten auf einen einheitlichen Markenauftritt in digitalen Medien – und darauf, möglichst effizient zu arbeiten. Verwenden Sie daher stets bereits vorhandene Komponenten; Eigenkreationen oder unnötige Abwandlungen sind nicht zulässig. Nur so lässt sich eine einheitliche Nutzerführung in allen digitalen Medien von Union Investment sicherstellen. Das Solid Design Team gibt gerne Auskunft über bereits vorhandene Komponenten. Sofern keine passende Komponente für einen bestimmten Inhalt oder Funktion existiert, kann diese nach Absprache mit dem Corporate Design Team von Union Investment entwickelt werden. Sie sollte sich visuell und funktional möglichst an bereits bestehenden Komponenten orientieren: Aus diesen können Teile übernommen und durch neue Bestandteile angereichert werden. Übergreifend einheitlich bleibt jedoch der Umgang mit Schrift, Farbe und den Hervorhebungs- und Hierarchie-Ebenen.
Bei jeder Neuentwicklung müssen die Gestaltungsprinzipien der Basis- und Grafikelemente berücksichtigt werden.
Hinweis: Bitte binden Sie das Corporate Design Team frühzeitig in Ihre Neu- und Weiterentwicklungen ein, damit wir gemeinsam unser Design System kontinuierlich weiterentwickeln können.
Zum Solid Design System in Figma
Übernahme aus Bestehendem in Kombination mit einer neu entwickelten Funktion unter Berücksichtigung der Designprinzipien ergibt eine neue Komponente.
Hier finden Sie alle wichtigen Arbeitsgrundlagen und Softwaretools die benötigt werden um im UI-Kontext arbeitsfähig zu sein.
Sie haben keinen Zugang zum Figma-Team von Union Investment?
Wenn Sie mit Union Investment als externer Partner zusammenarbeiten, können wir Sie zu unserem Figma-Team hinzufügen. Wir empfehlen, dass Sie Ihre gesamte Arbeit im Union Investment Figma-Team erledigen, um vollumfänglich mit dem Solid Design System arbeiten zu können. Bitte kontaktieren Sie unseren Support ( Sebastian Schulz oder Sandra Joubert ), um Zugang zu erhalten.
Hier finden Sie eine Übersicht aller fest definierten Basiselemente.
Hier gelangen Sie zum SDS und zur CMS Library in Figma (Zugang nur für Mitarbeiter/Partner).
Zur CMS Library
Zum SDS in Figma
Hier gelangen Sie zur Übersicht aller CMS-Komponenten in Storybook.
Zum CMS Storybook
Zum SDS Storybook
Hier gelangen Sie zum CMS Magnolia, in dem Sie die Komponenten redaktionell verwenden können.
Zu Magnolia
Nächstes Kapitel Solid Design System
.png)
.png)
