SVG
HD
14:22
автор Kevin Powell дата 20.06.2018
- 23253
- 848
- 12
There are a lot of good reasons that we should be using SVGs, but they can seem complicated and scary. This video, which is part one of a mini-series exploring SVGs, looks at why we should be using SVGs and what they actually are (it stands for scalable vector graphic), and then the absolute, very basics of using them in your work.
This video will be followed up by how to make your own SVGs, creating an icon system and adding in some basic animations.
Also, I had some video issues with this one, so sorry for any quality issues. Already figured out the cause and it'll be fixed for the next video :). I also TOTALLY missed a part with the greenscreen, haha. Ooops.
Inkscape (for vector software): https://inkscape.org/en/
Some useful SVG links that have helped me in the past and with researching for this series:
http://unicorn-ui.com/blog/svg-for-beginners.html
https://rafaltomal.com/svg-guide/
https://css-tricks.com/using-svg/
https://css-tricks.com/svg-line-animation-works/
https://css-tricks.com/svg-use-with-external-reference-take-2/
http://taye.me/blog/svg/a-guide-to-svg-use-elements/
https://frontstuff.io/multi-colored-svg-symbol-icons-with-css-variables
---
New to Sass, or want to step up your game with it? I've got a course just for you: https://www.kevinpowell.co/learn-sass
---
My Code Editor: VS Code - https://code.visualstudio.com/
How my browser refreshes when I save: https://youtu.be/h24noHYsuGc
---
Support me on Patreon: https://www.patreon.com/kevinpowell
I'm on some other places on the internet too!
If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.
Instagram: https://www.instagram.com/kevinpowell.co/
Twitter: https://twitter.com/KevinJPowell
Codepen: https://codepen.io/kevinpowell/
Github: https://github.com/kevin-powell
ЕЩЁ
- СКАЧАТЬ MP4
автор uWebDesign дата 19.02.2015
Долгожданный ролик про анимацию SVG в вебе. Рассмотрим три основных способа: CSS анимации, SMIL анимации и JavaScript...
- СКАЧАТЬ MP4
автор freeCodeCamp.org дата 28.11.2018
In this talk, Sarah will start with only an Illustrator document and by the end, make it move! She'll live-code (warts and all) and you'll see her process as she'll ...
- СКАЧАТЬ MP4
автор GetFuckShow дата 30.12.2018
ПОДДЕРЖАТЬ КАНАЛ: https://www.donationalerts.com/r/serjtheking Мой твич канал: https://www.twitch.tv/serjtheking ПОДПИШИСЬ НА БРАТИШЕК :3 ГАВЕР ...
- СКАЧАТЬ MP4
автор SvG Production дата 11.11.2018
كل الأعمال التي يتم رفعها على قناتنا محمية بموجب القانون " حقوق الطبع و النشر" اذا تريد اعادة النشر قم بمراسل...
- СКАЧАТЬ MP4
автор uWebDesign дата 16.07.2014
uWebDesign Обзор #12 — работаем с SVG (Scalable Vector Graphics) при создании HTML прототипов, стилизуем с помощью CSS. SVG — способ...
- СКАЧАТЬ MP4
автор loftblog дата 30.08.2017
1.Что такое SVG 2.Примитивы SVG 3.Организация и структура документа SVG 4.Основные библиотеки для работы с график...
- СКАЧАТЬ MP4
автор Front End Center дата 12.12.2016
SVG is one of the most powerful tools in a front-end developer's arsenal, and while its browser support is excellent, there's enough rough edges that a lot of ...
- СКАЧАТЬ MP4
автор DesignCourse дата 22.06.2018
Today's Question: Do you charge hourly or per project? Let us know! -- Today, I'm going to show you how to design an isometric SVG illustration in Adobe ...
- СКАЧАТЬ MP4
автор BookMark дата 27.06.2018
Awesome SVG ANIMATIONS one should check out while making their own SVG animations from scratch. These are the BEST SVG ANIMATION TUTORIALS I ...
- СКАЧАТЬ MP4
автор LearnWebCode дата 18.11.2016
My front-end course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBEDEAL My new advanced ...
- СКАЧАТЬ MP4
автор GetFuckShow дата 02.01.2019
Мой твич канал: https://www.twitch.tv/serjtheking СКАЧАТЬ FORTNITE БЕСПЛАТНО: https://goo.gl/cEkoxh ПОЛУЧАЙ КЭШБЕК С ПОКУПОК: ...
- СКАЧАТЬ MP4
автор Glo Academy дата 29.06.2018
Начинаем работать с SVG-графикой. Я решил, что лучше сначала получить измеримый результат, поэтому мы будем...
- СКАЧАТЬ MP4
автор DesignCourse дата 24.04.2018
https://coursetro.com -- In this tutorial, I show you how to create creative SVG backgrounds and then how to integrate them via HTML and CSS. Enjoy this quicky!
- СКАЧАТЬ MP4
автор Webmassa дата 24.11.2016
Видео-уроки по SVG-графике для веб-дизайна. Создание простых векторных иконок и работа с их кодом. Свойства...
- СКАЧАТЬ MP4
автор むじょっくすTV дата 16.03.2018
ぽるんがさんのチャンネルはこちら↓ https://goo.gl/A3dfvR ◇チャンネル登録はこちら↓ https://goo.gl/BWzlEC ◇パルンパルン同盟チャンネル↓...
- СКАЧАТЬ MP4
автор WebDesign Guru дата 03.11.2017
Мы продолжаем наши видеоуроки по разработке сайтов. На этом занятии мы поговорим об SVG-иконках. Мы покажем,...
- СКАЧАТЬ MP4
автор Codegram Technologies дата 10.10.2017
Talk given at Full Stack Fest 2017: https://fullstackfest.com OUR SPEAKERS SARAH DRASNER SVG CAN DO THAT?! SVGs, with their potential for high-quality ...
- СКАЧАТЬ MP4
автор DesignCourse дата 02.05.2018
Ever wonder how designers animate their icons? They may have used a tool called http://shapeshifter.design -- which allows you to import SVG graphics and ...
- СКАЧАТЬ MP4