Visual Design — Mood Boards, Mockups, Icons, Logo, Layouts und Animationen | moweex Softwareentwicklung Agentur - we create digital experiences moweex Softwareentwicklung Agentur

Was versteht man unter Visual Design?

Visual Design ist die Kunst des visuellen Gestaltens. Dabei geht es darum, mit Hilfe von Grafiken, Bildern und anderen Elementen eine bestimmte Botschaft zu vermitteln oder einen bestimmten Effekt zu erzielen. Oft wird Visual Design auch als Teilbereich des Kommunikationsdesign bezeichnet.

Was ist nun der Unterschied zwischen Visual Design und User Interface (UI)Design?

User Interface Design und Visual Design sind zwei völlig unterschiedliche Bereiche des Designs. User Interface Design konzentriert sich auf die Funktionalität der Oberfläche eines Produktes und stellt sicher, dass der Nutzer effektiv mit dem Produkt interagieren kann. Dazu gehören die Erstellung von Bedienoberflächen, Menüs, Icons und anderen grafischen Elementen. Visual Design hingegen konzentriert sich auf das Aussehen und die Gestaltung der Oberfläche eines Produktes. Es geht darum, die Informationen auf eine ansprechende und verständliche Weise zu präsentieren. Bei moweex arbeiten unsere Visual Designer und User Interface Designer sehr eng zusammen, und stellen damit sicher, dass die endgültige Benutzeroberfläche sowohl funktional als auch optisch ansprechend ist.

Was sind die Aufgaben unserer Visual Designer?

Als Visual Designer muss man sich mit den unterschiedlichsten Facetten des Designs auskennen. Dies beinhaltet das Erstellen von Mood Boards, Wireframes, Mockups, Layouts, das Gestalten von Icons und Buttons und die Animation von Inhalten. Weiters auch das Erstellen von interaktiven Prototypen und sogenannten Click-Dummies. Dabei ist es wichtig, nicht nur an das Aussehen der Oberfläche zu denken, sondern auch an die Funktionalität und Ihre Nutzer.

Mit Hilfe unserer UX-Designer werden Ihre Produkte einfach perfekt.

UX-Design ist die perfekte Lösung für Sie, wenn Sie einfach und intuitiv bedienbare Produkte möchten. UX-Konzepte sorgen für eine optimale Benutzerführung und ein ansprechendes Design.

Mood Board

Der anerkannte englische Begriff Mood-Board lässt sich ins Deutsche mit „Stimmungstafel“ übersetzen. So gesehen ist es eine Collage aus Bildern oder Illustrationen, die zur visuellen Beschreibung dienen und die gewünschte Stimmungen oder Werte wiedergeben soll.

Ein Moodboard ist ein wichtiges Präsentations- und Arbeitsmittel, das in der Design- und Kommunikationsbranche stark vertreten ist. Es hilft dabei, sich einen ersten Eindruck über die Sprache, die Anmutung oder die Tonalität zu verschaffen und ermöglicht mitunter dem Designer schon beim Anfertigen einen ersten Blick, welche Elemente miteinander harmonieren könnten und welche nicht.

Einsatzmöglichkeiten

Das Moodboard ist auch ein Teil der Recherche und wird somit relativ am Anfang eines Projektes erstellt, weil es den Konsens über die Atmosphäre eines Designs definiert. Ein Mood-Board findet unter anderem in folgenden Bereichen Anwendung:

Webdesign: dient zur Darstellung vom „Look-and-Feel“ der Webseite. Farben, Seiteninhalte und Navigationsmittel können so definiert werden.
User-Interface-Design: Zur Herausstellung der Elemente des User-Interfaces, zur Erklärung der Zusammenhänge mehrerer Elemente sowie zur Visualisierung neuer Ideen
Grafikdesign: Um eine Fotostilistik zu entwerfen, um beispielsweise den Geschäftsbericht zu erstellen
Werbung und Marketing: Als visuelle Definition der Zielgruppe einer Kampagne mithilfe von Alltagskultur und Porträts

Mockups

Ein Mockup ist ein digitaler Entwurf einer Webseite oder App. Mockups erstellt man im Rahmen des Webdesigns und sie dienen der Visualisierung von Konzepten und Ideen. Mockups beinhalten bereits alle Elemente einer Webseite und sind zumeist statisch, das heißt ohne jegliche Funktionalität. Jedoch gibt es mittlerweile moderne Mockup-Tools, die eine gewisse Dynamik ermöglichen, wie zum Beispiel einfache Verlinkungen von Bedienelementen. Somit besteht ein fließender Verlauf von Mockups zu Prototypen. Navigation, Grundfunktionen, Inhaltsarchitektur und Design werden anhand von Mockups mit dem Kunden abgestimmt, wodurch auch eine endgültige Auftragsvergabe entschieden werden kann. Außerdem werden Mockups für Usability Tests herangezogen und dadurch können mögliche Probleme frühzeitig erkannt werden, bevor ein großer Programmieraufwand nötig wäre. Insofern können Mockups somit zu Zeit- und Kostenersparnis innerhalb eines Projektes beitragen.

Icons, Logos und Banner

Icons

Icons sind mittlerweile als Kommunikationsmittel nicht wegzudenken. Ob am Smartphone oder am PC, am Fahrkarten- oder Geldautomaten – man findet sie mittlerweile überall. Icons sind kleine, einfache Bilder oder Piktogramme und ihre Bedeutung sollte möglichst selbsterklärend sein. Icons werden gerne als Buttons verwendet. So wird zum Beispiel gerne ein Haus, um zurück auf die Startseite (engl. Homepage) zu kommen, verwendet oder ein Pfeil, der eine Führungsrichtung vorgibt.

Logos

Logos können aus Symbolen, Bildern, Texten und Farben bestehen und formen damit eine einzigartige Marke. Ein Logo gibt deinem Unternehmen ein Gesicht. Es hilft den Kunden zu verstehen, wer du bist, was du machst und welche Markenwerte du vertrittst. Logos sind ein zentraler Teil einer Markenidentität und können eine starke visuelle Assoziation mit deinem Unternehmen/Marke erzeugen, die dem Kunden dabei behilflich ist, sich an dich zu erinnern.

Banner

Banner sind grafische Werbemittel, die aus Bild- und Textelementen bestehen und als Anzeigen in Webseiten implementiert sind. Sie werden unterschiedlich angezeigt. Zum einen kann man sie in den Inhalt der Webseite integrieren oder am Rand außerhalb des Contents platzieren, zum anderen werden sie auch gerne als Pop-up verwendet. Grundsätzlich sollen Banner den User dazu animieren, draufzuklicken.

Animationen von Inhalten

Animierter Content sind animierte Videos, die aus originelle Design, Zeichnungen, Illustrationen oder Computer-generierten Effekten bestehen und sich auf eine blickfangende Art bewegen. Animationen sind ein unwiderstehlicher Weg, um eine Geschichte zu erzählen oder auch um einem User Content zu verdeutlichen. Die Länge der Animation hängt vom Zweck ab. Promote-Animationen sind meistens kürzer und gehen nicht über eine Länge von wenigen Sekunden. Informative Animationen können durchaus länger als eine Minute dauern.