What’s new in web animations

“What’s new in web animations” – my talk at Google I/O 2023


This content originally appeared on Bram.us and was authored by Bramus!

For this year’s Google I/O, I recorded a session “What’s new in web animations”.

Appropriate animations are a great way to help users build an accurate mental model of how a web page UI works and therefore increase usability of a web site. But it’s important for a UI to feel polished and fluid to users. Shipping in Chrome is a collection of new APIs that help you build these frictionless and engaging experiences. Get a highlight of some of these new APIs: view transitions, scroll-driven animations, the linear easing function, and individual transform properties.

In the talk, I cover four topics:

  1. View Transitions (* written by Jake)
  2. Scroll-Driven Animations
  3. Complex easing curves thanks to linear()
  4. Individual Transform Properties

You can find the video embedded at the top of this post.

Even though I managed to butcher some words, I’m very happy with how the session turned out. You can hardly notice that we had to fix some things in post as the spec on Scroll-Driven Animations just kept on changing after everything had already been recorded. It also was great to be in the London office to record this session and also getting to spend time with colleagues who I typically only get to see on video calls.

~

Apart from my video, my team also recorded these videos:

Turning to the wider Chrome DevRel team, I can also recommend Mariko’s talk What’s new in Web. Very happy to see that two things I worked on last year – namely Individual Transform Properties and the new viewport units – also got highlighted in the video.


This content originally appeared on Bram.us and was authored by Bramus!


Print Share Comment Cite Upload Translate Updates
APA

Bramus! | Sciencx (2023-05-16T21:38:30+00:00) What’s new in web animations. Retrieved from https://www.scien.cx/2023/05/16/whats-new-in-web-animations/

MLA
" » What’s new in web animations." Bramus! | Sciencx - Tuesday May 16, 2023, https://www.scien.cx/2023/05/16/whats-new-in-web-animations/
HARVARD
Bramus! | Sciencx Tuesday May 16, 2023 » What’s new in web animations., viewed ,<https://www.scien.cx/2023/05/16/whats-new-in-web-animations/>
VANCOUVER
Bramus! | Sciencx - » What’s new in web animations. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2023/05/16/whats-new-in-web-animations/
CHICAGO
" » What’s new in web animations." Bramus! | Sciencx - Accessed . https://www.scien.cx/2023/05/16/whats-new-in-web-animations/
IEEE
" » What’s new in web animations." Bramus! | Sciencx [Online]. Available: https://www.scien.cx/2023/05/16/whats-new-in-web-animations/. [Accessed: ]
rf:citation
» What’s new in web animations | Bramus! | Sciencx | https://www.scien.cx/2023/05/16/whats-new-in-web-animations/ |

Please log in to upload a file.



There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.

Related Posts