Comment créer un site Web ou un blog en 2020 - Guide gratuit et facile pour créer un site Web

La petite tendance de l’animation courte dans la conception web

L’animation s’est taillé une niche dans la conception web. On le voit partout. Il enrichit non seulement les zones de héros, mais aussi d’autres sections, pages internes et composants indépendants.

Ce n’est plus seulement un outil pour faire la première impression. Collaborez efficacement avec d’autres éléments, élargissant considérablement sa sphère. Oui, il a perdu son facteur de nouveauté: c’est maintenant quelque chose de normal comme le bouton hamburger, l’arrière-plan vidéo ou le décalage de parallaxe. Cependant, même si ce n’est plus une extravagance, il a toujours la capacité d’impressionner les visiteurs en ligne.

Comme tout élément intégral de l’interface utilisateur, l’approche animée est sujette aux tendances. Il y a plusieurs années, nous avons assisté à de nombreuses animations de particules, puis des animations GSAP animaient le spectacle.

Les développeurs préfèrent de nos jours utiliser des animations courtes au lieu de longues. La raison est simple. Le monde évolue rapidement et les gens préfèrent des solutions rapides. Ils veulent obtenir des réponses tout de suite. Et les courtes animations se mélangent idéalement.

Ils offrent un moyen assez rapide et discret d’atteindre un public en ligne. Ils ne tarderont pas et iront droit au but. De plus, ils font une impression et en même temps laissent le contenu au premier rang. Ce sont des outils idéaux pour renforcer les messages que vous souhaitez transmettre.

Prenons quelques exemples fantastiques où les développeurs tirent le meilleur parti de courtes animations. Ils exploitent habilement cette petite tendance pour rendre leurs projets stylés et rendre l’expérience utilisateur agréable.

Syscoin

Syscoin traite des blockchains, un problème qui peut être un peu intimidant pour les personnes ayant des difficultés techniques. Ici, l’animation courte est utilisée pour alléger les choses, soutenir la devise dans la zone des héros et combler le fossé entre le service et les utilisateurs réguliers. Avec de nombreuses illustrations élégantes dispersées sur le site Web, il transforme des concepts complexes en concepts simples. Cela rapproche le projet de votre public.

Syscoin

Le panda numérique

Contrairement à l’exemple précédent, The Digital Panda est un site Web d’entreprise standard pour une agence de création. Il n’y a rien d’ambigu à ce sujet. Cependant, l’équipe a décidé d’utiliser l’approche animée pour rendre les choses encore plus apparentes. Ils l’utilisent pour présenter leur routine commerciale quotidienne de manière fantaisiste. Ici vous pouvez voir une courte animation où deux adorables pandas sont impliqués dans le processus de développement.

Le panda numérique

CAMO

L’équipe derrière CAMO a adopté la même tactique. La zone des héros de votre site Web présente une petite illustration qui se déplace intelligemment. Il permet de soutenir le message de gauche et de clarifier le domaine d’expertise de l’entreprise pour les utilisateurs. Et surtout, il sert de matériel d’accompagnement qui ne détourne pas l’attention d’autres choses importantes.

CAMO

Zapare Tech / Ensemble

Zapare Tech et Together utilisent des animations de plus en plus courtes. Cependant, il suffit de diffuser l’idée et de créer le bon sentiment pour le public cible. Les deux sites Web ont des lieux de travail et des personnes qui participent à une routine quotidienne au bureau.

Alors que Zapare Tech montre une petite équipe de personnes qui collaborent à une tâche, l’équipe Together a décidé de montrer une vue rapprochée d’un travailleur individuel engageant le dialogue avec un coéquipier.

Dans les deux situations, vous pouvez voir de petites illustrations où seuls des détails spécifiques ont été apportés à la vie. Cependant, ces détails dynamiques font la différence. Ils ramènent à la maison le bon message. De plus, ils créent suffisamment d’esthétique pour compléter le design également.

Zapare Tech

Ensemble

Gegenbauer

Les exemples mentionnés ci-dessus se concentrent sur une situation spécifique dans la vie de l’agence. Cependant, l’équipe créative de Gegenbauer a décidé de démontrer non pas un, mais plusieurs départements de l’entreprise.

Au début, l’œuvre d’art bouge à peine, seuls quelques détails mineurs bougent. Cependant, lorsque l’utilisateur sélectionne le département en plaçant le curseur de la souris dessus, cette partie devient dynamique. Les personnages commencent à bouger et les gadgets commencent à fonctionner. De plus, toutes les autres parties de l’illustration sont floues pour donner une netteté nette à la partie sélectionnée.

Il s’agit d’un excellent exemple de symbiose entre un élément interactif et une courte animation. Non seulement cela crée une atmosphère professionnelle, mais cela ajoute également du plaisir à l’expérience.

Gegenbauer

Auvent créatif

Il s’agit d’une représentation vivante d’une interface entièrement illustrée. Pour certaines entreprises, cela pourrait être trop. Mais ce n’est pas le cas pour l’équipe Creative Canopy. Son site officiel regorge de courtes animations.

Les créatifs ont donné vie non seulement à des scènes entières, mais aussi à des icônes d’accompagnement et à de petits dessins. Il en résulte une expérience utilisateur cohérente. Malgré le nombre d’animations, sa courte durée de vie rend l’exploration du projet agréable et discrète, plutôt qu’écrasante et ennuyeuse.

Auvent créatif

Mutify pour Mac

Ici, vous ne trouverez aucune illustration. Contrairement aux sites mentionnés ci-dessus, Mutify pour Mac mise sur les images et les maquettes pour être son principal moteur visuel. Cependant, pour éviter une apparence statique globale, l’équipe a utilisé une courte animation qui sauve la journée.

En conséquence, la zone des héros dégage une énergie et une vitalité inhérentes à l’industrie de la musique. Il est parfaitement compatible avec le thème général et constitue un excellent environnement pour promouvoir une application.

Mutify pour Mac

Éditeur de cortex

L’équipe derrière Cortex Copywriter présente sa vision de la plaque signalétique de l’entreprise à l’aide d’une petite illustration animée avec une forte ambiance technologique. De cette façon, le message est bien communiqué et le sujet se sent vivant.

Éditeur de cortex

Un petit mouvement peut aller loin

Admettez-le, quoi qu’il arrive, les gens aiment les animations. Ils peuvent être très utilisés et même stupides, mais les gens les aiment quand même. Ils sont comme des dessins animés, et qui n’aime pas les dessins animés? C’est un peu de magie de notre enfance qui favorise les émotions positives à un niveau subconscient.

Les animations courtes gagnent du terrain. C’est une tendance avec un avenir prometteur. Étant assez concis, il va droit au but. Avec l’approche illustrative, il est capable de rendre le monde numérique moins “froid” et “plus chaud”.

Table of Contents