Share
Wenn Sie Corona SDK verwenden, wissen Sie, dass es ein leistungsfähiges und einfach zu verwendendes Werkzeug zum Erstellen von mobilen Spielen ist. Die Plattform ist jedoch auf nur zwei Dimensionen beschränkt, obwohl sie integrierte Möglichkeiten zur Simulation von 3D-Effekten bietet. Als Spieleentwickler können Sie diese Einschränkung etwas überwinden, indem Sie das so genannte Tiefenschärfekonzept verwenden.
Obwohl ich in meinem Beispiel auf Corona SDK Bezug nehmen möchte, kann die Schärfentiefe-Theorie auf jede Entwicklungsplattform und auf fast jedes Grafikobjekt angewendet werden.
Wenn Sie sich mit der Fotografie beschäftigt haben, wissen Sie bereits, wie groß die Schärfentiefe ist. Für diejenigen von uns, die es nicht wissen, versuche ich zu erklären. Die Schärfentiefe ist der verschwommene Effekt, den Sie in Fotos sehen, wenn der Fokus auf einem bestimmten Objekt über anderen liegt. Die Schärfentiefe basiert auf zwei Begriffen: Wahrnehmung des Fokus und Nachbildung der Entfernung.
Im ersten Konzept wird die Wahrnehmung des Fokus auf zwei Objekten oder zwei Ebenen verwendet, um eine Umgebung mit Tiefe zu schaffen. Ein Objekt ist der Fokus und die anderen Objekte oder Ebenen werden unscharf. Die unscharfen Objekte erscheinen fast immer verschwommen, um den Fokus des Betrachters zu steuern.
Das zweite Konzept emuliert die Entfernung. Wenn Sie die Szenerie betrachten, werden die Wandschrankobjekte für Sie größer und Objekte in weiter Entfernung erscheinen kleiner. Die Schärfentiefe verwendet dieses Konzept, um die Tiefenillusion in der Szene zu verstärken. Durch das Vergrößern oder Verkleinern von Objekten in einer 2D-Umgebung wird der Verstand des Betrachters dazu verleitet, davon auszugehen, dass Tiefe in der Szene vorhanden ist.
Wenn Sie zuvor Videospiele gespielt oder sogar einige beliebte Fotos angesehen haben, haben Sie bereits das Tiefenschärfekonzept kennen gelernt, das Sie jedoch möglicherweise nicht erkannt haben. Wenn Sie eine schnelle Google-Bildsuche nach Schärfentiefe ausführen, werden Hunderte von Beispielen für diesen Stil der Fotografie angezeigt. Die Fotos, die Sie sehen, reichen von Landschaften bis zu Hochzeitsfotos. In jeder Tiefenschärfefotografie wissen Sie sofort, worauf der Fotograf den Betrachter blicken möchte.
Mit der Schärfentiefe können Sie den Fokus der Szene steuern und Tiefe erzeugen, indem Sie auf das Hauptmotiv fokussieren, während andere Elemente unscharf bleiben. Obwohl es mir Spaß macht, mit Corona SDK zu entwickeln, ist dieser Effekt eine einfache, aber effektive Möglichkeit, um die 2D-Einschränkungen der Corona SDK-Plattform zu überwinden.
In den folgenden Beispielen werde ich erklären, wie die Schärfentiefe in mobilen Spielen genutzt werden kann. Sie können das Tiefenschärfekonzept in jeder Ihrer mobilen Anwendungen mit dem SDK Ihrer Wahl verwenden.
Nun, da wir wissen, was Schärfentiefe ist, schauen wir uns ein Beispiel einer Szene an, die nicht das Schärfentiefekonzept verwendet.
In dieser Szene stehen beide Vögel im Fokus und es erscheint dem Betrachter wie ein Flachbildschirm. Obwohl diese Szene für einige Spiele gut genug ist, können wir das Tiefenschärfekonzept verwenden, um die Szene für den Spieler interessanter zu machen und sie wirklich zum Leben zu erwecken. In der nächsten Szene sehen Sie ein grundlegendes Beispiel für das verwendete Tiefenschärfekonzept.
Durch Verwendung des Tiefenschärfekonzeptes hat diese Szene die Entfernung simuliert, indem der Vogel auf der linken Seite im Fokus bleibt und der Vogel auf der rechten Seite unscharf bleibt. Die Verkleinerung des unscharfen Vogels verstärkt die Wahrnehmung der Entfernung.
Wir können die Szene auch umkehren, damit der Fokus weiter entfernt erscheint. Indem Sie die größeren Objekte verschwimmen lassen und den Fokus im Fokus behalten, wird diese Umkehrung erreicht. Schauen wir uns ein Beispiel für diese Szenenumkehr an.
In der Umkehrszene haben wir den kleineren Vogel zum Mittelpunkt gemacht und den Betrachter dazu verleitet, anzunehmen, der kleinere Vogel sei weiter entfernt, indem er die nächstgelegenen Objekte verwischt.
Möglicherweise sind Sie neugierig auf die Erstellung dieser Grafiken. Wenn Sie Photoshop oder ein ähnliches Grafikbearbeitungstool verwenden, können Sie mit Gaussian Blur Tiefenschärfeszenen erstellen. Ich bin sicher, dass jede Art von Unschärfe funktionieren wird, aber ich hatte mit dem Gaußschen Unschärfe den größten Erfolg. Sehen wir uns an, wie Sie eine verschwommene und eine nicht verschwommene Grafik für unsere App erstellen.
Erstellen Sie bei geöffnetem Photoshop ein neues Dokument mit 150 x 150 Pixeln. Die Standardeinstellung für die anderen Optionen funktioniert für dieses Lernprogramm.
Klicken Sie anschließend auf das Werkzeug für benutzerdefinierte Formen und wählen Sie aus Vogel 2 aus dem Dropdown-Menü der Form. In diesem Tutorial verwende ich die Form eines Vogels. Jede Form wird funktionieren.
Nachdem wir nun eine Form ausgewählt haben, ändern wir die Vordergrundfarbe in eine schöne blaue Farbe, indem Sie auf klicken Legen Sie die Vordergrundfarbe fest Möglichkeit.
Erstellen Sie mit dem Formwerkzeug eine Vogelform im Dokument und versuchen Sie, den Vogel dazu zu bringen, den größten Teil des Dokuments auszufüllen.
Fügen Sie unserer Form einen einfachen Rand hinzu, um ihm eine Definition zu geben.
Bevor wir die Gaußsche Unschärfe zu unserer Form hinzufügen, gehen wir zu Datei> Für Web speichern> Geräte um die Form als PNG-Datei in unserem Projektordner zu speichern. Die unscharfe Form, die wir speichern, wird als Schwerpunkt in unserer mobilen Anwendung verwendet.
Nachdem wir die nicht unscharfe Form gespeichert haben, können Sie jetzt die Gaußsche Unschärfe hinzufügen. Bei den meisten Formen können Sie einfach eine Gaußsche Unschärfe hinzufügen, ohne zusätzliche Schritte ausführen zu müssen. In unserem Fall müssen wir die verwenden Bild abflachen Option in Photoshop, weil wir einen Rand verwenden. Wenn das Bild nicht abgeflacht wird, führt die Unschärfe zu unerwarteten Ergebnissen.
Klicken Sie mit der rechten Maustaste auf die Formebene und klicken Sie auf Bild abflachen. Fügen Sie nach dem Abflachen des Bildes die Gaußsche Unschärfe hinzu, indem Sie zu gehen Filter> Unschärfe> Gaußsche Unschärfe.
Wenn Sie unsere Gaußsche Unschärfe auf unsere Form angewendet haben, können Sie die Form jetzt in unserem Projektordner unter Verwendung der gleichen Anweisungen in Schritt 6 speichern.
Nachdem Sie diese acht Schritte ausgeführt haben, sollten Sie zwei Vögel in Ihrem Projektordner haben, ein klares und scharfes Bild von einem Vogel und einem verschwommenen Vogel. Sie können diese Bilder jetzt in Ihre nächste mobile Anwendung integrieren.
In diesem Tutorial hoffe ich, dass Sie gelernt haben, wie Sie mit dem Depth of Field-Konzept Ihre Spiele zum Leben erwecken können. Obwohl ich in meinem Tutorial einen Vogel verwendet habe, können Sie fast jedes Objekt verwenden, um eine Szene mit Tiefenschärfe zu erstellen, die das Tiefenschärfekonzept verwendet. Sie können mit dem nächsten 2D-Seiten-Scroller Schärfentiefe auf den Hintergrund anwenden oder das Konzept auf bestimmte Elemente Ihres nächsten Horrorspiels anwenden. Danke fürs Lesen!
Accentsconagua