Blog
17/06/2019

Graphiques SVG : illustrer et animer avec du code

Vous vous demandez comment sont créés les graphiques animés que l’on voit sur certains sites web ? Ce cours est fait pour vous : le cours sur les graphiques SVG pour illustrer et animer avec du code est désormais disponible.

SVG, pour Scalable Vector Graphics, est un format de graphisme vectoriel 2D qui peut être statique ou animé. C’est l’une des solutions les plus recommandées pour intégrer des illustrations sur le web.

Graphiques SVG : illustrer et animer avec du code

 

Exploitez tout le potentiel du format SVG et améliorez l’expérience utilisateur de vos créations web.

Ça vous tente ?

Que vais-je apprendre dans le cours Graphiques SVG : illustrer et animer avec du code ?

Dans le cours Graphiques vectoriels SVG pour illustrer et animer avec du code, vous apprendrez à intégrer des illustrations vectorielles sur vos sites web, en explorant l’animation interactive.

Le cours dure 2h02 et vous guide pas à pas, des bases du format SVG à la réalisation d’un projet complet.

Vous apprendrez à :

  • Découvrir le format SVG
  • Appliquer des styles via les attributs et le CSS
  • Utiliser les balises ligne, polyligne, polygone, tracé pour courbes, droites et points
  • Maîtriser l’attribut viewbox pour les fenêtres virtuelles
  • Optimiser, éditer, grouper, définir et réutiliser des éléments SVG grâce à des outils dédiés
  • Intégrer des SVG dans vos pages web
  • Créer des effets SVG

 

Ne ratez pas ce cours et apprenez à créer des graphiques vectoriels SVG pour illustrer et animer avec du code vos projets web.

Comment ça se passe ?

Le projet du cours consiste à réaliser une illustration avec des éléments vectoriels animés.

Le thème est libre et le niveau de difficulté dépend de vous : choisissez un projet simple ou ambitieux, et mettez en pratique tous les outils abordés pendant la formation.

montaje-curso-de-la-semana

De quoi ai-je besoin pour suivre le cours ?

Il vous suffit d’un ordinateur, d’un éditeur de code et d’un logiciel de graphisme vectoriel (Illustrator, Sketch, Inkscape ou équivalent).

Avec ça et un peu de motivation, vous deviendrez incollable sur le SVG !

Ce cours est-il fait pour moi ?

Pour profiter pleinement du cours sur les graphiques vectoriels SVG pour illustrer et animer avec du code, il est recommandé d’avoir des notions de base en HTML et CSS.

Ce cours s’adresse tout particulièrement aux :

  • Graphistes
  • Créatifs
  • Illustrateurs
  • Développeurs
  • Intégrateurs
  • Webdesigners

Qui est le formateur ?

Une fois de plus, Javier Usobiaga, notre expert en design et développement web, vous accompagnera tout au long du cours.

Javier est webdesigner depuis plus de 10 ans et cofondateur, avec Marta Armada, du studio Swwweet, spécialisé dans le design web responsive.

Il anime également des workshops à Elisava et IDEP : autant dire qu’il a toutes les qualités pour être le formateur idéal.

N’hésitez plus et…

Inscrivez-vous dès maintenant !

À propos de Domestika

Avec plus d’un million de créatifs, Domestika est la plateforme idéale pour partager et apprendre sur tous les sujets qui vous passionnent.

Vous avez aimé ?
Abonnez-vous
Articles connexes
On commence à travailler
sur votre projet ?

Nous analysons votre situation actuelle et définissons la prochaine étape.

Contactez maintenant
Notre site utilise des cookies pour collecter des informations sur votre appareil et votre activité de navigation. Nous utilisons ces données pour améliorer le site, assurer la sécurité et fournir un contenu personnalisé. Vous pouvez gérer vos préférences en matière de cookies en cliquant ici.
Accepter les cookies Installation Rejeter les cookies
Informations de base sur les cookies
Ce site Web utilise des cookies et/ou des technologies similaires qui stockent et récupèrent des informations lorsque vous naviguez. De manière générale, ces technologies peuvent avoir des finalités très différentes, comme par exemple vous reconnaître en tant qu'utilisateur, obtenir des informations sur vos habitudes de navigation ou personnaliser la manière dont les contenus sont affichés. Nos utilisations spécifiques de ces technologies sont décrites ci-dessous. Par défaut, tous les cookies sont désactivés, à l'exception des cookies techniques, nécessaires au fonctionnement du site. Si vous souhaitez plus d'informations ou exercer vos droits en matière de protection des données, vous pouvez consulter notre Política de cookies".
Accepter les cookiesInstallation
Cookies techniques nécessaires Toujours actif
Les cookies techniques sont strictement nécessaires au fonctionnement de notre site Internet et à votre navigation. Ces types de cookies sont ceux qui, par exemple, nous permettent de vous identifier, vous donnent accès à certaines parties restreintes de la page si nécessaire, ou mémorisent différentes options ou services déjà sélectionnés par vous, comme vos préférences de confidentialité. Ils sont donc activés par défaut et votre autorisation n’est pas nécessaire. En configurant votre navigateur, vous pouvez bloquer ou vous alerter de la présence de ce type de cookies, même si ce blocage affectera le bon fonctionnement des différentes fonctionnalités de notre site Internet.
Cookies de análisis
Las cookies de análisis son las utilizadas para llevar a cabo el análisis anónimo del comportamiento de los usuarios de la web y que permiten medir la actividad del usuario y elaborar perfiles de navegación con el fin objetivo de mejorar los sitios web.
Cookies publicitarias
Las cookies publicitarias permiten la gestión de los espacios publicitarios de la web. Además, estas cookies pueden ser de publicidad personalizada y permitir así la gestión de los espacios publicitarios de la web en base al comportamiento y hábitos de navegación de usuario, de donde se obtiene su perfil y permiten personalizar la publicidad que se muestra en el navegador del usuario u otros perfiles y redes sociales del usuario.
Confirmer les préférences
Contactez-nous
Formulaire

Racontez-nous
votre projet

Indiquez le contexte général de votre organisation et la portée prévue du projet.
Code Barcelona, ​​​​en tant que responsable du traitement de vos données, les traitera afin de répondre à la question et/ou à la demande que vous nous adressez via ce formulaire de contact. Vous pouvez exercer vos droits d'accès, de rectification, de suppression, ainsi que d'autres droits en consultant les informations complémentaires détaillées sur la Protection des Données dans notre politique de confidentialité.
Title
Popupcontent
Analyse de votre situation numérique

Nous examinerons votre situation numérique actuelle. Nous vous contacterons pour comprendre votre contexte et évaluer ensemble les domaines à analyser, puis nous préparerons un audit avec les points clés et les recommandations.

Code Barcelona, ​​​​en tant que responsable du traitement de vos données, les traitera afin de répondre à la question et/ou à la demande que vous nous adressez via ce formulaire de contact. Vous pouvez exercer vos droits d'accès, de rectification, de suppression, ainsi que d'autres droits en consultant les informations complémentaires détaillées sur la Protection des Données dans notre politique de confidentialité.
Aceptar