#animations

#Transition #animations: a practical guide | by Dongkyu Lee | Oct, 2023 | #UX Collective
▻https://uxdesign.cc/transition-animations-a-practical-guide-5dba4d42f659

https://miro.medium.com/v2/resize:fit:1100/1*4e0H-Ej4oixTlBtJaZqUBw.gif https://miro.medium.com/v2/resize:fit:640/1*SzelHcIP8R-w3eku3P04Bg.gif

6 principles for better transition animations

– Fade in and out with opacity
– Scale to add liveliness
– Maintain consistent directionality
– Balance speed
– Prioritize, order, and group
– Establish spatiality

According to some articles, a speed from 100ms to 500ms is ideal and suitable for most cases.

#css

Lottie
▻http://airbnb.io/lottie

http://airbnb.io/lottie/images/Introduction_00_sm.gif

Lottie is a library for Android, iOS, Web, and Windows that parses Adobe #After_Effects #animations exported as json with Bodymovin and renders them natively on mobile and on the web!

via @fil

Netflix picks Mama K’s Team 4 as first African children’s animation — Quartz Africa

▻https://qz.com/africa/1598854/netflix-picks-mama-ks-team-4-as-first-african-childrens-animation

▻https://cms.qz.com/wp-content/uploads/2019/04/Mama-K-still-1.jpg?quality=75&strip=all&w=1400

Soon audiences around the world will be able to stream the story of an all girl-team of African spies, who also happen to be four normal Zambian teens by day. This week, Netflix announced that it has picked up Mama K’s Team 4, an animated series as its latest African content.

Netflix is teaming up with South Africa’s Triggerfish, who have emerged as devoted tellers of African children’s stories through animation and London-based children’s entertainment specialists Cake. The Cape Town-based Triggerfish animation studios has consistently produced children’s animation, despite a lack of funding and imagination. With Netflix in Africa, the story of African animation has become more hopeful.

#animations #afrique #filles

Decoding Structure (2015) on Vimeo
▻https://vimeo.com/116918317

https://i.vimeocdn.com/filter/overlay?src0=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2F505440772_1280x720.jpg&src1=https%3A%2F%2Ff.vimeocdn.com%2Fimages_v6%2Fshare%2Fplay_icon_overlay.png

Je découvre les belles #animations d’ #Afroditi_Bitzouni

Decoding Structure is a film based on the omonymous music track, composed by Kyriakos Charampides, and is included in the project Re: SinThesis.

The film explores the noise as a phenomenon produced by the sonic environment and as a new type of information captured, decoded and accepted by human beings.

TRANSMISSION (2016)
▻https://vimeo.com/190275599

Σαν Οίκτος | Ελένη & Σουζάνα Βουγιουκλή (2014)
▻https://vimeo.com/97814008

Night [Νύχτα] (2013)
▻https://vimeo.com/79696729

#beau #poésie

Early Japanese #Animations: The Origins of Anime (1917-1931) | Open Culture
▻http://www.openculture.com/2014/06/early-japanese-animations-the-origins-of-anime-1917-1931.html

Japanese animation, AKA anime, might be filled with large-eyed maidens, way cool #robots, and large-eyed, way cool maiden/robot hybrids, but it often shows a level of daring, complexity and creativity not typically found in American mainstream animation. And the form has spawned some clear masterpieces from Katsuhiro Otomo’s Akira to Mamoru Oishii’s Ghost in the Shell to pretty much everything that Hayao Miyazaki has ever done.

via @opironet, cc @jasmine @mad_meg

Les allégories politiques de Jan Švankmajer
▻http://www.centrevox.ca/exposition/jan-svankmajer-3

« Jan Švankmajer est un cinéaste d’animation expérimentale qui a entrepris sa carrière dans une structure socialiste rigide et dont l’œuvre est profondément marquée par les changements politiques radicaux qui ont eu cours en Tchécoslovaquie après la Deuxième Guerre mondiale

Dans son univers filmique, les choses s’animent de manière à produire des environnements étranges et impossibles qui, sur le plan théorique du surréalisme tchèque, visent à restituer la dimension subconsciente de la subjectivité souvent réprimée dans les contextes totalitaires. Byt / The Flat (1968) est exemplaire de cette approche : un homme est jeté à l’intérieur d’un appartement qui se transforme en un environnement hostile. L’homme est ainsi peu à peu réduit à l’impuissance par des objets qui s’animent et mettent en échec toute tentative de retrouver le monde extérieur, lequel demeure par ailleurs inconnu tout comme la raison de sa présence dans ce lieu. Le monde concret de la substance et de la raison perd toute forme d’évidence.

Ses films sont intrinsèquement liés au thème de la liberté et à tous les aspects de l’indignation ou de la rébellion qui y sont subordonnés. À une époque d’agitation sociale et politique, où les grandes structures de pouvoir sont une fois de plus contestées et où la génération émergente tente d’imaginer de nouveaux scénarios sociaux, les allégories politiques de Jan Švankmajer demeurent, encore aujourd’hui, d’une grande actualité. »

▻http://vimeo.com/81875587

▻https://www.youtube.com/watch?v=ZpYPr_ppf7w&list=RDZpYPr_ppf7w#t=0

▻http://www.festival-larochelle.org/taxonomy/term/185

GUY DEBORD ET LE SURRÉALISME ▻http://www.oeuvresouvertes.net/autres_espaces/breton_debord.htm

#fim #animations #allegorie #politique #enfermement #pouvoir #surrealisme

John Lewis ’The Bear & The Hare’ - The Making Of on Vimeo

▻http://vimeo.com/78254514

The Bear & the Hare is the first John Lewis campaign to embrace the emotive power of animation, a filmic technique so evocative of Christmasses gone by.

Elliot and Yves took the two most traditional and time-honoured animation processes – stop-motion and traditional hand-drawn 2D animation – and combined them to create something innovative and unique. Their aim was to do almost everything in camera, using real lighting, lens and film craft to build a world where the audience can see and feel the painstaking work behind it. The 2D animation’s physical interaction with the set and the human imperfections inherent in the process create a hand-crafted piece full of heart and integrity.

#cartoon #dessin_animé #animations #idées pour carto animée et “carto-cartoon” #vienne #kaiciid
The animation process involved constant shifts between 2D and 3D worlds. In order to achieve this complicated combination the whole film was first created in Blinkink Studios as a 3D previsualisation animatic with all the sets and characters built to scale. This allowed everything to be developed and planned alongside the modelmakers and animators, thus integrating the different disciplines and processes before the set was built or the characters were printed.

Aaron Blaise (Brother Bear, The Lion King, Mulan) and his team of veteran Disney animators at Premise Entertainment in Orlando, Florida, designed and animated the characters. The 2D-animation frames were printed onto mounted paper and cut with a laser. Each frame (nearly 4,000 in total) was then individually hand-labelled before going on set. Feature-film stop-frame animators then spent 6 weeks bringing the world to life.

The set was built by our production designer John Lee (Aliens, Fantastic Mr Fox, Frankenweenie) and his team at Shepperton Studios before being transported to Clapham Road Studios ready for the stop-motion shoot.

Post-production was done in-house in Blinkink’s animation studio, and the final grade was completed at MPC.

▻http://css-tricks.com/css-animation-tricks

The following is a guest post by Zach Saucier. Zach cooks up some pretty inspiring animations over on CodePen. I couldn’t be happier that he wanted to share some of the tricks he uses to create them, especially because they are things we all strive for: efficiency, reusability, practicality, and speed.

#css3 #webdesign #animations

The #Responsive #Hover Paradigm ◆ 24 ways
▻http://24ways.org/2013/the-responsive-hover-paradigm

#CSS #transitions and #animations provide web designers with a whole slew of tools to spruce up our designs. Move over ActionScript tweens! The techniques we can now implement with CSS are reminiscent of Flash-based adventures from the pages of web history

#web_design

A List Apart: Articles: CSS Sprites2 - It’s JavaScript Time
►http://www.alistapart.com/articles/sprites2

#jquery #animations #web #webdev