Wie die Filmschule mir geholfen hat, bessere Benutzererlebnisse zu machen

Meine jüngste sechzig-Tage-CSS-Animation Challenge, die sich auf Kreationen mit Zombie-Thema konzentrierte, hat meine Erkenntnisse im Filmschule unerwartet neu entfacht. Die Parallelen zwischen Filmemachen und Webanimation, insbesondere in Bezug auf Geschichtenerzählen und visuelle Techniken, erwiesen sich überraschend stark. Auf dem Aufbau von Sarah Drasners Einblick in die Verbindung zwischen Theaterentwicklungen habe ich untersucht, wie Filmprinzipien die Weberlebnisse erhöhen.

Benutzer durch Erzählung einbeziehen

Menschen werden von Natur aus von Geschichten angezogen. Das Einbeziehen von Erzählungen, insbesondere in Webanimationen, erhöht das Engagement erheblich. Für präzise Webanimationen benötigt eine überzeugende Geschichte nur zwei Elemente: einen Charakter und einen auffälligen Vorfall .

Meine Codepen "Magical oops" Demo veranschaulicht Folgendes:

Die einfache Wechselwirkung - der schrumpfende Strahl eines Wissenschaftlers fällt - erstellt eine Miniaturerzählung. Während die Zuschauer möglicherweise nicht persönlich auf die Charaktere (ein Wissenschaftler und einen Zombie) beziehen, erzeugt das unerwartete Ereignis Intrigen. Der Ton kann verspielt, ernst oder irgendetwas dazwischen sein; Der Schlüssel ist für den Kontext der Website relevant.

Personifizierung der Erfahrung

Menschen anthropomorphisieren natürlich. Denken Sie an die emotionalen Verbindungen, die wir mit Pixar -Charakteren schmieden. Dieses Prinzip gilt auch für Webanimationen, auch ohne wörtliche Charaktere. Betrachten Sie Slacks feierliche Animation beim Löschen von ungelesenen Botschaften. Dies verkörpert subtil die Leistung des Benutzers und verwandelt eine funktionale Handlung in einen lohnenden narrativen Moment.

Das Hinzufügen von Persönlichkeit zu Animationen macht sie unvergesslicher und zuordenbarer. Der Benutzer wird Teilnehmer der Geschichte und verbessert seine Gesamterfahrung. Beobachten Sie das subtile Grinsen in meinem "untoten Sitzfahrer" Codepen: Dieses kleine Detail fügt emotionale Tiefe und Relativität hinzu.

Visuelle Tiefe und Fokus beherrschen

Die revolutionäre Deep Focus -Kinematographie von Citizen Kane, die es mehreren Fokusebenen schärft, bietet eine wertvolle Lektion. Während Webentwickler nicht durch Kameraobjektive eingeschränkt sind, bleibt das Prinzip, die Aufmerksamkeit auf verschiedene visuelle Schichten zu lenken, von entscheidender Bedeutung.

Parallaxe Scrolling und modale Muster verwenden dieses Konzept bereits. Mein "Hey, hey, hey!" CodePen zeigt den Verschiebungsfokus zwischen Vordergrund- und Hintergrundelementen:

Umgekehrt kehrt "niemand hier als wir Menschen ... 2" dies um, beginnt mit einem entfernten Charakter und bringt den Vordergrund in scharfe Fokus:

Das Anzeigen einer Website als dreidimensionaler Raum entsperren kreative Möglichkeiten. Techniken wie Schattierungen, Schatten und Größenmanipulation können die Tiefe simulieren, wie in "Endlich allein mit meinem Sandwich ..." gezeigt, wobei Stapelreihenfolge einen mehrdimensionalen Effekt erzeugt:

Animationen mit Szenenübergängen erhöhen

Meine erfolgreichsten Animationen gehen über einfache Interaktionen von Charakteren hinaus. "Zombie Noon 2" verschiebt die Perspektive des Betrachters geschickt und verwandelt sie in einen Charakter innerhalb der Erzählung:

In ähnlicher Weise verwendet "Lunch (at) Noon" eine Perspektive der ersten Person, die in einem Szenenübergang gipfelt, der sich auf einen überraschenden neuen Charakter konzentriert:

Die strategische Kameraarbeit - simuliert durch Animationstechniken - verbindet das Engagement der Zuschauer. Obwohl nicht jede Animation dramatische Kamerabewegungen erfordert, können nachdenkliche Perspektivverschiebungen die Benutzererfahrung erheblich verbessern.

Mein Hintergrund für die Filmschule hat sich in der Webanimation als von unschätzbarem Wert erwiesen. Die Prinzipien des Geschichtenerzählens und der Kinematographie führen direkt auf ein ansprechenderes und unvergesslicheres Online -Erlebnis.

Es ist jedoch wichtig zu beachten, dass die Erzählung nicht immer angemessen ist. Eine von der Seite story gesteuerte Animation unter Seite der Allgemeinen Geschäftsbedingungen könnte kontraproduktiv sein. Berücksichtigen Sie Benutzerpräferenzen, insbesondere solche mit reduzierten Bewegungseinstellungen. Diese Techniken sind Tools, keine universellen Lösungen, um die Benutzererfahrung zu verbessern.

Das obige ist der detaillierte Inhalt vonWie die Filmschule mir geholfen hat, bessere Benutzererlebnisse zu machen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!