Creative Connection

28 avril 2017 /illustration /

En direct avec Mr Bean : comment un grand classique du dessin animé fait son apparition sur Facebook Live

Mr Bean est une marque internationale au succès phénoménal, bénéficiant d’un réel appétit des fans pour le show ; L’équipe derrière Mr Bean chez le Groupe Endemol Shine a conduit à une croissance incroyable de la marque en ligne et est continuellement à la recherche de nouveaux moyens pour divertir et engager son audience.

Résultat : lors de la diffusion mondiale à venir, le personnage animé de Mr Bean échangera pour la première fois en direct avec ses fans. Voici donc comment le Groupe Endemol Shine s’est associé à Adobe Character Animator CC (Beta) pour préparer Mr Bean à faire ses grands débuts sur Facebook Live.

 

Relever le défi de l’animation

La technique d’animation a fait du chemin depuis l’époque des croquis à la main. Les nouvelles technologies telles qu’Adobe Character Animator accélèrent comme jamais le processus d’animation, ce qui ne signifie pas pour autant que tout est facile.

On retrouve dans le personnage animé le côté bizarre de Mr Bean, et aucun détail ne manque. L’homme n’est pas très prolixe, c’est le moins qu’on puisse dire. En revanche, il se distingue par ses expressions faciales et ses mouvements outranciers. L’équipe de designers savait donc que l’enjeu était de taille. Le personnage devait être aussi fidèle que possible à la personnalité de Mr Bean, et il fallait être en mesure de l’animer au débotté, sans scénario, devant des millions de spectateurs en train de suivre l’émission en direct. Face à ces problématiques de design, qu’est-ce que Mr Bean allait bien pouvoir faire ? Et bien, des charades tout simplement.

Des animations simples mais percutantes

La première étape a consisté à simplifier l’animation. Les 1553 formes de bouche, 777 formes de main et 96 formes de tête du Mr Bean de base ont été ramenées à des volumes beaucoup plus gérables, réunis dans un seul et même document Adobe Illustrator. Au final, le personnage ne se retrouve plus qu’avec 22 formes de main et 18 formes de bouches différentes (dents serrées et langue sortie comprises).

Restait à synchroniser les mouvements des bras et des mains. Grâce aux nouveaux cycles d’animation, ses bras peuvent être animés de manière indépendante ou ensemble via un mix de raccourcis claviers et de mouvements de la souris et avec une frappe supplémentaire des touches, ses mains s’animent simultanément.  La marque de fabrique de Mr Bean n’a pas été oubliée : des coudières ont été ajoutées pour faire bonne mesure et rendre le personnage 2D plus dimensionnel.

Il était important dans les charades que les différents gestes de Mr Bean soient aussi nets et reconnaissables que possible. Or avec une tête énorme et des mains minuscules, ce n’était pas forcément évident. La solution ? Un timing ultra précis, afin que chaque mouvement soit suffisamment lent pour être identifiable par le public, mais suffisamment rapide pour maintenir le rythme et les fans intéressés.

Réactions en direct

Les expressions faciales jouent un rôle primordial dans la manière dont Mr Bean réagit en direct aux commentaires des fans. Après avoir animé une expression faciale, les designers peuvent l’associer à un raccourci clavier à l’aide des commandes d’Adobe Character Animator. Il suffit ainsi d’appuyer sur un bouton durant l’émission pour faire réagir Mr Bean.

Son regard méchant, son strabisme et son air ahuri font partie de sa marque de fabrique.  En manipulant les paupières inférieure et supérieure, les designers ont réussi à recréer les différentes expressions de Mr Bean. Ils ont associé les mouvements des paupières à des raccourcis clavier qui, in fine, sont au nombre de 34 et permettent de déclencher des expressions très réalistes de manière impromptue.

Pour guider les fans pendant le jeu, les designers ont ajouté toute une série de symboles à  chaque charade, en utilisant Adobe After Effects CC. Grâce aux icônes « en deux mots », « film » ou « répéter » affichées sur l’écran,  entre autres, les spectateurs savent donc si Mr Bean se lance dans une nouvelle charade ou se répète.

Diffusion en direct

Le Groupe Endemol Shine et l’équipe d’Adobe Character Animator se sont associés à NewTek et Telestream pour intégrer la vidéo M2M multiplateforme à l’aide de la technologie NDI (Network Device Interface). Les nouveaux processus simplifient le transfert du signal d’animation en direct dans Wirecast, un logiciel de diffusion live de Telestream qui fait office de caméra source et est ensuite capable de créer une composition à partir d’autres sources, illustrations ou titres, et de coder et diffuser le tout sur Facebook.

« Quoi de plus passionnant que de pouvoir doter les designers d’une toute nouvelle palette d’outils de production vidéo en direct grâce à Adobe et à la technologie NDI de NewTek ? », déclare Andrew Haley, Wirecast Evangelist, chez Telestream. « Les processus d’animation qui s’étalaient autrefois sur plusieurs jours, voire plusieurs semaines, s’exécutent désormais à la volée et sont diffusés en direct sur Facebook, YouTube, Periscope et autres. C’est fabuleux ! »

Le jour de la diffusion, sept personnes au total seront chargées de donner vie à Mr Bean. Un réalisateur supervisera le jeu des charades et décidera comment Mr Bean répondra à l’audience. Un animateur travaillera avec le contrôle vocal pour manipuler les les mouvements et les expressions de Mr Bean. Un système Wirecast gérera la diffusion en continu, et une équipe de gestion de la communauté répondra aux commentaires des fans sur Facebook.

Pour jouer aux charades avec Mr Bean et découvrir les animations, suivez l’émission de Mr Bean en direct le 3 mai. À vous de jouer maintenant en essayant de créer vos propres animations avec Adobe Character Animator et tenez vous informé des dernières actualités et exemples d’Adobe Character Animator en suivant notre blog.

illustration

Participez à la discussion