Bereit, ein Designrisiko einzugehen? Versuchen Sie, Fotos und Illustrationen im selben Designprojekt zu mischen. Ein von Hand gezeichnetes Element kann einem Design, das Fotografie einschließt, Laune und Interesse verleihen. Umgekehrt kann ein Foto ein unbeschwerter illustriertes Design realer oder wichtiger erscheinen lassen.
Diese Technik kann schwer vorstellbar sein, bis Sie einige Beispiele sehen, wie sie wunderbar funktionieren kann. Heute schauen wir uns diesen Trend an und geben Ihnen Tipps und Beispiele, mit denen Sie kreative Wege finden, um ein eigenes Design zu entwickeln.
1. Verwenden Sie Illustrationen als Akzente für die Benutzeroberfläche
Sie könnten illustrierte Elemente jederzeit in das Design integrieren und denken nicht einmal darüber nach. Viele Elemente der Benutzeroberfläche werden häufig auf irgendeine Weise dargestellt. Sie sind nicht unbedingt in diesem handgezeichneten Stil, sondern haben einen weniger taktilen und mehr "Web-Button". aussehen.
Wenn Sie einen von Hand gezeichneten Effekt ausprobieren möchten, sollten Sie diesen Schritt ein wenig höher legen. Oder erwägen Sie, eine Skizze als Akzentzeichen zu verwenden.
WittyCookie verwendet oben eine Mischung aus Illustrationen und einem Video im Heldenstil, um Benutzer in das Design zu bringen. Die Homepage (nicht gezeigt) zeigt eine Illustration. Was schön ist, ist das Element der Laune hier. Handgezeichnete Elemente? aus dem video. Das Ergebnis führt dazu, dass sich die Site weniger wie ein Verkaufsgespräch fühlt, um mit der Agentur zusammenzuarbeiten, und eher, als hätten Sie Spaß miteinander.
Das Konzept ist interessant und nicht überwältigend. Und das Beste daran? Es macht Spaß, visuelles Interesse zu wecken, wenn Sie keinen schönen Katalog mit Bildern oder Videos haben, mit dem Sie arbeiten können.
2. Zuerst veranschaulichen
Wenn eine Illustration bei einem Projekt Ihr erster Instinkt ist, zeichnen Sie zuerst diese Kontur. Skizzieren Sie die dargestellten Teile und sehen Sie, wohin das Design geht, bevor Sie Foto- oder Videoelemente hinzufügen.
Das ist der Weg, den die Made by Few-Konferenz oben genommen hat. Die komplizierten Illustrationen im gesamten Design sind beeindruckend und enthalten ein Detail, das jeder Designer schätzen kann. Direkt unter dem Heldenbild ist ein Loop-Video mit Szenen der Konferenz. Was dieses kleine, aber wirkliche Element tut, zeigt, dass es sich um ein Live-Ereignis handelt. Kombinieren Sie das mit den erstaunlichen Bildern und Sie möchten sich nur registrieren, um zu sehen, worum es geht. Die Konferenzatmosphäre sieht dank des Illustrationsvideo-Paars spaßig und hip aus.
Es gibt einen anderen Weg, wenn Sie darüber nachdenken, mit einer Illustration zu beginnen. Zeichnen Sie ein erstaunliches Hintergrundbild für das Design. Dies ist eine unterhaltsame Methode, um genau das zu erhalten, was Sie in einem Hintergrund wünschen, ohne vorgefertigte Bilder abzusuchen.
Ein Happy Camper (oben) macht dies auf interessante Weise mit einer Mischung aus illustrierten Hintergrundfeldern, einfachen weißen Hintergründen und sogar schwarzen und weißen Fotohintergründen. Die Änderungen im Hintergrund signalisieren effektiv eine Inhaltsänderung und neue Informationen für Benutzer, die dieses Kinderlager erkunden.
3. Verwenden Sie Illustrationen wie Typografie
Wenn Sie nicht mit vielen tollen Bildern zu tun haben, mischen Sie Illustrationen auf dieselbe Weise ein, wie Sie mit der Typografie spielen könnten. Obwohl das Konzept merkwürdig klingt, sollten Sie eine Minute darüber nachdenken: Eine saubere Illustration kann einem Video oder Foto eine Betonung geben. Es kann hervorheben, was die Benutzer wissen sollen.
Achrival tut dies auf eine interessante Art und Weise. Das illustrierte? Tanzen? A dient als Logo der Agentur und lenkt die Aufmerksamkeit auf die kurze Video-Schleife. Ohne sie könnten Sie einfach an den Bildern vorbeikommen, ohne anzuhalten. Aber es ist einfach anders genug, um Sie auf die gleiche Weise anzulocken, wie dies eine kraftvolle Schlagzeile wäre.
4. Betrachten Sie illustrierte Animationen
Egal, ob Illustrationen von Hand oder vom Computer gezeichnet werden, sie bieten eine großartige Möglichkeit, einfache Animationen zu integrieren. Von Navigationswerkzeugen bis zu lustigen Divots, die Benutzer ansprechen, kann eine animierte Illustration informativ, unerwartet und unterhaltsam sein.
Ich möchte nicht mit Animationen über Bord gehen. Halten Sie sie einfach und zielgerichtet. Jede Animation sollte ein Ziel für den Benutzer haben - einen Link, ein Richtungshinweis oder eine Überraschung, die ihn interessiert.
Sie können diese Behandlung nicht von einer Finanzplanungsgruppe erwarten, aber Taylor Made verwendet oben eine Mischung aus illustrierter Animation und Fotografie. Die illustrierten Teile der Bilder, die die Finanzplanung machten, wirken weniger einschüchternd und helfen den Benutzern, durch Klickpfade zu führen.
Die Abbildungen sind auch farbig dargestellt, wenn die Website anderen Bildern nicht gerecht wird und das Endergebnis ein zusammenhängendes Design ist, das Spaß macht, ansprechend ist und einfach zu bedienen ist.
5. Erzähle eine Geschichte
Wenn es darum geht, reale und illustrierte Bilder zu mischen, erzählen die besten Kombinationen effektiv eine Geschichte. Die visuellen Elemente stimmen mit der Stimmung des Inhalts überein und fühlen sich als Teil der Markenidentität.
Die Verwendung dieser Technik kann für einmalige Anwendungen verwendet werden, ist jedoch häufig in eine umfassendere Markenstrategie integriert. Schauen Sie sich Cone Flower Creamery an. Das Logo ist abgebildet. Das Website-Design verwendet eine meist illustrierte Geschichte, um die richtige Stimmung zu erzeugen und die Benutzer zu ermutigen, die Marke immer wieder kennenzulernen. Und wenn Sie mehr sehen möchten, füllen Sie die Lücken mit einem Bild aus. Das Design ist unglaublich einfach und konzentriert sich auf die Geschichte selbst, nicht auf die Techniken, mit denen sie erstellt wurde.
Am anderen Ende des Spektrums ist Kuoz, eine Portfolio-Site mit einer Mischung aus Bildern und Illustrationen. In ähnlicher Weise hilft der Mix bei der Präsentation von Projekten, wer und was Kuoz ist. Schauen Sie sich die Gruppierungen genau an, um herauszufinden, warum dieses Design funktioniert, ohne sich überfordert oder unübersichtlich zu fühlen. Bilder und Illustrationen sind durch ähnliche Farbschemen miteinander verbunden, so dass sich jede Platzierung bewusst und harmonisch anfühlt.
Das ist wirklich der Schlüssel zum Mischen von Bildern und Illustrationen: Sie müssen absichtlich aussehen. Sie müssen in Harmonie erscheinen. Sie sollten niemals wie ein Haufen Elemente aussehen, die auf einer Seite kleben.
Fazit
Sind Sie mutig genug, diesen Designtrend anzunehmen? Die Technik kann erstaunlich aussehen, ist jedoch einschüchternd und für einen Kunden schwer zu verkaufen.
Bringen Sie einige Arbeitsbeispiele mit, die die Effekte gut nutzen, um anderen zu zeigen, was Sie tun können. Skizzieren Sie einige der Illustrationen im Voraus, um das Designkonzept weiter zu verkaufen. Und denken Sie daran, eine Geschichte zu erzählen, die den Benutzer anspricht!