SVG Vectorial Graphics: Illustrate and Animate with Code
Un curs de Javier Usobiaga Ferrer , Designer web
Learn to create vector illustrations for your website, from basic lines to interactive animations
If you've ever wanted to combine the technical power of web programming and the creative freedom of graphic design, this course is for you. Javier Usobiaga, web designer and cofounder of Swwweet studio, teaches you how to get the most out of scalable vector graphics (SVG), an interactive and responsive vector file format designed for web browsers as an alternative to JPG, PNG, and GIF file types. In this online course, discover the effects, filters, and animations you can use to create your own interactive illustrations with HTML, CSS, and JavaScript code.
Javier also teaches Introduction to Responsive Web Development with HTML and CSS on Domestika, a course that walks you through the fundamentals of front-end web development and helps you build the foundations you need for this course on SVG.
Ce vei învăța în acest curs online?
1 lecție & 1 descărcare
- 98% recenzii pozitive ( 273 )
- 1 elev
- 1 lecție ( 1 oră 1 metru )
- 1 resursă suplimentară (1 fișier)
- Online și în ritmul tău propriu
- Disponibil în aplicație
- Sunet: Spaniolă, Engleză, franceză, italian, Portugheză, turc
- Spaniolă · Engleză · Portugheză · german · franceză · italian · Lustrui · Olandeză · turc · Română · Indoneziană
- Nivel: Începător
- Acces nelimitat pentru totdeauna
Software și instrumente recomandate pentru acest curs
Adobe Illustrator
SketchCare este proiectul acestui curs?
Create an illustration with animated vector images. You can choose any theme you like and make your project as simple or as complex as you want; the goal is for you to apply the tools explored throughout the course.
Proiecte ale studenților cursului
Pentru cine este acest curs online?
Programmers, designers, illustrators, and anyone who's interested in design and wants to tackle new projects with HTML and CSS.
Cerințe și materiale
You need basic knowledge of HTML and CSS to take this course.
As for materials and tools, you need a computer, a code editor, and a vector-graphics editor like Illustrator, Sketch, Inkscape, or similar software.
Recenzii
Javier Usobiaga Ferrer
Un curs de Javier Usobiaga Ferrer
Javier Usobiaga este designer web și dezvoltator front-end de peste 10 ani. Este co-fondator, împreună cu Marta Armada, al studioului Swwweet, specializat în proiectarea de site-uri web responsive, de la concepția inițială până la dezvoltarea front-end...
Conţinut
-
U 1
Introduction
-
Presentation
-
Influences
-
-
U 2
SVG Basic
-
Labels and basic attributes
-
Styles in SVG
-
Line, polyline, and polygon labels
-
Stroke label (path)
-
The viewbox attribute
-
Text tags
-
-
U 3
Tools and optimization
-
Vector editors and export
-
Organization of SVG
-
SVG optimization
-
-
U 4
Incorporating SVG to the web
-
Ways to load an SVG on the web
-
Icons systems
-
SVG responsive
-
Accessibility in SVG
-
Support in browsers
-
-
U 5
Effects in SVG
-
Transformations
-
Gradients
-
Patterns
-
Masks and clipping paths
-
Filters
-
-
U 6
Animation in SVG
-
Types of animation in SVG
-
Animation with CSS
-
Sequence animation
-
Drawn animation
-
Interactive animation
-
-
U 7
Interaction and advanced animation
-
Animation with JavaScript
-
JavaScript libraries for animation
-
Animated checkbox
-
Mutation (morphing) in SVG
-
Animation along a stroke
-
Inspiration
-
-
FP
Proiect final
-
SVG vector graphics: illustrate and animate with code
-
La ce să te aștepți de la un curs Domestika
-
Învață în ritmul tău propriu
Bucură-te de învățarea de acasă, fără un program fix și cu o metodă ușor de urmat. Tu îți stabilești propriul ritm.
-
Învață de la cei mai buni profesioniști
Învață metode și tehnici valoroase explicate de experți de top din sectorul creativ.
-
Întâlnește profesori experți
Fiecare expert predă ceea ce face cel mai bine, cu îndrumări clare, pasiune adevărată și perspicacitate profesională în fiecare lecție.
-
Certificate
PlusDacă ești membru Plus, primești un certificat personalizat semnat de profesorul tău pentru fiecare curs. Distribuie-l în portofoliul tău, pe rețelele sociale sau oriunde dorești.
-
Obțineți locuri în primul rând
Videoclipuri de cea mai înaltă calitate, pentru a nu rata niciun detaliu. Cu acces nelimitat, le poți viziona de câte ori este nevoie pentru a-ți perfecționa tehnica.
-
Împărtășește cunoștințe și idei
Pune întrebări, solicită feedback sau oferă soluții. Împărtășește-ți experiența de învățare cu alți studenți din comunitate care sunt la fel de pasionați de creativitate ca și tine.
-
Conectează-te cu o comunitate creativă globală
Comunitatea găzduiește milioane de oameni din întreaga lume, curioși și pasionați de explorarea și exprimarea creativității lor.
-
Urmărește cursuri produse profesional
Domestika își gestionează lista de profesori și produce fiecare curs intern pentru a asigura o experiență de învățare online de înaltă calitate.
Întrebări frecvente
Care sunt cursurile online Domestika?
Cursurile Domestika sunt cursuri online care îți permit să înveți noi abilități și să creezi proiecte incredibile. Toate cursurile noastre includ oportunitatea de a-ți împărtăși munca cu alți studenți și/sau profesori, creând o comunitate de învățare activă. Oferim diferite formate:
Cursuri originale : Cursuri complete care combină videoclipuri, texte și materiale educaționale pentru a finaliza un proiect specific de la început până la sfârșit.
Cursuri de bază : Instruire specializată în care stăpânești pas cu pas instrumente software specifice.
Cursuri de specializare : Trasee de învățare cu diverși profesori experți pe aceeași temă, perfecte pentru a deveni specialist învățând din diferite abordări.
Cursuri ghidate : Experiențe practice ideale pentru dobândirea directă a unor competențe specifice.
Cursuri intensive (Deep Dives) : Noi procese creative bazate pe instrumente de inteligență artificială într-un format accesibil pentru o înțelegere aprofundată și dinamică.
Când încep cursurile și când se termină?
Toate cursurile sunt 100% online, așa că, odată publicate, cursurile încep și se termină oricând dorești. Tu stabilești ritmul cursului. Poți reveni pentru a recapitula ceea ce te interesează cel mai mult și să sari peste ceea ce știi deja, poți pune întrebări, poți răspunde la întrebări, poți împărtăși proiectele tale și multe altele.
Ce includ cursurile Domestika?
Cursurile sunt împărțite în diferite unități. Fiecare include lecții, texte informative, sarcini și exerciții practice care să te ajute să-ți realizezi proiectul pas cu pas, cu resurse suplimentare complementare și descărcări. De asemenea, vei avea acces la un forum exclusiv unde poți interacționa cu profesorul și cu alți studenți, precum și să-ți împărtășești munca și proiectul de curs, creând o comunitate în jurul cursului.
Ți s-a dat vreun curs?
Poți valorifica cursul primit accesând pagină de valorificare și introducând codul cadou.
Adobe Illustrator
Sketch
Muy puntual, da la clase muy bien y es entendible, con ejercicios faciles y buenos.
EXCELENTE CURSO
Gostei muito
excellent course for beginners.
excelente curso lo recomiento explica muy bien y se entiende todo