Illustrieren des Webs: Dekonstruieren des Trends
Illustrationen übernehmen das Web. Designer erstellen Websites, die von Vollbild-Illustrationen bis hin zu handgezeichneten Divernen reichen, die in Projekten verwendet werden. Es ist ein Trend, der wahrscheinlich weiter wachsen wird, weil Illustrationen dazu beitragen, dass sich ein Design anpasst (auch wenn dies nicht der Fall ist).
Hier erfahren Sie, wie Sie das Beste aus Ihrem Design machen können.
Webseitenabbildung 101
Illustrationen sind eine vielseitige und unterhaltsame Möglichkeit, ein benutzerdefiniertes Website-Design zu erstellen. Von handgezeichneten Bildern über Elemente bis hin zu Schriftzügen, alles über ein voll dargestelltes oder skizziertes Bild, sieht und fühlt sich einzigartig an. Das ist einer der Gründe, warum es so beliebt ist.
Aber es gibt viele andere Gründe, warum Designer auf den Illustrationstrend setzen:
- Illustrationen ermöglichen es den Benutzern, sich in der Szene, die Sie einstellen, vorzustellen, weil sie sich nicht auf tatsächliche andere Menschen konzentriert.
- Es gibt ein Element von Laune, das nur mit einer Zeichnung erreicht werden kann.
- Illustrationen können Realität und Fantasie für ein außergewöhnliches Design miteinander verbinden.
- Anpassung ist einfach, wenn Sie die Kunstelemente zeichnen.
- Illustrationen sind oft sehr farbenfroh und können Ihnen helfen, den großen, hellen Farbtrend zu nutzen.
- Die Technik ist auch dann nutzbar, wenn Sie kein Illustrator sind, dank Design-Kits oder Packs, die voller illustrierter Teile sind, die im gesamten Projekt verwendet werden können.
- Illustrationen können viele verschiedene Stimmungen oder Stile annehmen, von Skizzen über aufwändige Zeichnungen bis hin zu computergenerierten Grafiken.
Heldenhafte Illustrationen
Da Heldenköpfe groß sind, ist dies einer der einfachsten Orte, um den Illustrationstrend zu sehen. Es wird auch für eine große Anzahl von Websites verwendet, von Portfolios über den Einzelhandel bis hin zu App-Vorschauseiten.
Das Schöne an einem illustrierten Heldenbild ist, dass genug Platz für ein ziemlich komplexes Kunstwerk ist. Kleine Details, Schattierungen, Farben und Interaktionen bieten Raum zum Atmen, sodass die Benutzer die einzelnen Elemente leichter erkunden können.
Es gibt ein paar Tricks zu diesem Komplex, die veranschaulichen:
- Das Kunstwerk muss gut sein. Benutzer werden keine Zeit damit verbringen, sich eine Illustration anzusehen, die sie nicht bekommen oder die nur ein schlampiges Durcheinander ist. Nehmen Sie sich Zeit und kümmern Sie sich darum.
- Während die Darstellung Komplexität aufweisen kann, sollte die Gesamtnachricht einfach sein. Wissen Sie, was das Bild sagen soll und stellen Sie sicher, dass die Elemente zur Botschaft beitragen.
- Arbeite mit einem Profi. Nur weil Sie Herzen auf eine Serviette zeichnen können, bedeutet das nicht, dass Sie bereit sind, eine vollständige Website-Illustration zu zeichnen. Dieser Prozess braucht Zeit und Planung, um wirklich zu funktionieren. (Und es kann teuer sein, also stellen Sie sicher, dass dies die richtige Ästhetik ist, bevor Sie eintauchen.)
Fügen Sie einfache Animationen hinzu
Während eine statische Zeichnung viele Auswirkungen haben kann, lebt das Web heutzutage von Bewegung. Kombinieren Sie eine Illustration mit subtilen Animationen oder Scroll-Effekten, um die Nutzer zum Klicken zu animieren.
Kleine subtile Bewegungen, wie der sich drehende Text in der Website für Der Hugo , hilft, den Blick ins Design zu lenken. Kleine Animationen können Benutzern auch dabei helfen zu verstehen, welche Aktionen beim Besuch einer Website ausgeführt werden müssen. Dies kann insbesondere für Illustrationen gelten, die viele Elemente enthalten oder insgesamt "beschäftigt" sind.
Diese kleinen Überraschungen können die Besucher dazu anregen, sich zu verweilen und sich umzusehen. Hover-Animationen sind ein besonders schöner Bonus für Benutzer, die sowohl als Spaßelement als auch als Navigationswerkzeug dienen können.
Illustrierte Symbole oder UI-Elemente
Wenn ein vollständig illustriertes Website-Design nicht Ihr Ding ist, betrachten Sie ein paar illustrierte Symbole oder Elemente der Benutzeroberfläche. Dies ist eine einfache Möglichkeit, um in den Trend zu erleichtern. (Und es gibt viele Icon- und UI-Kits, die illustrierte Stile für den Einstieg bieten.)
Illustrierte Elemente können einer Seite, die sich sonst zu förmlich anfühlen könnte, einen Hauch von Laune verleihen. Etwas zu versuchen ist ein illustriertes Umriss-Symbol. Dieser Stil lässt sich in fast jedem Design einfügen, eignet sich hervorragend für Bilder und jedes Farbschema und bietet ein konsistentes visuelles Thema von Seite zu Seite.
Wenn Sie über die Icons hinausgehen wollen, denken Sie an übergroße UI-Elemente. Iqor , verwendet illustrierte Schaltflächen in größeren Größen, um Benutzer zu führen und die Seite ein wenig lustiger zu machen. Der illustrierte Stil fließt von Seite zu Seite, wobei große Elemente die gleichen drei Farbpopulationen verwenden. Das Ergebnis ist unterhaltsam und konsistent und nur ein bisschen unerwartet vom Kundenbetreuungsgeschäft.
Handgezeichnete Schriftzug
Ein weiterer großer Trend beim Website-Design ist die benutzerdefinierte Typografie. Kombinieren Sie die Konzepte von Illustration und Schriftzug für ein handgemaltes Logo, einen Haupttextblock oder ein typografisches Kunstelement. Diese textbasierte visuelle Darstellung kann große Auswirkungen haben (insbesondere wenn sie überdimensioniert ist oder als Hauptelement für das Design verwendet wird).
Der Trick hier ist die Moderation. Bei dem handgezeichneten Beschriftungsstil sollten Sie für diesen Effekt an einem einzelnen Textblock oder Textelement festhalten. Die mehrfache Verwendung eines benutzerdefinierten Textblocks kann für die Benutzer überwältigend sein und die Lesbarkeit beeinträchtigen. Es ist wichtig sicherzustellen, dass die Wörter immer noch klar sind und dass die Benutzer keine Probleme haben, die Nachricht zu verstehen.
Beide Tag der Toten und Stand auf Krebs machen Sie einen guten Job mit Handbeschriftung für eine einfache Nachricht. Day of the Dead verwendet andere Illustrationen, einfache Sans Serif Typography und Fotos, um Benutzer durch den Rest der Website zu ziehen. Das Endergebnis ist lustig und einfach zu folgen. Stand up to Cancer verwendet eher einen Aquarellstil, der auf Illustration basiert, aber zur Lesbarkeit auf mehr Standardschriften setzt. Beides sind gute Optionen für die Arbeit mit benutzerdefinierten Buchstaben.
Fazit
Auch wenn der Einstieg in die Welt der Illustration für Website-Design-Projekte zunächst etwas einschüchternd erscheinen mag, ist dies etwas, was viele Designer tun können. Von der Handzeichnung über die Computerunterstützung bis hin zum Arbeiten mit einem Kit sind die Möglichkeiten grenzenlos.
Es ist etwas, worüber man nachdenken muss, wenn es um Projekte geht, die etwas anderes verlangen. Und es ist trendy genug, dass Sie gefragt werden könnten, etwas in diesem Stil zu erstellen. Dies ist also eine gute Zeit, um Ihre Sketching-Fähigkeiten aufzufrischen und darüber nachzudenken, wie ein illustrierter Website-Design-Rahmen für Sie arbeiten könnte.