Eine Sammlung von herrlichen illustrierten Websites
Illustrierte Ergänzungen zu Webseiten können selbst dem einfachsten Thema ein zusätzliches Maß an visueller Bedeutung und Komplexität verleihen.
Die Abbildungen sind von Ort zu Ort sehr unterschiedlich. Manche sehen von Hand gezeichnet aus (ob sie es sind oder nicht), während andere offensichtlich digital gerendert werden.
Im Folgenden finden Sie mehr als dreißig tolle Website-Designs mit Illustrationen.
Am häufigsten sind Illustrationen in Kopfzeilen und Hintergründen, häufig von Site-Maskottchen oder Charakteren.
Aber Illustrationen werden auch auf andere Arten verwendet. Wenn Sie eine illustrierte Lieblingsseite haben, die hier nicht erwähnt wird, teilen Sie uns dies bitte in den Kommentaren mit.
Websites mit digitalen Illustrationen
Diese Seiten haben Illustrationen, die offensichtlich digital sind. Glatte Linien und helle Farben sind Kennzeichen dieses Stils, obwohl nicht alles, was unten aufgeführt ist, diesen Standards entspricht.
F5
Die F5-Website verwendet eine skurrile digitale Illustration für ihren Hintergrund. Die hellen Farben und cartoonartigen Zeichen sind typisch für digitale Illustrationen. Was hier nicht sichtbar ist, ist, dass die Illustration auf der Seite weitergeht und verschiedene Ebenen sichtbar macht.
Drahtmodell Plus
Wireframe Plus verwendet eine einfarbige Hintergrundillustration für ihre Site. Es ist subtil, aber fügt wirklich etwas zusätzlichen visuellen oomph hinzu und lässt die Seite hervorstechen, obwohl das Farbschema und die Typografie ziemlich Standard sind.
Tom Bradshaw Design
Tom Bradshaw Design verwendet auf der gesamten Website Illustrationen in typografischer Form sowie ein Zeichentrickfigur-Maskottchen, das auf jedem Abschnitt der Seite erscheint (es handelt sich um eine einseitige Website).
Mittelschwer
Glänzende digitale Illustrationen wie diese werden nicht oft gesehen und heben sich von anderen Seiten ab. Dieser hebt sich noch mehr ab, da er vor einem schwarzen Hintergrund positioniert ist und die einzigen hellen Farben auf der Seite verwendet.
htmlMafia
Die Illustrationen hier sind eine Art Mischung zwischen digitalen und handgezeichneten Stilen, obwohl die verwendeten Farbverläufe sie stärker in die digitale Kategorie einordnen. Dies ist ein großartiges Beispiel dafür, wie Illustrationen eine Website beleben und einen dramatischen Eindruck hinterlassen.
CreativeSwitch
Der hier abgebildete Roboter ist auf der Website selbst, wenn auch subtil, animiert. Zusätzliche Illustrationen werden auf der gesamten Website verwendet.
690 Design
Bilder in die Kopie einer Website zu binden ist eine fantastische Strategie. Hier diskutiert der Tagline-Text die Harmonie und ein Orchesterleiter wird für die Illustration verwendet.
Kipu
Einfache Illustrationen im Vektor-Stil wirken sehr mutig. Durch die Verwendung einer mehr gedämpften Farbpalette, wie oben beschrieben, können sie sich nahtlos in den Rest der Website einfügen.
Siringa 1
Diese Zeichen sind ein weiteres Beispiel für digitale Illustrationen, die ein von Hand gezeichnetes Gefühl haben. In Kombination mit dem Farbschema verleihen diese Illustrationen der Website ein entspanntes, freundliches Gefühl.
Pixelbäcker
In dieser Vektor-Illustration ist viel los, von den Jungs, die im unterirdischen Loch arbeiten bis zum Vogel im Baum. Stilistisch ist es eine ziemlich typische vektorabbildung, obwohl die Ausführung wundervoll ist.
Pieoniere
Das Verwenden von Illustrationen, um über Vorteile zu sprechen oder andere Informationen anzubieten, ohne sie zu einer Info-Grafik zu machen, ist eine großartige Strategie. Es ist eine unterhaltsame und interessante Art, Informationen zu vermitteln, die Ihre Besucher eher ansprechen. Plus, die Kombination aus einem Kuchen und einer fliegenden Untertasse hier ist einfach hervorragend!
Jacob Lee
Der hier abgebildete Pinguin sieht fast wie von Hand gezeichnet aus, ist aber etwas zu poliert und glatt. Die starke weiße Färbung (oder das Fehlen davon) hebt sich wirklich vom bunten Hintergrund ab.
Baumhaus-Bearbeitung
Der dargestellte Hintergrund ändert sich von Seite zu Seite und bietet subtile Animationen. Aber es ist ein wunderschönes Kunstwerk, das einen zweiten Blick verdient.
Code Crunchers
Die häufigsten digitalen Illustrationen sind einfache Charaktere oder Monster wie dieses. Und als Maskottchen funktioniert es perfekt mit dem Namen der Website.
Fürst
Illustrierte Hintergründe wie dieser werden immer häufiger. Die vollständige Integration zwischen dem Inhalt und dem Hintergrund macht das Besondere aus.
Coo / Coo Kern
Mehr abstrakte Illustrationen wie diese geben einer Seite ein moderneres Gefühl. Dieser ist einfach abstrakt genug, um noch als Baum erkennbar zu sein.
Joystick-Generäle
Die Wiederholung des Grundcharakters im Hintergrund des Headers fügt eine zusätzliche Ebene von visuellem Interesse zu einer relativ einfachen Illustration hinzu. Das Farbschema, das hier verwendet wird, ist einfach, aber wenn es mit dem grungy Hintergrund kombiniert wird, sieht fantastisch aus.
Mach Filmarbeit
Illustrationen werden weniger oft auf Grunge-Sites gesehen, wahrscheinlich weil sie Gefahr laufen, visuelle Unordnung zu erzeugen. Aber die einfache Illustration hier, mit ihrem gedämpften Farbschema und ihrer subtilen Textur, funktioniert hervorragend in einem minimalistischen Grunge-Design.
Die festen Studios
Ein weiteres großartiges Beispiel für einfache digitale Monster in einem Design. Diese Jungs sind lässig und lustig, und machen die Webseite gleich.
Olive Crush
Kopfzeilen sind einer der narrensichersten Bereiche, um Illustrationen zu verwenden. Durch die kreative Verwendung von Schlagschatten sieht diese Kopfzeile fast wie 3D aus.
Sara Tusar
Ein weiteres großartiges Beispiel für Monster, diesmal in einem Header-Design. Sie sind subtil, hallende Farben vom Rest der Website, aber verleihen eine persönlichere Note.
Arbel-Designs
Die Arbel-Designs Website verwendet einen mehrschichtigen illustrierten Hintergrund, der im Raum oben auf der Seite beginnt und tief unter Wasser geht. Dieser illustrierte Hintergrund funktioniert hervorragend auf Einzelseiten.
Geistende Monster
Dies sind einige der einfachsten Vektorzeichen in diesem Beitrag. Sie sind jedoch sehr süß und vollständig in das Design der Website integriert. In der Tat, sie sind der springende Punkt der Website.
Websites mit handgezeichneten Illustrationen
Handgezeichnete Illustrationen sind im Webdesign weniger verbreitet, aber es gibt immer noch einige fantastische Beispiele. Sie reichen von schönen Zeichnungen bis zu Doodles und allem dazwischen.
Steve Schöger
Einfache Skizzen wie diese funktionieren hervorragend für jede Seite, besonders dann, wenn sie ein typisches Designerfoto (oder ein professionelles Foto) ersetzen. Sie sind auch eine gute Alternative für diejenigen, die Kamera-schüchtern sind! Lassen Sie die Hintergrundtextur durch, um einen Hautton zu geben, ist eine nette Note.
Kenny Meyers
Eine Illustration eines Superhelden auf einer ansonsten relativ kleinen Site kann dazu beitragen, das Vertrauen in Ihre Besucher zu stärken, ohne auf ein "Corporate" -artiges Design der Website zurückgreifen zu müssen. Die Farbwiedergabe von anderen Stellen auf der Website stellt sicher, dass die Illustration nahtlos ineinander übergeht.
Andy Ward
Für einen Illustrator ist es nur sinnvoll, Illustrationen auf seiner Website einzufügen. Andy Ward verwendet eine Diashow seiner Illustrationen in seinem Header, aber sie sind so integriert, dass sie Teil des Designs werden.
Kilian Muster
Eine formellere Linienzeichnung in Fine-Art-Stil wie diese hier bietet eine Anspielung auf die Tradition; in diesem Fall: traditionelle Satzmethoden. Es ist einfach, aber mutig genug, um wirklich etwas zu bewirken.
DNA zu Darwin
Ein weiteres großartiges Beispiel für eine Site, die formale Strichzeichnungen verwendet, um ein Gefühl für Geschichte zu schaffen. Die geschichteten Illustrationen machen es umso interessanter.
Krawatte
Eine lässigere handgezeichnete Seite, komplett mit handgezeichneten Monstern (oder ist das ein Alien?). Die Website verwendet eine mehrschichtige Hintergrundillustration, die im Weltraum beginnt und im Meer endet.
xhtmlCafe
Eine handgezeichnete Illustration in Kombination mit Wasserfarben erstellt einen fantastischen und informativen Header auf der xhtmlCafe-Site. Die skizzierten Elemente innerhalb des Gemäldes geben ihm ein stilisierteres Gefühl, als ein gerades Aquarell haben würde.
Angriff des Webs
Was wäre ein Beitrag auf illustrierten Websites ohne ein Beispiel für Illustrationen im Comic-Stil? Von der Linienstärke bis zur strukturierten Farbgebung erinnert alles an Ihren Lieblingscomic oder Grafikroman.
Janko bei Warp Speed
Eine einfache Illustration in der Kopfzeile ist subtil und unaufdringlich, aber fügt dem Design der Website eine große ästhetische Anziehungskraft hinzu.
Geschrieben exklusiv für WDD von Cameron Chapman .
Wenn Sie andere illustrierte Lieblings-Websites haben, teilen Sie sie bitte in den Kommentaren!