Alle Leistungen › Illustration und Icondesign

Illustrationen & Icondesigns für E-Commerce, Apps & mehr

Identitäts­stiftende Symbole und Illustrationen, die schnell kommunizieren.

Unverbindliches Angebot anfordern

Unsere Leistungen als Agentur für Illustration und Icondesign:

  • Iconsprache
  • Icondesign
  • SVG-Animation
  • Iconstyleguide
  • Illustration
  • Infografiken
  • Animierte Illustrationen
  • Erklärfilme

Warum Icons und Illustrationen?

Icons und Illustrationen funktionieren sprachübergreifend, benötigen nur wenig Raum und werden vom Gehirn sehr schnell verarbeitet. Gerade deshalb ist ihr Einsatz in der Interfacegestaltung inzwischen so weit verbreitet.

Warum mit uns?

  • Geschwindigkeit – aufgrund unserer Erfahrung liefern wir exzellente Ergebnisse in Bestzeit ab
  • Produktqualität – wir bringen komplexe Zusammenhänge visuell auf den Punkt und schaffen es, auch abstrakten Symbolen einen emotionalen Mehrwert zu verleihen
  • Kosteneffizienz – durch unsere schlanken Strukturen kommen wir ohne den üblichen Agentur-Overhead aus

Wir sind Spezialisten für …

  • klar verständliche Flat-Icons für E-Commerce
  • animierte SVG-Grafiken für nutzerzentrierte Interfaces und Apps
  • anschauliche Infografiken, die auch komplexe Zusammenhänge verständlich darstellen
  • visuelles Storytelling mit Hilfe von Icons oder Illustrationen

Web-Illustration:

Spezifische Web-Illustrationen zeichnen sich durch einen reduzierten Gestaltungsstil aus, der meist auf realistische Darstellungen von Figuren, Perspektive oder Schatten verzichtet. Diese Art der Illustration eignet sich besonders für den Einsatz auf Webseiten oder Apps. SVG ist ein gängiges Format zur Einbindung zweidimensionaler Grafiken. Kurze Ladezeiten und eine gestochen scharfe Darstellung in allen Abbildungsgrößen sind die Vorteile.
Für das Schweizerische Rote Kreuz entwarfen wir minimalistische Web-Illustrationen im Flat Design. Vektorgrafiken eignen sich besonders gut für Webanimationen, die wie hier gezeigt, im Lottie-Format realisiert sind. Das gesamte Projekt wird hier vorgestellt.

Icondesign im E-Commerce:

Hochperformante Online-Shops stellen besondere Anforderungen an das Icondesign: Klar verständliche Icons sorgen für einen schnellen und reibungslosen Interaktionsprozess. Eine konsistente Formsprache, über den gesamten Shops hinweg, schafft Vertrauen.

Taschenherz
UX-Iconsystem für den Online-Shop von Taschenherz. Das Set ist auf gute Lesbarkeit auch in kleinen Darstellungsgrößen und konsistente Erweiterbarkeit ausgelegt.

Bombay
Navigations-Icons für Bombay, einem Anbieter antiker Möbel und Heimdekorationen. Der opulente Icon-Stil ist passend auf die angebotene Produktwelt abgestimmt.

Shopicons
Vollständiges E-Commerce-Iconset mit mehr als 100 Symbolen zur freien Verwendung von H2D2. Zum kostenlosen Download geht es hier: Shopicons Landingpage in neuem Fenster öffnen

H2D2_Shopicons-E-Commerce-Icons

Divino
Iconset für einen Online-Shop für Weine. Die Icons symbolisieren die Charakteristiken der einzelnen Weine und sind für den Einsatz auf den Produktseiten des Shops optimiert.

Maritimer Modeshop
Umfangreiches Iconset für einen Onlineshop-Anbieter maritimer Mode. Die Icons sind für eine schnelle Orientierung im Rahmen der Navigation und des Mein Konto-Bereichs optimiert. Zusätzlich haben wir spezielle Icons für Contentseiten und Gewinnspiele gestaltet.

Icons & Animation
Animierte Icons sinnvoll eingesetzt, helfen Benutzerinteraktionen verständlich zu kommunizieren und die Nutzererfahrung zu verbessern. Technisch setzen wir z. B. animierte Icons mit Hilfe des vektorbasierten SVG-Formates um. Die SVG-Animation wird dann bei einer bestimmten Benutzerinteraktion ausgelöst, z.B. wenn ein Artikel in den Warenkorb gelegt, ein Like-Button getappt oder eine Formularanfrage abgeschickt wurde. Mehr zu Animationstechniken für Webseiten und Apps findet sich in unserem Blog-Artikel „Animationstechniken im Vergleich“.

Icons im Infografikdesign:

Mit Hilfe von Infografiken werden aus bloßen Zahlen anschauliche Darstellungen. Speziell gestalteten Icons und Diagrammen kommt dabei eine zentrale Rolle zu. Sie sorgen dafür, das die Inhalte leichter zugänglich werden und sich besser einordnen und vergleichen lassen.

bonprix
Iconset für die visuelle Aufbereitung von Marktforschungsdaten. Alle Icons sind auf das Corporate Design der Marke abgestimmt und durch ein zugrunde liegendes Rastersystem konsistent gestaltet.

Icons in der multikulturellen Kommunikation:

Icons überwinden Sprachbarrieren. Deshalb werden die kleinen Symbole überall dort eingesetzt, wo auf kleinem Raum sprachübergreifend kommuniziert werden soll. Verkehrsschilder und Leitsysteme für Flughäfen oder Bahnhöfe wären ohne den Einsatz von abstrakten Bildzeichen nicht denkbar. Aber auch für die Nutzerführung auf Webseiten dienen Icons als prägnante Stellvertreter für Funktionen wie Warenkorb, Startseite, Mein Konto und Co. Aber Icons können noch mehr, wie das folgende Beispiel zeigt.

Sprachtrainer für Flüchtlinge
Icons sind nicht nur hilfreich in der multikulturellen Kommunikation, sondern können sogar beim Erlernen einer neuen Sprache helfen. Unser Iconkonzept für einen Persisch/Deutsch-Sprachtrainer zeigt, wie so etwas aussehen kann.

Icons für Sprachtrainer zur Integration von Flüchtlingen
Icons für Sprachtrainer zur Integration von Flüchtlingen
Icons für Sprachtrainer zur Integration von Flüchtlingen
Icons für Sprachtrainer zur Integration von Flüchtlingen
Icons für Sprachtrainer zur Integration von Flüchtlingen
Icons für Sprachtrainer zur Integration von Flüchtlingen

Illustrationen:

Im Vergleich zu Icons können Illustrationen farbiger und naturalistischer gestaltet werden – also einfach illustrativer. So können mit ihrer Hilfe auch komplexe Botschaften und Geschichten erzählt werden, die die Möglicheiten von abstrakten Icons sprengen würden.

116117
Illustrationen für verschiedene digitale Services der Kassenärztlichen Bundesvereinigung (KBV). Wie z. B. die folgenden Illustrationen, die wir für den Patientenservice „116117“ gestalteten.

Passende ärztliche Versorgung finden
Bereitschaftspraxen finden für dringende Fälle
Terminbuchung mit Vermittlungscode beim Facharzt oder Therapeuten
Praxis merken

Grafik, die im Kontext für Suchfunktionen gestaltet wurde:

116117 Suchgrafik

Animierte SVG-Illustration, die für Wartungshinweise eingesetzt wird.

Illustration Wartungsarbeiten – animiert

Große Hero-Illustration:

Hero Illustration 116117

Botspotter
Illustrationen für die Website botspotter.de. Botspotter ist eine Software für Online-Händler, die ihren digitalen Marktplatz vor Online-Betrug schützen möchten.

Mit der Lupe wird ein Bot erkannt und als böse identifiziert
Der Botspotter ist für den Online-Handel optimiert und macht den Shop nicht langsamer.
Der Botspotter ist DSGVO konform, Daten verlassen das Netzwerk nicht.
Visualisierung der einzelnen Sessions, die in Echtzeit bewertet werden. Basierend auf dem Fraud Score werden Maßnahmen empfohlen und übersichtlich dargestellt.

Commerzbank
Entwicklung eines Maskottchens für den Bereich Betriebssport der COMMERZBANK AG aus Frankfurt/Main. Der Sympathieträger wurde inzwischen zur Kultfigur im Unternehmen und sorgt bereits seit Jahren für viel Aufmerksamkeit und Sympathie für die Sportgemeinschaft.

E-Sports Frankie für die Betriebsportgemeinschaft Commerzbank
Yoga Frankie für die Betriebsportgemeinschaft Commerzbank
Betriebssportgruppe Commerzbank – alle Sportarten-Frankies

H2D2
Schaurig schöne Animation für h2d2.de. Das H2D2 Logo zeigt an Halloween sein wahres Gesicht und verwandelt sich von einem unheimlichen Monster ins Nächste.

GÖRTZ
Vollständige illustrative Welten erweckten wir für unseren Kunden GÖRTZ zum Leben, um aktuelle Schuhtrends emotional in Szene zu setzen. Dazu illustrierten wir ca. einminütige Animationsfilme, um sympathische Kaufanreize für Trendthemen wie „Maritimes Flair“, „Rock ’n’ Roll“ oder „Ethno Looks“ zu setzen.

Illustration für einen Animationsfilm zu einem Modetrend des Kunden Görtz
Illustration für einen Animationsfilm zu einem Modetrend des Kunden Görtz

bonprix
Für den BH-Berater unseres Kunden bonprix haben wir Illustrationen entwickelt, die Aufschluß über die Eigenschaften der Artikel geben sollen und die Kundin unterstützend im Beratungsprozess begleiten.

Illustrationen für den BH-Berater unseres Kunden bonprix

sheego
Illustrationen für das Online-Magazin von sheego, das sich rund um die Themen Mode, Trends, Styling und Lifestyle dreht.

Illustrationen für das Online-Magazin von sheego

markusremscheid.com
Illustrationen für den Online-Blog von Markus Remscheid, der Fotostories präsentiert, die sich den Themen Reisen und Radfahren widmen.

Radfahrer auf Vulkan der Kanarischen Inseln

Wimmelposter „Viktoria-Park“
Illustrationen für ein Wimmelposter dass einen Park in der Nähe des H2D2-Büros zum Thema hat.

H2D2 Wimmelbild-Poster „Viktoria Park“
H2D2 Wimmelbild-Poster „Viktoria Park“ – Detail
H2D2 Wimmelbild-Poster „Viktoria Park“ – Detail

Das könnte Sie auch interessieren:

Sie möchten mehr erfahren?

So funktioniert der Ablauf von Ihrer Anfrage bis zum Projektstart:

Wir beraten Sie gern. Vertrauen Sie auf unsere Expertise und sprechen Sie uns an.