SVG fundamentals for beginners

SVG fundamentals for beginners, available at $54.99, has an average rating of 4.42, with 30 lectures, based on 6 reviews, and has 43 subscribers.

You will learn about Create SVG files in a text editor Create SVG files from existing vector data Animate and script SVG Work with SVG as static images Work with SVG as CSS Work with SVG as an element in HTML document Work with SVG as a scripted part of animations This course is ideal for individuals who are Web developers who are interested in exploring Scalable Vector Graphics SVG It is particularly useful for Web developers who are interested in exploring Scalable Vector Graphics SVG.

Enroll now: SVG fundamentals for beginners

Summary

Title: SVG fundamentals for beginners

Price: $54.99

Average Rating: 4.42

Number of Lectures: 30

Number of Published Lectures: 30

Number of Curriculum Items: 30

Number of Published Curriculum Objects: 30

Original Price: $22.99

Quality Status: approved

Status: Live

What You Will Learn

Create SVG files in a text editor

Create SVG files from existing vector data

Animate and script SVG

Work with SVG as static images

Work with SVG as CSS

Work with SVG as an element in HTML document

Work with SVG as a scripted part of animations

Who Should Attend

Web developers who are interested in exploring Scalable Vector Graphics SVG

Target Audiences

Web developers who are interested in exploring Scalable Vector Graphics SVG

In this course you will learn:

1-basic shapes: you will learn how to construct drawings using the basic shapes available in SVG including lines, circles, ellipses, rectangles, rounded rectangles, polygons, polylines and stroke characteristics.

We will also discuss stroke characteristics including: Stroke, stroke-width, stroke-opacity, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin.

2-Transformation: you will learn how to move, rotate, scale, and skew the coordinate system to affect the shapes drawn on it.

3-Paths: which include moveto, Lineto, closepath, the Q subcommand quadratic Bezier curves and the marker element.

4-Pattern and Gradients we will be discussing how to create a color gradient using linear gradient and radial gradient, or a fill pattern.

5-Text add text to a drawing, both in a straight line and following a path.

6-Working with SVG and CSS which includes how to use internal and external CSS style sheet, basic animation using CSS and animating multiple CSS properties at one time.

7-Animating and scripting SVG, you will learn how to use

SVG’s built-in animation capabilities by learning animation basics, time and repeated action and motion along path.

This course is for you if you are a web developer who is interested in exploring Scalable Vector Graphics., and if you have experience with JavaScript, CSS, and XML.

At the end of this course you will be able to:

Know how to work with SVG as static images,

in CSS,

inline as elements in an HTML document,

and as a scripted part of animations or visualizations

Course Curriculum

Chapter 1: Introduction

Lecture 1: Introduction

Lecture 2: The Viewport

Chapter 2: Basic Shapes

Lecture 1: Lines

Lecture 2: Circles and Ellipses

Lecture 3: Rectangles

Lecture 4: Rounded Rectangles

Lecture 5: Polygons

Lecture 6: Polylines

Lecture 7: Stroke characteristics

Chapter 3: Transformations

Lecture 1: The translate transformation

Lecture 2: The scale transformation

Lecture 3: The rotate transformation

Lecture 4: The skewX and skewY transformations

Lecture 5: Filters

Chapter 4: Paths

Lecture 1: Moveto lineto and closepath

Lecture 2: The Q subcommand Quadratic Bezier curves

Lecture 3: The marker element

Chapter 5: Pattern and Gradients

Lecture 1: Patterns

Lecture 2: Linear Gradient

Lecture 3: Radial Gradient

Chapter 6: Text

Lecture 1: Properties of the text element

Lecture 2: Text element

Lecture 3: Text rotation

Chapter 7: Working with SVG and CSS

Lecture 1: Using internal CSS style sheet

Lecture 2: Using external CSS style sheet

Lecture 3: Basic animation using CSS

Lecture 4: Animating multiple CSS properties at one time

Chapter 8: Animating and scripting SVG

Lecture 1: Animation basics

Lecture 2: Time and repeated action

Lecture 3: Motion along a path

Instructors

Muhanad Al-warawreh
Engineer

Rating Distribution

1 stars: 0 votes

2 stars: 0 votes

3 stars: 2 votes

4 stars: 1 votes

5 stars: 3 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!