Warum unsere Kamera schneidet statt zu kriechen
· 4 Min. Lesezeit
Ein 58-Sekunden-Film kam mit einer Kritik aus einem einzigen Wort zurück: einschläfernd. Zu Recht. Sein Anfang hielt elf Sekunden lang dasselbe Bild, während die Stimme weitersprach. In drei Tagen haben wir neu gebaut, wie ein Film sein Tempo findet und wohin seine Kamera zeigt, und eine Regel festgelegt, an der wir seitdem festhalten: Eine Webseite wird nie langsam gezoomt, sie wird geschnitten.
Lange Szenen und eine Kamera, die stillstand
Der Film hatte sechs Szenen. Ein Blick auf die letzten Renderings zeigte: Fast alle hatten fünf bis sieben Szenen, egal wie lang sie waren, und ein 90-Sekunden-Film hielt eine einzige Einstellung 14,7 Sekunden lang.
Zwei Ursachen kamen zusammen. Das Szenenbudget erlaubte rund sieben Sekunden pro Szene bei höchstens acht Szenen, ein längerer Film bekam also einfach längere Szenen. Und die Kamera glitt am Anfang einer Szene auf ihr Motiv zu und blieb dann stehen, weil ein Bild, dessen Maßstab sich jedes Frame ändert, Seitentext flimmern lässt. Eine lange Szene auf einem stehenden Bild fühlt sich genau so an: einschläfernd.
Zuschauer sehen Einstellungen, nicht Szenen
Die Lösung hatte zwei Hälften. Erstens mehr Motive. Jedes Ziel hat jetzt seinen eigenen Rhythmus, und der Planer zielt auf das obere Ende des Bereichs:
- Werbung: etwa 4,5 Sekunden pro Szene
- Erklärfilm: 5,5 Sekunden
- Artikel: 6 Sekunden
- Demo: 6,5 Sekunden
- Tutorial: 7,5 Sekunden
Die Obergrenze stieg von 8 auf 12 Szenen, und ein Entwurf, der zu langsam zurückkommt, wird neu geplant, mit den Sekunden jeder Szene ausdrücklich genannt.
Zweitens wird eine lange Szene in Einstellungen geschnitten. Eine Einstellung unter 5,2 Sekunden, zwei unter 9, drei unter 14 und vier darüber, und jeder Schnitt fällt auf den ersten Laut eines gesprochenen Wortes, das Bild wechselt also mit der Stimme. Innerhalb einer Einstellung bleibt der Ausschnitt fest, deshalb muss die Kamera nicht mehr einfrieren. Bei einem französischen 58-Sekunden-Film ergab das 8 Szenen, die längste 7,2 statt 14,7 Sekunden.
Die Kamera auf das richten, was es verdient
Das Tempo war die halbe Geschichte. Die andere Hälfte war, was die Kamera zeigte. Über zwei Wochen Einstellungen hinweg zeigte mehr als die Hälfte eine Überschrift, Hervorhebungen gab es viermal so oft wie Klicks, und fast nichts zeigte ein Bild oder eine Karte.
Der Grund lag vor dem Planer. Das Auslesen der Seite bot ein paar Überschriften an, die ersten Links in Seitenreihenfolge, wodurch die Navigation das Menü füllte, und die Formularfelder. Sonst nichts. Das Auslesen liefert jetzt einen gewichteten Katalog von Motiven: zuerst Handlungsaufforderungen, dann Videos, Bilder, Karten, Preise, Kundenstimmen, Logos und Felder, Überschriften weit hinten. Ein Film mit drei oder mehr Aufnahmen muss mindestens zwei Arten nutzen und etwas anklicken.
Und das Zielen wurde genau. Jede Aufnahme wurde in einem Browserfenster gezeichnet, das etwas kleiner als das Bild war, während das Ziel auf dem ganzen Bild gemessen wurde, die Kamera landete also daneben. Eine Einstellung mit Motiv füllt jetzt das ganze Bild, und der Zoom trifft, wohin er zielt.
Warum Seitentext nie kriechen darf
Wir haben auch versucht, Einstellungen lebendiger zu machen, mit einem Cursor-Rundgang über die Seite und kurzen weichen Bewegungen, wenn sich der Ausschnitt leicht änderte. Die Sichtung am nächsten Morgen war eindeutig: Auf feinem Text wirkt jede langsame Maßstabsänderung wie ein Vibrieren.
Der Grund ist einfach, wenn man ihn einmal sieht. Ändert ein Bild voller kleiner Buchstaben seinen Maßstab um einen Bruchteil eines Pixels pro Frame, wird jeder Buchstabe in jedem Frame ein wenig anders gezeichnet, und das Auge liest das als Kribbeln. Text bleibt in jeder Größe scharf; er ist nur nie zweimal derselbe.
Deshalb ist ein Wechsel des Ausschnitts immer ein Schnitt, und bewegen darf sich nur noch, was keine feinen Details hat: die unscharfe Seite hinter einer Karte, Verläufe, Untertitel. Der Anteil der Frames mit diesem Kribbeln hat sich halbiert, von 20 auf 10 Prozent.
Kleine Details für ruhige Bewegung
Zwei kleinere Erkenntnisse haben die Arbeit abgerundet.
- Der Browser filmt mit 25 Bildern pro Sekunde, eines alle 40 Millisekunden, und unser Cursor bewegte sich alle 24 Millisekunden, seine Geschwindigkeit schien also zu pulsieren. Jetzt bewegt er sich genau einmal pro aufgenommenem Bild und gleitet gleichmäßig.
- Wir haben das Überblenden von Bildern getestet, um den Schritt von 25 auf 30 Bilder pro Sekunde zu glätten, und die einfachere Methode behalten. Überblenden mischt zwei Positionen von scrollendem Text zu einem Doppelbild; ein wiederholtes Bild bleibt scharf, mit regelmäßigem Rhythmus.
Außerdem sorgen wir dafür, dass jedes Motiv, das der Planer wählt, einem echten Element der Seite zugeordnet wird, im Code und nicht nur in den Anweisungen, damit jede geplante Einstellung ihr Ziel findet.
Was sich auf dem Bildschirm ändert
Ein PageToVid-Film bewegt sich jetzt wie ein geschnittenes Video. Die Szenen sind kürzer, lange werden auf der Stimme geschnitten, die Kamera geht zu Buttons, Bildern und Karten statt zu Überschriften, und Text zittert nie. Dieselben Worte, mit einem Bild, das mithält.
Das Bewegungsvokabular, auf dem wir aufbauen, findest du auf unserer Animationsseite, oder du startest einen Film und siehst, wie die Schnitte auf der Erzählung landen.
Sieh es auf deiner eigenen Website
Füge eine Seite ein und bekomme das vertonte Video, um das es in diesem Blog geht. Das erste ist kostenlos.
Weiterlesen
