Retro-Comic-Buchkunst: Ben Day Dots im Webdesign verwenden

Als Webdesigner sind wir immer auf der Suche nach neuen und kreativen Ideen für unsere Websites. Zum Glück ist Inspiration nicht schwer zu finden. Zum Beispiel erlebt Retro-Comic-Kunst immer ein Comeback. Mal als Typografie, mal als Fotofilter. In letzter Zeit tauchen an vielen Stellen Texturen und Illustrationen mit Ben Day-Punkten auf. Sie möchten sie selbst ausprobieren?

In diesem Artikel erklären wir den Ursprung der Ben Day Dots und wie man sie selbst herstellt. Darüber hinaus haben wir einige Beispiele für die Verwendung dieser visuellen Technik im Webdesign.

Ben Day Punkte und Halbtonpunkte

Die Begriffe „Ben Day Dots“ und „Retro-Comic-Buchkunst“ werden in der Regel synonym verwendet. Eigentlich standen Ben Day-Punkte an erster Stelle. Benjamin Henry Day Jr. schuf sie 1879, um die Kosten für den Farbdruck zu senken. Sie sind eine Technik, die gleich weit entfernte Punkte auf einem Raster platziert. Rote Punkte, die über Weiß gedruckt werden, ergeben rosa, blaue und gelbe Punkte ergeben Grün.

Ben Day Dots wurden von Halbtonpunkten inspiriert, die für den lithografischen und fotografischen Druck in Schwarzweiß verwendet wurden. Beide Punktstile sind auf einem quadratischen Raster angeordnet, aber Halbtonpunkte haben unterschiedliche Größen, während Ben Day-Punkte alle gleich sind.

Ben Day Dots, Comics und Roy Lichtenstein

In den 1930er Jahren kamen Comics in großem Stil in die Szene und Ben Day Dots waren die Drucktechnik der Wahl. Ben-Day-Punkte waren nicht gerade eine schöne Kunst, bis Roy Lichtenstein in den 1960er Jahren von ihrer generischen Einzigartigkeit inspiriert wurde. Es war Roy Lichtensteins Arbeit mit Comicbuch-Kunst, die Ben Day Dots ins Rampenlicht rückte. Was Lichtenstein tat, war, kleine Abschnitte von Massencomic-Buchseiten zu kopieren und sie in großformatige Meisterwerke zu verwandeln.

Obwohl Roy Lichtenstein Punkte verwendete, die Ben Day-Punkten ähnelten, waren sie ein wenig anders. Kunsthistoriker werden Ihnen sagen, dass sie besser „Lichtenstein Dots“ heißen. Der Hauptunterschied besteht darin, dass Ben Day-Punkte winzig und auf einem quadratischen Raster waren, während Lichtenstein-Punkte auf einem versetzten diagonalen Raster und erheblich größer waren.

Bildnachweis Radu Bercan / shutterstock.com

Der Aufstieg der Retro-Comic-Buchkunst

Die Kunst von Roy Lichtenstein ist zum Synonym für Retro-Comic-Kunst geworden. Viele Künstler haben die Lichtenstein-Technik kopiert. Viele Designer haben Comic-Punkte in ihren Kreationen für Branding-Schemata und Marketingmaterialien verwendet. Jetzt können Sie auch Ben Day-Punkte oder Lichtenstein-Punkte zu Ihren Websites hinzufügen.

Scrollen Sie durch, um zu erfahren, wie Sie Ihre eigenen Ben Day-Punktkreationen erstellen. Die endgültigen Designs, die Sie erzielen werden, werden tatsächlich eine Vielzahl von Techniken abdecken; Halbtonpunkte, Ben-Day-Punkte und Lichtenstein-Punkte. Alles in allem sind sie alle Retro-Comic-Stil-Design.

Lasst uns anfangen.

So erstellen Sie Retro-Comic-Buchkunst mit Photoshop

Halbtonpunkte sind so häufig, dass Photoshop einen Filter dafür hat und mit jedem Bild funktioniert. Dieser Filter wandelt die Farben im Bild in Punkte um. Die Winkelverteilung der Punkte wird durch die Farbkanäle gesteuert. Wenn Sie den Filter anwenden, besteht Ihr Bild jetzt aus Cyan-, Magenta-, Gelb- und Schwarzpunkten. Wenn Sie den Halbtonfilter auf eine reine Farbe wie Rot (#ff0000), Grün (#00ff00) oder Blau (#0000ff) anwenden, funktioniert der Filter nicht, da er keine Farben zum Trennen hat.

Um richtige Ben Day-Punkte und Lichtenstein-Punkte zu erstellen, benötigen Sie Adobe Illustrator. Klicken Sie hier, um fortzufahren.

Wie man mit Photoshop ein Foto wie Retro-Comic-Buchkunst in Halbtonpunkten aussehen lässt

1. Wählen Sie das Bild aus, das Sie in Punkte im Comic-Stil umwandeln möchten.

Ich habe diesen lustig aussehenden Kerl von der kostenlosen Stock-Foto-Site Gratisography ausgewählt. Klicken Sie hier, wenn Sie dasselbe Bild verwenden möchten, um mitzumachen. Öffnen Sie das Bild in Photoshop und zentrieren Sie es auf Ihrer Leinwand.

2. Duplizieren Sie die Ebene zweimal und blenden Sie die erste aus.

Um zu duplizieren, während die erste Ebene ausgewählt ist, klicken Sie mit der rechten Maustaste und wählen Sie "Ebene duplizieren" oder klicken Sie auf Befehl + J auf dem Mac und Strg + J auf dem PC. Benennen Sie sie um, damit Sie nicht den Überblick verlieren. Stellen Sie die Mischoption der oberen Ebene auf "hartes Licht" ein und verringern Sie die Deckkraft auf etwa 40%. Die Farben ändern sich dramatisch, dies wird dazu beitragen, das körnige Aussehen der Halbtonpunkte zu erhalten.

3. Gruppieren Sie die oberen beiden Ebenen und verwandeln Sie sie in ein Smart-Objekt.

4. Wenden Sie den Halbtonpunktfilter auf das Smart-Objekt an.

Wählen Sie im Popup-Fenster Farbhalbtoneinstellungen die maximale Pixelgröße von 13 und die Kanäle mit unterschiedlichem Grad aus. Sie können damit spielen, um verschiedene Effekte zu sehen.

5. Duplizieren Sie die untere Ebene und verschieben Sie sie nach oben.

Wenden Sie den Filter "Kanten suchen" darauf an und passen Sie die Pegel an, damit Sie die Umrisse besser sehen. Bewegen Sie dazu das schwarze Dreieck ganz nach rechts und das weiße nach links.

6. Verwenden Sie die Anpassungen, um die Ebene in Schwarzweiß umzuwandeln.

Stellen Sie die Deckkraft der Einstellungsebene auf 30 % ein. Stellen Sie schließlich die Ebenenoptionen der Ebene "Kanten suchen" auf "Überlagerung" ein.

Das fertige Design!

So erstellen Sie einen Retro-Comic-Buch-Kunsthintergrund mit Photoshop

1. Finden Sie einen farbigen Hintergrund mit einem schönen Design oder Farbverlauf.

Öffnen Sie das Bild auf Ihrem Photoshop-Dashboard und zentrieren Sie es auf dem Bildschirm.

2. Entsperren Sie die Hintergrundebene, duplizieren Sie sie und blenden Sie die untere aus.

Wenden Sie den Halbtonpunktfilter auf die oberste Schicht an. Passen Sie die Parameter im Halbton-Punktfilter-Popup für verschiedene Effekte an

3. Das fertige Design!

So erstellen Sie einen Retro-Comic-Buch-Kunsthintergrund mit Illustrator

Wie ich bereits erwähnt habe, haben Halbtonpunkte unterschiedliche Größen, um den Kontrast in einem Bild wiederherzustellen. Der oben verwendete Photoshop-Filter ist perfekt für diesen Effekt. Wenn Sie jedoch Punkte gleicher Größe wie Ben-Day-Punkte oder Lichtenstein-Punkte erstellen möchten, müssen Sie Adobe Illustrator und den integrierten Musterersteller verwenden. Wie ich oben erwähnt habe, befinden sich Ben Day-Punkte auf einem quadratischen Raster und Lichtenstein-Punkte auf einem versetzten diagonalen Raster. Beides kann mit dem Pattern Maker in Illustrator erreicht werden.

So erstellen Sie ein Ben-Day-Punktmuster mit Illustrator

1. Erstellen Sie ein neues Projekt in Illustrator.

Die Größe ist eigentlich egal. Wir haben 600 x 350 Pixel verwendet.

2. Wählen Sie das Werkzeug Abgerundetes Rechteck aus.

Klicken Sie einmal auf die Zeichenfläche und legen Sie die Größe Ihrer Form fest. Machen Sie es 15 x 15 Pixel mit einem Eckenradius von 7,5 ox. Ändern Sie die Farbe des Kreises in eine blaue Füllung und keinen Strich.

3. Klicken Sie auf „Objekt“ in der oberen Menüleiste und wählen Sie „Muster“ und dann „Erstellen“.

4. Passen Sie die Einstellungen so an, dass sich die Punkte auf einem quadratischen Raster befinden.

Dies sind die Einstellungen, die Sie auswählen müssen:

• Wählen Sie den Kacheltyp für das Raster aus
• Überprüfen Sie die Größe von Kachel zu Art
• H-Abstand und V-Abstand auf 15 x 15 px einstellen
• Wählen Sie Kopien auf 9 x 9 Zoll

Wenn Sie das Muster wie im Bild unten sehen, klicken Sie auf Fertig. Dadurch wird das Muster automatisch im Farbfeldbedienfeld gespeichert.

So erstellen Sie ein Lichtenstein-Punktmuster mit Illustrator

Dieses Muster folgt den gleichen Schritten wie das obige und ändert sich nur, wenn es an der Zeit ist, die Voreinstellungen im Musterersteller anzupassen. Öffnen Sie die Ben-Day-Mustereinstellungen und klicken Sie auf "Kopie speichern". Nennen Sie das neue Muster "Lichtenstein Dots". Wenn Sie auf OK klicken, wird es als Kopie im Farbfeldbedienfeld gespeichert. Schließen Sie das Ben-Day-Punktemuster. Öffnen Sie im Farbfeldbedienfeld das Lichtenstein-Punktmuster. Sie sehen ein Popup mit dem Namen des Musters, wenn Sie mit der Maus darüber fahren. Ändern Sie in den Voreinstellungen nur den Layouttyp in „Stein nach Reihe“ und klicken Sie auf Fertig.

So fügen Sie Formen Retro-Comic-Buch-Kunstmuster hinzu

Nachdem Sie nun Ihre eigenen Retro-Comic-Buch-Muster erstellt haben, können Sie sie jederzeit auf jede gewünschte Form anwenden. Zuerst müssen Sie die Mustermuster speichern, damit Sie sie jedem zukünftigen Projekt hinzufügen können.

1. Wählen Sie im Farbfeldbedienfeld die beiden neuen Muster aus, die wir erstellt haben.

Klicken Sie auf das Symbol der Farbfeldbibliothek und wählen Sie „Farbfelder speichern“. Benennen Sie die neuen Farbfelder 'Retro Comic Book Pattern' und klicken Sie auf OK.

2. Wenn Sie ein neues Projekt erstellen und diese Muster verwenden möchten, wechseln Sie zum Bedienfeld „Farbfelder“.

Sie werden unsere neuen Farbfelder dort nicht sehen, also müssen Sie sie importieren. Klicken Sie erneut auf das Symbol der Farbfeldbibliothek und scrollen Sie nach unten zu "Benutzerdefiniert" und dann zum "Retro-Comic-Buch-Muster". Es öffnet sich ein neues Fenster mit den Farbfeldern und den regulären Farben mit den enthaltenen Comicmustern. Jetzt können sie für jede gewünschte Form verwendet werden.

3. Erstellen Sie eine neue Form und füllen Sie sie mit einem der Muster.

Die Größe der Punkte hängt von der Größe der Form ab, die Sie erstellen. Die maximale Größe der Form wird durch die Größe der Zeichenfläche gesteuert.

Je kleiner die Form, desto größer die Punkte und umgekehrt. Wenn Sie eine kleine Form verwenden und der Meinung sind, dass die Punkte zu groß sind, klicken Sie mit der rechten Maustaste auf das Muster in der Form und wählen Sie „Transformieren“ und dann „Skalieren“. Um die Punkte superklein zu machen, wählen Sie die folgenden Parameter.

• Uniform: 10%
• In Optionen: Aktivieren Sie Muster transformieren

Probieren Sie verschiedene Parameter für die Option 'uniform' aus, um verschiedene Punktgrößen zu erhalten.

4. Um eine Sternform im Retro-Comic-Stil zu erstellen, erstellen Sie ein neues Projekt mit 1000 x 1000 Pixel.

Klicken Sie im Farbbedienfeld auf Schwarz für den Strich und auf das Lichtenstein-Muster für die Füllung. Wählen Sie die Sternform aus und klicken Sie auf die Leinwand, damit sie angezeigt wird.

Ideen für die Verwendung von Retro-Comic-Buchkunst im Webdesign

Der Trend zur Comic-Kunst scheint auf dem Vormarsch zu sein. Natürlich profitieren nicht alle Marken von dieser Art der Kreativität. Für die fröhlichen, farbliebenden Marken sind Ben Day-Punkte und Lichtenstein-inspirierte Grafiken perfekt für einen Hauch frischer Luft. Die beste Verwendung für ein Comic-Punktmuster ist als Hintergrund, entweder über einer anderen Farbe oder ohne. Versuchen Sie auch, große Sprechblasen als Trennzeichen oder Ausrufe im Comic-Stil für Ihren Inhalt zu verwenden. Sie können mit den obigen Tutorials Ihre eigenen erstellen oder einige bereits entworfene Bilder von Freepik beziehen.

Die folgenden Designs wurden mit Comic-Designs von Freepik erstellt. Wie Sie sehen, haben sich die Designer bei der Gestaltung der Punktgrößen einige Freiheiten genommen. Trotzdem verkörpern sie auf ihre Art und Weise den Retro-Comic-Stil perfekt.

Abschluss

Wie Sie sehen, sind die Möglichkeiten der Retro-Comic-Gestaltung sehr vielfältig. Von klassischen Stilen bis hin zu moderneren Versionen können Sie so ziemlich alles tun. Egal, ob Sie die Muster selbst erstellen oder Grafiken online beziehen, Sie können mit Retro Comic Book Art und Divi ziemlich erstaunliche Sachen erstellen!