Le retour du Gif en webdesign

16 mars 2014 / Inspiration / 11 commentaires

Alors qu’il était synonyme de ringardise dans le web des années 90/2000, le Gif revient sur le devant de la scène.

Cet article est un guest-post rédigé par Bono Peppers. Plus d’infos sur l’auteur à la fin de l’article.

En effet, on retrouve de plus en plus de gifs dans des présentations de sites (du style Dribbble), de concepts mobile, d’applications, de courtes animation en motion design,… Mais également dans le webdesign : léger, il permet parfois d’ajouter une petite touche d’animation sans être trop lourd en poids, ni obliger l’internaute à cliquer pour lancer une vidéo.

Exemples d’utilisation en webdesign

Singe

Ce premier site, Le singe qui fume sa cigarette est un bel exemple de « cinémagraphie » : un mélange subtil entre photo et vidéo, sous forme de gif. Si vous êtes amateur du genre, je vous conseille d’ailleurs d’aller voir le tumblr de Julien Douvier (dont je n’ai pas put m’empêcher de vous poster quand même quelques uns de ces travaux ici).

Gif-Working-Late_600 Manequin_600 Parapluie_600 Pluie-immeubles_600 tableau-mange-600 tumblr_n26px9iWE41s85u2fo2_r1_500 tumblr_n2607wqpTm1s85u2fo1_500

Quant au second site ci-dessous, il présente un deuxième aspect très intéressant du gif : illustrer un article, une présentation, une infographie avec un visuel animé d’une durée très courte, léger au chargement, et qui tourne en boucle. Il permet ainsi d’avoir l’information directement liée à l’animation, le tout sans être obligé de lancer une vidéo.

Quelques exemples de présentations de concepts

Cette technique est de plus en plus utilisée pour la présentation de sites, de concept d’interaction ou d’applications : voici donc des exemples que vous pouvez retrouver sur Dribble (ou via Panda).

wfkit2-promo2 website ui_pull thumbnail tbipadconcenpt simple_home_page shotb shot-login risen_mobile_nav responsive_menu_dribbble movie london-pub-crawl-interaction jfk_animatic gt_leftnav2 greenpoint (1) gaget_11 drb-coin-animation-2 demo3-0.05 (1) contact-button athleteminder-dribbble-jm add-tags (1) 2014-01-09_22_56_56 2013-11-25_19_14_13

searchbar-3

Plus simple qu’une vidéo, léger au chargement : le gif est un nouveau moyen de présenter ses maquettes ou ses concepts graphiques.

Et vous, quand est-ce que vous vous mettez au gif ?

À propos de l’auteur :

Bono PeppersBono Peppers

Thomas Bonometti aka Bono Peppers graphiste et webdesigner strasbourgeois. « Tartine à l’Helvetica Neue et Jus de Responsive au petit Déj’, je réalise depuis plus d’un an différents projets professionnels dans le domaine du web, du print et du multimédia. »

bonopeppers.fr / @Bono_Peppers

11 commentaires

Laisser un commentaire :

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

*

Copyright © 2025 - Webdesignertrends.com Le contenu rédactionnel du site est la propriété de Webdesigner Trends et de ses auteurs respectifs. Les oeuvres diffusées sur Webdesigner Trends sont la propriété de leur créateur respectif.