Das neue CSS-Tricks-Video-Intro von Dina Amin

Sie kennen unsere Video -Tutorials? Obwohl nicht besonders häufig, mache ich es schon lange und mag es immer noch und plane, es weiter zu tun. Ich werde sie hier veröffentlichen und Sie können auch YouTube abonnieren.

Im Laufe der Jahre habe ich verschiedene Animationen für benutzerdefinierte Videotitel verwendet, die alle von Menschen gemacht haben, die besser darin sind als ich. Im Mai dieses Jahres fragte ich herum und bekam einige gute Vorschläge, aber nichts Schöneres als Matthias, der Marc empfohlen hat, und dann kontaktierte Marc mich Dina Amin.

Dinas Werke sind auffällig: Es ist großartig! Sie ist gut in Stop-Motion-Animation und vielen Durchbruchsachen:

Wir diskutieren und planen das Projekt. Sie sagte:

Ich habe mit Assemed Kamal zusammengearbeitet, um eine neue Eröffnungsanimation für den CSS-Tricks YouTube-Kanal zu erstellen. Wir wollten eine sehr kurze, prägnante, aber lustige Animation machen, damit die Zuschauer auf YouTube die Eröffnungs-Credits nicht überspringen oder sich nicht langweilen würden, wenn sie mehrere CSS-Tricks-Videos hintereinander ansehen würden.

Sie recherchierte und stellte eine Reihe von Fragen. Ich mag es, dass sie sich der Rolle der Eröffnung eines solchen Credits im Video sehr bewusst ist, insbesondere im Tutorial. Nicht zu lang, in keiner Weise nervig. Es muss detailliert genug sein, dass es fast eine Freude ist, es wiederholt zu sehen.

Der alte Videotitel beginnt mit der Tastatur:

Wir haben mit Apple Keyboard begonnen, weil wir Dinge behalten wollten, mit denen Chris 'Publikum im Original -Titel mitnehmen konnte, und vor allem, weil ich die Tastatur auseinander nehmen wollte!

"Haben wir die Tastatur entfernt?!" Ja, wir entfernen es. Es ist leicht, viele kaputte Apple-Tastaturen zu finden, was ein sehr gut gestaltetes Produkt ist. Alle Teile sind sehr schön mit den wenigsten Teilen kombiniert, aber nur Apple kann dieses Produkt reparieren. Sie können Ihr Schraubendreher -Set nicht herausnehmen, öffnen und eine defekte Taste -Verbindung reparieren. Viele solcher Tastaturen werden also weggeworfen, weil es zu teuer ist, in einem Land wie Ägypten zu reparieren. Wir haben drei Tastaturen bekommen, wir haben eine abgenommen, während wir die Animation machten und verschiedene Tasten von den anderen beiden Tastaturen verwendet haben, um die gestreckten Tasten zu erstellen.

Es ist interessant, einige Tidbits hinter den Kulissen in ihren Instagram-Geschichten zu sehen:

Eine weitere Verbindung zum Original -Titel ist die Idee der Website als Komponente und Erstellung des Layouts. Dies wird im Originaltitel nur mit einigen Hintergrundskizzen verwiesen und wird nun in dieser Version in Form eines Papierprototyps zum Leben erweckt.

Wir haben darüber nachgedacht, den Prozess zu zeigen, wie die „Wie man eine Website erstellt“ in sehr abstrakten Schritten zeigt, in dem jeder Schritt schnell übergeht und in einen anderen Schritt wird. Von Tastaturklicks bis zum Code, dann das Designmodul, das die Website zusammensetzt, und scrollen, um das CSS-Tricks-Logo anzuzeigen.

All dies geschieht mit Stop-Motion-Animation! Bewegen Sie Teile mit Ihren Händen, machen Sie Fotos und machen Sie sie in ein Video.

Sobald wir die Genehmigung von Konzept erhalten haben und die Requisiten vorbereitet hatten, verbrachten wir Stunden damit, die Widgets zu bewegen, um all diese erstaunlichen Effekte zu erzielen.

Schauen Sie sich die Zeitrafferfotografie des kreativen Prozesses an!

Schließlich habe ich mehrere Versionen verschiedener Seitenverhältnisse und -größen erhalten, was großartig ist, weil ich so viel wie möglich wechseln kann und die Version verwenden kann, die in verschiedenen Szenarien möglicherweise angemessener ist. Dies ist die Hauptversion!

Ich habe angefangen, diese am Anfang und am Ende eines solchen Videos zu platzieren.

Vielen Dank an Dina und Assam!

Das obige ist der detaillierte Inhalt vonDas neue CSS-Tricks-Video-Intro von Dina Amin. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!