Generieren Sie ein Nahaufnahmefoto des Laptop-Bildschirms (mit Pixeln)

Würden Sie einen Standard-Screenshot in ein Nahaufnahmefoto mit Laptop-Bildschirmeffekt umwandeln , auf dem Sie die Pixel sehen können?

Beispiel:

oder noch besser, ein 3D-Bild wie dieses .

Vielleicht könnte man eine Musterüberlagerung erstellen, um ein Pixelgitter zu simulieren, und die Ebene auf "abdunkeln" oder eine andere geeignete Mischoption einstellen. Wahrscheinlich "nah genug", um einen Geschmack zu vermitteln, ohne Subpixel usw. simulieren zu müssen. Das Muster müsste spezifisch für eine bestimmte Bildschirmgröße sein, oder das Gitter würde gegen die tatsächlich gerenderten Pixelgrenzen komisch aussehen.
Es ist interessant, dass Ihr Beispiel nicht viel Subpixel-Effekte in den weißen Bereichen zeigt. Wenn ich eine Lupe über den weißen Raum daneben halte, die so eingestellt ist, dass sie Pixel ähnlicher Größe ergibt, sehe ich definitiv farbige Subpixel (auf einem Standard-Büro-Iiyama sieht es aus wie 95 ppi).
Ich würde in die Photoshop-Leinwand zoomen und einen Screenshot machen, dann die Perspektive verzerren, um ein Foto zu imitieren. Das würde Pixel anzeigen, wie vom OP gefordert. Es würde natürlich keine Pixel/Artefakte auf dem LCD-Monitor zeigen, wie das lange Verfahren unten imitiert. Aber dieses Verfahren ist verdammt viel Aufwand für etwas, das Sie schnell als Screenshot erstellen können, oder für den ultimativen Realismus mit einer Digitalkamera in 1 Minute aufnehmen.
@ user8356 Ich bin mir nicht sicher, ob ich die von Ihnen beschriebene Technik verstehe, können Sie sie näher erläutern? Würde das Zoomen in Photoshop und das Aufnehmen eines Screenshots ein "Raster" erzeugen, ähnlich dem, das wir in Nahaufnahmen eines LCD-Monitors sehen?
Ich kenne einen sehr guten CRT-Shader für Blender: mrmotarius.itch.io/mrmocrt Natürlich nicht viele Laptops mit CRTs ...

Antworten (2)

Hier ist ein Vergleich zwischen einem RGB-Bild (links) und dem Aussehen, wenn es in extremer Nahaufnahme fotografiert wird (rechts):

Das LCD -Subpixelmuster ist offensichtlich und wir sehen auch, wie das Muster leicht verschwommen ist und dass das Licht der Subpixel ineinander übergeht.

Beginnen wir mit der Erstellung eines LCD-Subpixelmusters. Das kleinste, das ich mir vorstellen kann, ist das folgende 9×9-Pixel-Muster:

Jedes Subpixel ist 2×7 px in jeweils reinem RGB-Rot, -Grün und -Blau. Vertikal haben wir 1 px schwarze Polsterung zwischen jedem Subpixel und horizontal haben wir 2 px schwarze Polsterung zwischen jedem Pixel.

Zeichnen Sie das Muster in ein 9×9-Pixel-Dokument, wählen Sie alles aus und verwenden Sie Bearbeiten > Muster definieren , um es zu einem Muster zu machen:

Lassen Sie es uns anwenden. Als Beispielbild verwende ich dieses Stück Pixelkunst:

©Mads Wolff

Da sich unser Muster alle 9 × 9 Pixel wiederholt, müssen wir es mit der Nearest Neighbor -Interpolation um das 9-fache (900 %) vergrößern :

Klicken Sie auf das Bild, um es in voller Größe zu sehen.

Wir wenden das Muster an, indem wir oben eine Musterebene hinzufügen, wobei der Mischmodus auf Multiplizieren eingestellt ist :

Klicken Sie auf das Bild, um es in voller Größe zu sehen.

Jetzt müssen wir mit Filtern und Mischmodi ein wenig kreativ werden. Es gibt unendlich viele Möglichkeiten, dies zu tun. Hier ist mir gerade etwas eingefallen. Sie können jeden Schritt nach Ihren Wünschen verfeinern.

  • Wenden Sie den Filter Gaußscher Weichzeichner mit einem auf 1 px eingestellten Radius an , um das Muster zu glätten.

  • Wenden Sie den Filter „Unscharf maskieren“ an, wobei „Betrag“ auf „400 %“ , „Radius“ auf „3 px “ und „Schwellenwert“ auf „0“ eingestellt ist, um die Subpixel miteinander zu verschmelzen.

  • Wenden Sie den Filter Gaußscher Weichzeichner mit einem auf 0,5 px eingestellten Radius an , um das Muster wieder etwas zu glätten.

  • Wenden Sie den Gaußschen Weichzeichnerfilter mit Radius auf 4 px und Mischmodus auf Bildschirm an , um etwas Glanz hinzuzufügen.

  • Fügen Sie eine Ebenen- Einstellungsebene hinzu, um das Bild aufzuhellen und etwas Kontrast hinzuzufügen.

  • Fügen Sie das Originalbild oben hinzu, wobei der Mischmodus auf Farbton und die Deckkraft auf 50 % eingestellt ist , um dem Bild einen Teil der verlorenen Sättigung wieder hinzuzufügen.

Ich würde ein Smart-Objekt mit Smart-Filtern verwenden , um die Filter zerstörungsfrei zu machen:

Klicken Sie auf das Bild, um es in voller Größe zu sehen.

Dies kann als „Rohstoff“ für weitere Manipulationen angesehen werden. Fügen Sie beispielsweise eine Perspektive hinzu, indem Sie Free Transform verwenden , wenden Sie den Lens Blur- Filter an, fügen Sie eine leichte Reflexion hinzu, verwenden Sie den Camera Raw- Filter, um das Bild wie ein Foto zu korrigieren, und fügen Sie dabei etwas Körnung hinzu:

Klicken Sie auf das Bild, um es in voller Größe zu sehen.

Wunderbarer Beitrag @Wolff! Hier ist, was ich mit Ihrer Technik für diese eigentliche Webseite bekommen habe: i.stack.imgur.com/LwLEf.png
@Basj, schön! Ein bisschen Moiré, das vielleicht durch eine Optimierung der Unschärfe vermieden werden könnte. Aber andererseits könnte ein echtes Foto auch diese Art von Moiré haben.
@Wolff Wenn das Ziel darin besteht, ein echtes Foto einer typischen Bildschirmanzeige nachzuahmen, macht das Moire es. OTOH, dein Pixel-Art-Beispiel ist (IMO) ohne besser
@Basj das ist kein Foto??? Wow
@htmlcoderexe Ein Screenshot + die in dieser Antwort beschriebene Technik :)
Wolff, du bist eine Legende!!

Sie können dies nicht von einem Screenshot aus tun, sondern nur von einem Foto. Eine Bilddatei hat keine Pixel, die aus drei farbigen Punkten bestehen, jedes Bildpixel ist ein bestimmter Farbton -

Geben Sie hier die Bildbeschreibung ein

Sie benötigen eine Kamera mit entweder einem Makroobjektiv oder einem langen Objektiv, damit Sie auf einen kleinen Bereich fokussieren können.

Geben Sie hier die Bildbeschreibung ein

Sie können sogar etwas ungefähres mit einer Handykamera erhalten …

Geben Sie hier die Bildbeschreibung ein

Ein Stativ hätte diesen beiden Bemühungen erheblich geholfen ;)

Natürlich, ja :) Aber vielleicht gibt es Photoshop-Tools, um dieses Pixel-"Raster" + Unschärfeeffekte nachzubilden?
@Basj Vergrößern Sie offensichtlich einfach das Bild mit den nächsten Schichtschächten usw.
Sie müssen auch eine ganze Reihe winziger Kreise mit dunkleren Rändern modellieren, die kleiner als jedes "Pixel" sind, selbst in rein weißen Bereichen. Dann müssen Sie eine geeignete Perspektive schätzen und eine Linsenunschärfe hinzufügen. Schneller, um die Kamera herauszuholen.