Haupt / Wie Man

Wie erstelle ich ein animiertes Banner?

Seite 1 von 2: Seite 1

Seite 1
Seite 2

In unserem Tutorial erfahren Sie, wie Sie dieses einfache animierte Werbebanner erstellen

Jeder Designer wird gebeten, zu einem bestimmten Zeitpunkt seiner Karriere ein Werbebanner zu erstellen, unabhängig davon, ob es sich um eine eigenständige Anzeige oder nur um eine Anzeige innerhalb einer viel größeren Kampagne handelt. Auf einer sehr einfachen Ebene ist dies wie bei jedem anderen Designjob, wenn Sie einfach ein statisches Banner erstellen möchten, das für viele Zwecke in Ordnung ist. Wenn Sie jedoch die Aufmerksamkeit des Betrachters auf sich ziehen oder tatsächlich viele Informationen vermitteln möchten, müssen Sie ein animiertes Banner erstellen.

In diesem 10-stufigen Tutorial werde ich die Grundlagen zum Erstellen einer animierten Bannerwerbung in Creative Suite oder Kreative Wolke Versionen von Photoshop, die das Ebenenbedienfeld in Verbindung mit der Animationszeitleiste verwenden. Dies ist eine einfache Animationsarbeit, aber sobald Sie sich mit der Arbeit mit einer Zeitleiste und dem Ebenenbedienfeld vertraut gemacht haben, kann dies schnell zu komplexeren Animationsarbeiten führen.

01. Einrichten

Zunächst müssen wir unser Dokument auf die richtige Spezifikation einstellen. Navigieren Sie zu Photoshop, erstellen Sie ein neues Dokument und stellen Sie im Dialogfeld 'Neues Dokument' sicher, dass die Abmessungen auf Pixel festgelegt sind. Geben Sie 728 für die Breite und 90 für das Höhenende ein und stellen Sie sicher, dass der Farbmodus auf RGB eingestellt ist. Machen Sie sich keine Sorgen um die Auflösung, da wir in Pixel arbeiten. Dies ist die Standardgröße für eine horizontale Ranglisten-Bannerwerbung.

02. Beginnen Sie mit dem Entwerfen

Beginnen Sie nun mit der Gestaltung der Anzeige. Dies wird ein typografisches Design sein, daher möchte ich es mit den Farben der Marke Creative Bloqs fett und grafisch halten, aber Sie können auch Ihre eigenen Farben und grafischen Elemente verwenden, um am besten zu Ihrem Projekt zu passen.

Erstellen Sie zunächst eine neue Ebene im Ebenenbedienfeld und treffen Sie eine perfekte quadratische Auswahl, indem Sie die Umschalttaste gedrückt halten, während Sie das rechteckige Auswahlwerkzeug verwenden. Füllen Sie diese nun mit dem Farbeimer-Werkzeug mit einer Farbe und benennen Sie die Ebene passend. In diesem Fall habe ich sie 'Farbblock 01' genannt.

Bewegen Sie nun den Mauszeiger mit dem Verschieben-Werkzeug über das Quadrat und ziehen und duplizieren Sie das Quadrat, während Sie die Alt-Taste gedrückt halten, so dass es an den Rändern des ursprünglichen Quadrats einrastet. Der Fang muss im Ansichtsmenü aktiviert sein.

Duplizieren Sie die Quadrate so lange, bis Sie das Banner gefüllt haben. Wählen Sie sie dann alle aus, indem Sie die Umschalttaste gedrückt halten, und stellen Sie sicher, dass sie im Dokument zentriert sind. Löschen Sie jetzt einfach jedes andere orangefarbene Quadrat, um ein einfaches quadratisches Raster zu erstellen, auf dem unser Design und unsere Animation basieren. Mit allen noch ausgewählten Quadraten getroffen Cmd + E. um alle quadratischen Ebenen zusammenzuführen.

04. Typelemente erstellen

Beginnen Sie nun mit der Erstellung der Tybelemente. Schlagen T. um das Textwerkzeug aufzurufen und ein Quadrat über das erste orangefarbene Quadrat zu zeichnen. Stellen Sie sicher, dass Weiß in der Vordergrundfarbe ausgewählt ist, geben Sie ein Zeichen ein und wählen Sie die Schriftart aus, die Sie verwenden möchten. Je kühner und grafischer, desto besser. Verwenden Sie die Tastenkombination Befehlstaste + Umschalttaste +. um die Punktgröße schnell zu erhöhen.

Wenn Sie zufrieden sind, drücken Sie das Verschieben-Werkzeug und positionieren Sie den Typ mit den Cursortasten zentral im orangefarbenen Rahmen. Duplizieren Sie den Textrahmen und wiederholen Sie den Vorgang, indem Sie alle orangefarbenen Quadrate mit unterschiedlichen Zeichen füllen.

05. Duplizieren und zusammenführen

Duplizieren Sie nun einen der Textrahmen und wiederholen Sie den Vorgang in Schritt 4, indem Sie die weißen Quadrate wie oben gezeigt mit orangefarbenem Typ füllen. Jetzt wollen wir eine einzelne Ebene aus dem orangefarbenen und dem weißen Typ erstellen.

Halten Sie dazu einfach die Umschalttaste gedrückt, wählen Sie den gesamten weißen Typ aus und drücken Sie dann Cmd + E. die Ebenen zusammenführen. Wiederholen Sie diesen Vorgang für den orangefarbenen Typ und geben Sie ihnen im Ebenenbedienfeld einen geeigneten Namen, z. B. 'weißer Typ 01'. Dadurch wird der Typ gerastert und Sie können ihn von niemandem bearbeiten. Stellen Sie daher sicher, dass Sie damit zufrieden sind.

Nächste Seite: Die nächsten fünf Schritte