\n Lexusls.asia<\/a> est une filiale de Toyota qui vend des voitures de luxe. Sur le site Web, les concepteurs ont brillamment utilis\u00e9 le d\u00e9filement parallaxe pour pr\u00e9senter la voiture avec juste assez de texte pour faire avancer le visiteur. Puis tout \u00e0 coup un pneu roule depuis la droite et montre d’autres caract\u00e9ristiques int\u00e9ressantes de la voiture. Au fur et \u00e0 mesure que vous faites d\u00e9filer vers le bas, le site Web ne vous l\u00e2che pas et, avec quelques graphismes sympas, d\u00e9crit le but et les avantages de la voiture.\n<\/p>\n \n Le langage visuel a la capacit\u00e9 de puiser dans les fondements m\u00eames de la conception centr\u00e9e sur l’humain. Le langage visuel remonte \u00e0 loin et m\u00eame avant l’invention de tout alphabet, car les peintures rupestres \u00e9taient le moyen de communication de base. Les peintures rupestres ont servi de source de narration, de guide pour survivre et \u00e9viter les dangers potentiels qui faisaient partie de cette p\u00e9riode. Plus ou moins, les dessins rupestres sont la forme la plus ancienne de donn\u00e9es visuelles.\n<\/p>\n \n Nous savons que les images et les vid\u00e9os d\u00e9tiennent un grand pouvoir de communication, comment exploiter ce pouvoir \u00e0 travers les pixels ?\n<\/p>\n \n Exemple<\/strong> :\n<\/p>\n \n C’est alors que votre propre imagination entre en jeu. Ajoutez des images et des vid\u00e9os avec le bon m\u00e9lange de texte pour que votre site Web parle de lui-m\u00eame.\n<\/p>\n \n Bellroy.com<\/a> vend ses portefeuilles en cuir avec la garantie d’un plus grand espace avec des designs plus minces. Comment ils le montrent \u00e0 travers un \u00e9l\u00e9gant curseur avec des images HD de l’un de leur portefeuille contre un autre. Au fur et \u00e0 mesure que le curseur se d\u00e9place, l’histoire le fait aussi et dans les 10 images, le m\u00eame nombre de cartes est ins\u00e9r\u00e9 dans leur portefeuille de marque tout en d\u00e9formant l’autre portefeuille plus qu’il ne l’est r\u00e9ellement. Ici la conclusion est saisissante et avec une morale \u00e0 revendre.\n<\/p>\n \n C’est assez similaire \u00e0 l’\u00e9criture d’une pi\u00e8ce de th\u00e9\u00e2tre lorsque vous concevez une histoire visuelle. Tous les aspects et \u00e9l\u00e9ments de la pi\u00e8ce sont pr\u00e9sents sur votre site et s’entrem\u00ealent avec une telle intimit\u00e9 qu’ils se confondent compl\u00e8tement avec l’histoire que vous avez introduite. Votre histoire commence par la configuration que vous avez arrang\u00e9e, puis se dirige vers le conflit et se termine par une r\u00e9solution.\n<\/p>\n \n Ce site a par exemple une fa\u00e7on unique de prendre le visiteur par le bras et de l’inviter \u00e0 un bal rempli d’\u00e9motions et de plaisirs visuels.\n<\/p>\n \n Les utilisateurs doivent \u00eatre bien conscients de l’histoire car elle les conduit \u00e0 leur destination. Et c’est l\u00e0 que le visiteur devient le prospect, et le prospect devient le client. Il est juste que le produit ou le service que vous envisagez de pr\u00e9senter dans le cadre du processus de narration ait quelque chose dont l’utilisateur a besoin, une fonctionnalit\u00e9 unique ou une marge de prix que le client recherche.\n<\/p>\n \n Exemple<\/strong> :\n<\/p>\n \n Bagigia.com<\/a> donne d’abord au visiteur une pr\u00e9sentation du d\u00e9taillant, suivie d’une imagerie 3D simple mais profonde du produit lui-m\u00eame avec un texte \u00e9motionnel pour garder l’histoire en mouvement. Le large espacement blanc dans la conception aide l’utilisateur \u00e0 se concentrer car le produit se d\u00e9marque au centre, amenant l’histoire \u00e0 l’action et \u00e0 la r\u00e9solution.\n<\/p>\n \n C’est vrai. L’animation de sites Web a \u00e9t\u00e9 victime d’une surutilisation sans aucun respect des conventions ou des normes et c’est la principale raison de sa chute au cours des 5 derni\u00e8res ann\u00e9es. Ironiquement, tr\u00e8s peu de concepteurs savent comment l’utilisation d’une animation intelligente et pr\u00e9cise peut transformer votre histoire en film Dark Knight. L’animation est con\u00e7ue pour couvrir ce que les images statiques ne peuvent pas compl\u00e9ter, tout en ajoutant de l’amusement \u00e0 la conception elle-m\u00eame.\n<\/p>\n \n Exemple<\/strong> :\n<\/p>\n \n En parlant de DarkKnight, cette application pour iOS sur benthebodyguard.com<\/a> vous permet de s\u00e9curiser et de crypter les informations de votre site Web qui pr\u00e9sente une animation pas \u00e0 pas (litt\u00e9ralement) lorsque vous descendez avec \u00ab Ben \u00bb au milieu, le garde du corps qui a jur\u00e9 de prot\u00e9ger vos informations avec une formidable r\u00e9putation. Ce site Web a illustr\u00e9 comment l’animation peut \u00eatre utilis\u00e9e au mieux pour produire l’histoire id\u00e9ale pour un produit.\n<\/p>\n \n N’\u00eates-vous pas surpris de voir comment un design qui est simplement un m\u00e9lange d’arts visuels et de graphisme peut produire de l'empathie en vous ? Je sais que j’ai. En tant qu’\u00eatres humains, nous r\u00e9agissons \u00e0 nos sens animaux autant que tout autre organisme qui est fid\u00e8le \u00e0 sa nature. Quand nous voyons une idole, nous faisons comme pr\u00e9vu. En capitalisant sur cette caract\u00e9ristique du comportement humain, votre histoire ne doit pas toujours faire le buzz sur votre manifeste et vos produits, car c’est probablement ce que tous les autres propri\u00e9taires de sites Web ont en t\u00eate ces jours-ci. Lorsque vous ajoutez un sens du sentiment, de l’esprit et de la morale, votre histoire se transforme en message.\n<\/p>\n \n Exemple<\/strong> :\n<\/p>\n \n Ce site Web everylastdrop.co.uk<\/a> vous emm\u00e8ne dans un voyage de votre utilisation quotidienne de l’eau dans votre maison et ses environs. Lire des faits sur la quantit\u00e9 d’eau gaspill\u00e9e chaque jour est trop courant et n’est souvent jamais pris au s\u00e9rieux. Ce petit gars innocent qui utilise l’eau sans discernement dans son emploi du temps quotidien souligne non seulement l’importance de l’eau, mais la met \u00e9galement en contraste avec ceux qui en ont le plus besoin dans les r\u00e9gions difficiles du monde. Cela grandit tellement dans l’esprit du spectateur qu’il r\u00e9fl\u00e9chirait probablement \u00e0 deux fois avant de gaspiller une autre goutte d’eau la prochaine fois.\n<\/p>\n \n Les romans sont amusants \u00e0 lire et avec les r\u00e9centes ascensions technologiques, il est maintenant n\u00e9cessaire qu’ils soient lus \u00e0 partir de livres. M\u00eame \u00e0 ce jour, une grande majorit\u00e9 d’utilisateurs en ligne pr\u00e9f\u00e8rent toujours juger le livre par sa couverture plut\u00f4t que de lire le prologue. Pour s’attaquer \u00e0 ces utilisateurs en ligne et les attirer vers le produit, de nombreux \u00e9crivains engagent souvent des d\u00e9veloppeurs pour cr\u00e9er des sites Web d\u00e9di\u00e9s \u00e0 leurs romans. Une r\u00e9p\u00e9tition pas \u00e0 pas du roman avec des s\u00e9quences anim\u00e9es donnera non seulement \u00e0 l’histoire le feu d’artifice dont elle a besoin, mais incitera \u00e9galement l’internaute \u00e0 la lire.\n<\/p>\n \n Exemple<\/strong> :\n<\/p>\n \n Utilisant le m\u00eame principe et la m\u00eame structure, la nouvelle acclam\u00e9e de Nam Le \u00ab\u00a0The Boat\u00a0\u00bb a \u00e9t\u00e9 convertie en un roman graphique interactif en cr\u00e9ant un monde de temp\u00eate ravageant l’oc\u00e9an for\u00e7ant un bateau \u00e0 \u00e9chapper aux terreurs de la guerre du Vietnam. La meilleure chose que n’importe qui puisse faire dans sa f\u00eate de la narration est d’ajouter du son \u00e0 sa conception. C’est le superlatif du storytelling anim\u00e9 pour acqu\u00e9rir l’UX. Voir ici<\/a>.\n<\/p>\n \n Engag\u00e9 et rempli d’illustrations, c’est vraiment la preuve de la fa\u00e7on dont vous pouvez g\u00e9rer un produit en cr\u00e9ant un design qui bouge au fur et \u00e0 mesure que vous interagissez avec lui.\n<\/p>\n \n Dans l’industrie du commerce \u00e9lectronique, les gens sont souvent int\u00e9ress\u00e9s \u00e0 obtenir les avantages d’un produit qui peut \u00eatre utilis\u00e9 sur plusieurs instances mais pour la m\u00eame raison. D’une part, cela leur facilite grandement la vie, et d’autre part, cela fait partie de l’\u00e8re technologique. Mais avec tant de choses \u00e0 apprendre et \u00e0 reconna\u00eetre sur une entreprise comme celle-ci, il est tr\u00e8s peu probable que les clients prennent un risque dans quelque chose qui a des implications futuristes et sert leur objectif trop facilement, ce qui le rend trop beau pour \u00eatre vrai. J’ai vu des entreprises qui ont essay\u00e9 de vendre de tels produits avec trop d’accord et le r\u00e9sultat a \u00e9t\u00e9 un abandon tragique.\n<\/p>\n \n Exemple<\/strong> :\n<\/p>\n\n Langage visuel
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-272442-6382745d3debe.webp\")
<\/a><\/p>\n\n Concevoir l’histoire
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-272442-6382745f45d06.webp\")
<\/a><\/p>\n\n Utiliser l’histoire anim\u00e9e \u00e0 votre avantage
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-272442-63827460e07ae.webp\")
<\/a><\/p>\n\n Traduire le message de conception
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-272442-63827463020e7.webp\")
<\/a><\/p>\n\n Utiliser des \u00e9l\u00e9ments sombres
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-272442-638274657f38e.webp\")
<\/a><\/p>\n\n Unification du d\u00e9filement traversant
\n<\/h5>\n
![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-272442-638274683f667.webp\")
<\/a><\/p>\n