Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Domestika

Gráficos vectoriales SVG: ilustrar y animar con código

via Domestika

Overview

Aprende a trabajar con ilustraciones vectoriales en tus páginas web, de la línea a la animación interactiva
  • Introducción
  • SVG Básico
  • Herramientas y optimización
  • Incorporando SVG a la web
  • Efectos en SVG
  • Animación en SVG
  • Interacción y animación avanzada
  • Proyecto final
Javier Usobiaga –Diseñador Web y cofundador junto a Marta Armada del estudio Swwweet– te enseñará a sacarle el máximo partido al formato SVG (Scalable Vector Graphics) un tipo de archivo vectorial para uso en navegadores que surge como alternativa a los archivos JPG, PNG y GIF y que se caracteriza por ser escalable, interactivo y responsive. Descubrirás sus efectos, filtros y animaciones y lograrás crear ilustraciones y piezas animadas con código HTML, CSS y JavasScript.

Javier también imparte en Domestika el curso "Introducción al Desarrollo Web Responsive con HTML y CSS", en el que podrás aprender los fundamentos del Desarrollo Web Frontend, conocimientos que te vendrán muy bien como base para aprovechar al máximo este curso de gráficos vectoriales SVG.

Syllabus

  • Presentación
  • Influencias
  • Etiquetas y atributos básicos
  • Estilos en SVG
  • Etiquetas de línea, polilínea y polígono
  • Etiqueta de trazo (path)
  • El atributo viewbox
  • Etiquetas de texto
  • Editores vectoriales y exportación
  • Organización de SVG
  • Optimización de SVG
  • Formas de cargar un SVG en la web
  • Sistemas de iconos
  • SVG responsive
  • Accesibilidad en SVG
  • Soporte en navegadores
  • Transformaciones
  • Degradados
  • Patrones
  • Máscaras y clipping paths
  • Filtros
  • Tipos de animación en SVG
  • Animación con CSS
  • Animación de secuencia
  • Animación de dibujado
  • Animación interactiva
  • Animación con JavaScript
  • Librerías de JavaScript para animación
  • Checkbox animado
  • Mutación (morphing) en SVG
  • Animación a lo largo de un trazo
  • Inspiración
  • Gráficos vectoriales SVG: ilustrar y animar con código

Taught by

Javier Usobiaga Ferrer

Reviews

Start your review of Gráficos vectoriales SVG: ilustrar y animar con código

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.