Векторна графіка та SVG. АНІМАЦІЯ на ВЕБ сторінках

Привітос! Сьогодні я поділюся з тобою підходами в роботі з векторною графікою та SVG. А саме як швидко і легко зрозуміти мову розмітки SVG, навчитись базової анімації та як вміти використовувати ці знання на практиці. Пиши у коментарях, про що тобі цікаво було б почути у моїх наступних відео!

Ком'юніті:

Корисні посилання:

Зміст:
00:00 Інтро
00:40 Що таке векторна графіка
02:21 Формат SVG
03:47 Варіанти імпорту SVG
07:21 Як анімувати SVG
13:10 Підсумки

Додавайтесь у соціальних мережах:

#SVG #ВекторнаГрафіка #фронтенд #анімація #YuriyDetsyk

[yuriydetsyk]

Пишіть, кому до вподоби робота із SVG + CSS :)

[dickermax]

нарешті, офігений україномовний айті блог, привіт від @ua_programer з інсти, його реклама
сподіваю ми зможемо тебе розкрутити до підписників за рік

[volodymyr_bro]

Також цікаво, хотілося б більше прикладів!)

[NazarMarchuk]

Цікаво, ніколи в житті не доводилось працювати з анімаціями svg, виглядає легко і просто, але розумію що це так завжди тільки на початку :)

[Tory_dev]

Цікава анімація) Хотілося би ще дізнатися про роботу із svg sprite)

[kovalyurii]

Дякую за цікаве відео) Ніколи раніше не задумувався над тим як працюють svg-шки)

[grkebbl]

У всьому інтернеті раніше не здибав інформацію, що svg можна юзати в html) Клас)

[rostyslavputas]

Круто, цікаво було б подивитись на складніших ще прикладах

[dordaderabar]

3:15 Дизайном не займаюсь, а для себе користуюсь Inkscape на Лінукс.
Дякую за цікаве відео

[PUBLICandSTATIC]

це цікаво, було б класно побачити більш підробний випуск про SVG та анімацію 👍

[andriysalahub]

СуперКласно!
Соррі, не було мене певний час...:((
Питання, як просто без вимахувань поміняти колір через css, svg-ну графіку (славнозвісний атрибут "fill"). На stackoverflow є декілька варіантів, досить простих, але у випадку прямого вкладання всіх параметрів малюнку (так як зробив ти у відео) але коли відбувається прив'язка файлу через тег ІМG, тут виникають певні складнощі, щось воно не паше (тільки відкриваючи сам файлик і хардкордно міняти-дописувати значення атрибуту fill). Щось порадиш? Є якісь варіанти? Особливо складно коли використовується sass або less, можна заплутатись

[maxstotsky]

Ще для SVG є анімаційні теги, які моно використовувати замість анімації CSS

[Olexander_Koziianchuk]

Так от як ви це робите... Капееець.. Круто! І за це гроші платять? Як називається ця професія? І чи є попит на таких спеціалістів?

[fdltxbx]

А можете зробити відос про рекурсію?Для людей які тільки починають.

[vladyslavpanarin]

Будь ласка, перестаньте використовувати слово «приміняти»
Це московська мова
Застосовувати правильно буде