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

Udemy

SVG basics for beginners - concepts explained with examples

via Udemy

Overview

Create awesome 2D vector graphics with SVG (code) + HTML - over-the-shoulder training with detailed examples per lesson

What you'll learn:
  • Create multiple graphical elements with SVG code - shapes (rectangles, circles), lines, links, etc.
  • Create scalable vector graphics with just pure HTML and SVG codes
  • Create awesome graphics without mastering complicated graphic design software
  • Edit your SVG graphics in seconds by editing your SVG code

Are you a programmer who hates graphic design?But do you still want to create awesome2D vector graphicsfor your web projects?

SVG(Scalable Vector Graphics)is way to go!

Forget mastering complicated graphic design software that have nothing to do with programming. You can now create every kind of vector graphics with just afew lines of code. No design skills needed, at all!

What more?These SVGcodes are perfectly editable and can be easily embedded in your websites.

If you know the very basics of HTML and CSS, you're all set.

Spend a few hours learning a bunch of SVG syntaxes, and you'll be creatingawesome graphicsanddesignsin no time at all!

Every programmer can become a pro designer now!

What will you learn in ourcourse?

1. How to createshapes, lines, textwith SVG syntaxes.

2. How tostyleevery single SVG element you create.

3. How to embedlinks andimagesin yourSVGimages.

4. How toedit your SVG graphicsin seconds by editing your SVG code

What are some real world applications of what you learn in thiscourse?

By applying the concepts you learn in this course, you can code and design:

1. Graphics for your websites

2. 2D graphs and pictorial reports that can be used in presentations

3. Bar charts, pie charts, etc.

4. Scalable vector icons and logos that can be displayed in websites, mobile browsers, ipads etc.

Sky is the limit!You can apply what you learn here anywhere in the web space, in any sphere.

Your imagination is your only obstacle to how you applywhat you learn here in yourreal world projects.

How is this course designed?

Our freecourse has 2 modules, where each module will thoroughly explain the intricacies of one of the concepts in SVG with a wealth of over-the-shoulder examples.

Here are the modules:

Module 1 - SVG basics- This is thefoundationsmodule. You'll learn how to create SVGfiles, how to embed the codes/images in your HTML websites, how the SVGcoordinate system works and every other thing you need to get started with creating SVG.

Module 2 - Creating shapes (rectangles, lines, circles), text, images and linkswith SVG- You'll learn how to createrectangles, circles, lines, text, images and linkswith a wealth of examples in every single lesson. You'll be coding the shapes along with me in every single module so you understand the concepts better. You'll also learn how tostyle the elementsin multiple ways to get the best possible result.

Why should you choose our course?

1. We like to bethorough in our teaching. You'll find everything you need to start creating awesome 2D vector graphics with SVG code/syntaxesin this course. You won't have to look anywhere else.

2. We strongly advocatelearning by doing, rather than just listening or reading. Our lectures are filled with awealth of examplesthat explain every concept clearly.

So, what are you waiting for?Enroll nowand start creating awesome2D vector graphics with SVGsyntaxes in no time at all!

Taught by

DigiFisk (Programming is fun)

Reviews

4.6 rating at Udemy based on 241 ratings

Start your review of SVG basics for beginners - concepts explained with examples

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.