lydia@beem.express
Ce n’est pas pour rien si Google est considéré comme étant le premier moteur de recherche au monde. En plus de l’infinité d’informations qu’il peut partager, le moteur de recherche de Google offre aux utilisateurs une navigation amusante grâce à ses petites animations telles que le Barrel Roll. Comment déclencher l’effet Barrel Roll sur son navigateur ? Comment réaliser le Barrel Roll sur son propre site web ? Comment reproduire l’effet Barrel Roll sur vos vidéos ? Petit tour d’horizon sur cette animation.
Petit aperçu sur le do Barrel Roll de Google
Pour améliorer l’expérience de leurs utilisateurs, les développeurs de Google ont développé des petites animations très sympathiques cachées dans le navigateur Google Chrome telles que le Barrel Roll.
Do a Barrel Roll ou faire un tonneau est l’un des Easter Egg de Google apparu en 2010. Pour déclencher cette animation sur votre moteur de recherche, Rassurez-vous, vous n’avez pas besoin de tiret du 6 ou autres caractères spéciaux, il vous suffit d’insérer dans la barre de recherche de votre navigateur Google les mots suivants : “Do a Barrel Roll” ou “Z or R Twice”. Maintenant, cliquez sur entrer et Tada ! Votre écran fait un tonneau.
Si vous voulez faire une blague à vos collègues, vous pouvez répéter l’animation 10 ou 20 fois. Pour cela, tapez : “Do a Barrel Roll 10 times” ou “Do à Barrel Roll 20 times”.
Étant donné qu’il s’agit d’une pure création de Google, la rotation de l’écran en 360° est uniquement réalisable sur le navigateur ou les produits de ce géant de la recherche. D’ailleurs, si vous possédez un Chromebook, les geeks de Google, vous ont conçu un raccourci dédié spécialement pour ce genre d’animation. Pour cela, appuyez simultanément sur les touches suivantes : Ctrl, Alt, Shift et Rotate.
Remarque : Do a Barrel Roll est réalisable sur toutes les tailles d’écrans (tablette, pc, téléphone, etc.).
Réaliser le Barrel Roll sur son propre site web
En développement web, le Barrel Roll est une animation très simple à réaliser. Si vous avez un site web et que vous souhaitez amuser vos visiteurs, vous pouvez réaliser cette animation en utilisant du CSS3.
Tout d’abord, dans votre fichier CSS, commencez par donner un peu de style à votre Body. Ensuite, définissez votre animation en utilisant l’instruction @keyframes suivi du nom de votre animation. Par exemple : @keyframes rotation. Pour vous faciliter la tâche, vous pouvez copier et coller directement ce petit bout de code dans votre fichier CSS :
@keyframes rotation {
0% { transform : rotate(0deg) }
100% { transform : rotate(360deg) }
}
Une fois l’animation définie, insérez à l’intérieur de votre Body les déclarations suivantes : animation-name : rotation ; et animation-duration : 2s. Animation-duration définit la durée entre le début et la fin de l’animation.
Par ailleurs, pour répéter l’animation à l’infinie, vous pouvez insérer la ligne suivante : animation-iteration-count : infinite.
Remarque : cette animation peut être réalisée sur différents frameworks tels que Angular, React, etc.
Autres Easter Egg aussi amusant que le Barrel Roll
Vous vous en doutez bien que le Barrel Roll n’est pas la seule animation que vous pouvez réaliser sur votre page de recherche Google. Ce dernier vous réserve une panoplie de Easter Egg que nous vous conseillons absolument d’essayer. Parmi ces animations, on trouve :
- Google Gravity ;
- Google Sky ;
- Atari Breakout ;
- Zerg Rush.
L’animation Google Gravity
Google défit la gravité sur son moteur de recherche ! Pour faire flotter tous les éléments de votre page de recherche, insérer sur Google Chrome “Google gravity“, puis cliquez sur “I’m feeling lucky”. Vous pouvez utiliser votre souris pour déplacer les éléments flottants.
L’animation Google Sky
Google Sky est plus qu’une simple animation, c’est un voyage dans l’espace. Pour partir à la découverte des constellations et des étoiles, tapez sur votre barre de recherche “google sky” puis cliquez sur le lien de Google Sky. Que l’aventure commence !
Jeu/animation Atari Breakout
Atari Break est idéale durant les pauses au bureau. Si vous avez envie d’un petit jeu sympa pour décompresser, insérer sur la barre de recherche d’images de Google Chrome, “Atari breakout” ensuite, cliquez sur la première image qui s’affiche.
Jeu/animation Zerg Rush
Toujours dans la catégorie jeu, vous avez le Zerg Rush. En insérant Zerg Rush sur Google, votre écran va être envahi de 0. Le but étant ainsi de les neutraliser en cliquant dessus.
Reproduisez l’effet Barrel Roll sur vos vidéos
Vous trouvez l’effet Barrel Roll est très amusant, sachez qu’il est possible de le reproduire sur vos vidéos à condition de posséder une caméra 360. Comment ? Laissez-nous vous expliquer.
Étape 1
Commencez par télécharger une application d’édition de vidéo qui propose l’effet Barrel roll telle que Insta360.
Étape 2
Réalisez votre vidéo à l’aide d’une caméra 360 puis importez le fichier sur l’application d’édition.
Étape 3
Ouvrez la vidéo sur l’application en question puis sélectionnez la partie que vous souhaitez animer. Ceci fait, pressez longuement sur l’écran tout en faisant glisser la barre des angles qui s’affiche en bas jusqu’à ce qu’elle vous affiche 360°. Enfin, enregistrez votre vidéo et voilà !
