Illustrationen sind ein schönes Mittel, um Dinge, Situationen, Personen u.v.m. darzustellen. Abstrak, realistisch, minimalstisch, handgezeichnet, digitial… Der Varianz an Stilen, Formen und Farben sind keine Grenzen gesetzt.
Illustrationen sind vor allem dann sehr praktisch, wenn ein Foto die Situation nicht widerspiegeln kann bzw. gerade nicht die Mittel zur Verfügung stehen eine entsprechende Szenerie zu shooten.
Leider mangelt es manchmal aber an beispielsweise Zeit, Skills oder Budget, um diese Illustrationen anfertigen zu lassen.
Daher möchte ich dir mit diesem Beitrag drei frei verfügbare Illustrationstools zeigen, die ich gerne nutze.
Frei verfügbar bedeutet gratis, aber nicht umsonst. Und zwar für private und kommerzielle Zwecke. Cool oder?
Dann starte ich mal direkt mit der ersten Website.
opendoodles.com
Mit dieser Website bietet Pablo Stanley sehr dynamische und fröhliche Illustrationen an. Hier stehen die Figuren mit ihren Bewegungen bzw. Handlungen im Vordergrund.
Wie funktioniert opendoodles.com?
Öffnet man die Website, kannst du sofort durch die Illustrationen browsen. Unter dem Reiter „Compositions“ gibt es fertige Kompositionen mit farbigen Hintergründen und grafischen Elementen. Dabei ist alles eher minimalistisch gehalten.
Unter „Generator“ kannst du die Farben anpassen. Dabei kannst du zwischen Farbvorschlägen, einem Farbregler und der Option einen HEX Code einzugeben, wählen. Alles etwas versteckt aber man findet es.
Wenn du dich für eine passende Illustration entschieden hast, kannst du diese entweder als SVG oder PNG herunterladen. Dafür einfach auf den entsprechenden Button klicken. Das Bild öffnet sich und mit einem Rechtsklick aufs Bild „speichern unter“ anklicken. Ein sehr cooles Feature ist, dass manche Illustrationen eine kleine Bewegungsanimation enthalten. Diese kannst du zusätzlich als GIF herunterladen. Alles recht easy und leicht verständlich, man muss nur wissen, wo man klicken muss.
SVG, PNG und HEX CRASHKURS
SVG (Scalable Vector Graphics= eine skalierbare Vektorgrafik, ohne Qualitätsverlust, in entsprechenden Programmen wie Adobe Illustrator ist die Bearbeitung möglich.
PNG (Portable Network Graphics) = Rastergrafikformate, also eine Bildatei, Transparenter HIntergrund im Vergleich zu JPG möglich
HEX (Hexadezimal-Code) = Farbwerte im RGB-Farbraum. Pro Farbwert werden zwei Ziffern der drei Grundfarben Rot, Grün und Blau angegeben.
Vorteile von opendoodles.com
- dynamische, lebendige Illustrationen
- online individualisierbar
- GIFs verfügbar
Nachteile von opendoodles.com
- Festgelegt auf Anordnung und Formen, wenn du keine Möglichkeit hat, die SVG-Datei zu bearbeiten
- die Hintergründe der Kompositionen sind eher grafisch als thematisch konzipiert
- Website ist nicht intuitiv
unDraw.co
unDraw ist die zweite Website, die ich dirvorstellen möchte. Katerina Limpitsouni bietet mit dieser Seite Open Source Illustrationen in einer großen Vielfalt. Und es gibt immer wieder neue Updates. Das Prinzip ist ähnlich wie bei opendoodles.
Wie funktioniert unDraw?
Du kannst entweder einfach durch alle Illustrationen durch browsen oder nach Suchbegriffen filtern. Die Illustrationen haben auch hier immer einen Farbakzent, den du nach Belieben auf der Website anpassen kannst.
Auch hier kannst du zwischen Farbvorschlägen, einem Farbregler und der Option einen HEX Code einzugeben, wählen. Auf dieser Seite ist das aber wesentlich intuitiver gestaltet und mit nur einem Klick erreichbar.
Die gewünschte Illustration kannst du dann auch hier als SVG und PNG herunterladen.
Vorteile von unDraw
- Selbsterklärende Anwendung
- direkt einsteigen
- online individualisierbar
- Download als SVG oder PNG
- große Vielfalt an Illustrationen
Nachteile von UnDraw
- Festgelegt auf Anordnung und Formen, wenn du keine Möglichkeit hat, die SVG anschließend zu beabeiten
- schwere Entscheidung bei so vielen Möglichkeiten
humaaans.com
Die dritte Website, die ich dir vorstellen möchte, ist ebenfalls von Pablo Stanley. Hiermit hast du die Möglichkeit Illustrationen bis ins letzte Detail zu individualisieren. Unter dem Motto „mix&match“ kannst du Frisuren, Hautfarbe, Gangart, Kleidungsstücke und auch Hijabs, Turbane oder auch einen Rollstuhl austauschen bzw. zum Einsatz bringen.
Auch wenn man bis zur Umsetzung eine kleine Hürde nehmen muss, ist das total cool, denn das macht diese Plattform divers und damit besonders lobenswert.
Wie funktioniert humaaans.com?
Man kann sich die sogenannte Library herunterladen und diese dann in den folgenden Programmen individualisieren, also die verschiedenen Frisuren, Farben, Positionen anwenden.
- Sketch
- Figma
- InVision Studio
- Adobe XD
Und damit hätten wir auch schon die Hürde. Wenn du dich in einem der Programme auskennst oder Basiskenntnisse mit Grafikprogrammen hast, ist das super. Wenn nein, wird es dich etwas Einarbeitungszeit kosten, um mit den Tools zurecht zu kommen. Außerdem ist nicht alles kostenlos.
Ich nutze humaaans in Figma. Hier gibt es eine Free-Version. Als ich mich etwas reingefuchst habe, hat es total Spaß gemacht die verschiedenen Elemente durchzutauschen.
Für die, die kein Bock auf „reinfuchsen“ haben, gibt es die Möglichkeit ein Paket vordefinierter „humaaans“ als PNG und SVG herunterzuladen. Neben verschiedenen Menschen, gibt es auch Einzelelemente, wie Köpfe mit diversen Frisuren, verschiedene Kleidungsstücke, Objekte und Hintergründe. Das sind dann aber alles einzelne Grafiken, die du noch zusammenfügen müsste, wenn du gerne eine Komposition haben möchtest.
Du merkst vielleicht schon… alles in allem sehr viel komplexer, aber dafür bietet „humaaans“ auch direkt sehr viel mehr.
Vorteile von humaaans.com
- Diversität
- hohe Flexibilität
- viele Möglichkeiten
Nachteile von humaaans.com
- weitere Programme/Tools zur Bearbeitung nötig
- sehr komplex
- nicht möglich ohne weiteres Programm fertige Kompositionen von Menschen und Gegenständen herunterzuladen
Zusammenfassung
Alle Tools haben ihre Vor- und Nachteile. Und es gibt darüber hinaus auch noch viele weitere Websites, die Illustrationen anbieten.
Vor allem mit unDraw und opendoodles kommst du schnell zu einem Ergebnis. Die Anwendung ist relativ simpel, wobei unDraw intuitiver aufgebaut ist und mehr Illustrationen bietet. opendoodles hingegen bietet sehr dynamische und auffällige Illustrationen.
humaaans ist zwar etwas schwieriger in der Anpassung mittels der Programme, bietet aber enorm viel Flexibilität und der Charakter der Diversität ist hier besonders hervorzuheben.
Ich hoffe, dass dir dieser Blogbeitrag gefallen hat und du deine Designs, Website, Entwürfe oder was auch immer noch mehr aufwerten kannst.
Wenn du Hilfe bei der Umsetzung brauchst, oder nach jemanden suchst, der dir ein Layout für die Illustrationen gestaltet, dann melde dich gerne hier.
