Graphic Design


Creating Illustrations with Adobe and SVG!

Everything you need to know about Photoshop and Illustrator, and apply it to web development using HTML, CSS, and JS!

4.50 (5 reviews)


84.5 hours


Mar 2020

Last Update
Regular Price

Exclusive  SkillShare  Offer
Unlimited access to 30 000 Premium SkillShare courses
Exclusive SkillShare Offer
Unlimited access to 30 000 Premium SkillShare courses

What you will learn

Recognize why you should use SVGs for web development.

Make a landscape scene entirely with code!

Create SVG shapes.

Draw with pens, pencils and paintbrushes.

Embed SVG on a web page.

Use rules, color filling and Transform tools.

Make projects like pamphlets for your portfolio.

And More!


We at Mammoth Interactive value input from students like you. Feel free to leave us your feedback.

Gain hands-on experience with coding real projects! Make vector graphics by coding in this awesome course for beginners. Scaleable Vector Graphics (SVG) is an image format that uses vectors, in contrast to other image formats like jpg, gif, or pngs, which are raster graphics. SVG is made with math. For this reason, it can scale indefinitely! This makes it great for making logos, icons, and simple designs.

Why use SVG?

  • It has good support among all modern browsers, and it's an open standard.

  • It uses smaller file sizes compared to bitmapped files.

  • You can style shapes in CSS and interact with them in JavaScript! Thus you can programmatically alter shapes for use on web pages.

Learn to navigate the interfaces of the top 2 programs for graphic design and digital art. Make stunning projects - learn graphic design and drawing in Adobe's most powerful computer art for graphic design.

Create Projects and Get Creative with ZERO Experience

  • Part 1: Learn to use Photoshop's extensive toolkit and features. Make beautiful projects that anyone can make.

  • Part 2: Use Illustrator, the vector graphics editor developed for professional design.

  • Get ​FREE ​6 webinars as a bonus gift

  • No risk attached - get full lifetime access to this course for a single fee. 


With Photoshop's incredible tools, you can make your projects stand out from the rest of the crowd. Photoshop has features that can make your photographs or designs go from beginner to advanced-looking with ease once you master the basics of the powerful interface. 

Don't be intimidated by the initially complex interface - anyone can learn to use Photoshop. Primarily for photo editing, enroll today to add this software to your resume.


Illustrator is for designers because it allows you to create a massive variety of graphic design projects, such as vector graphics and logos. In this course, you learn how to create a project in Illustrator using the must-know tools. 

By the end of this course, you'll be able to use Illustrator at your work, to make brand material for your company or to express your creativity to make any project. 

The only limit is your imagination - enroll today to learn an in-demand skill that will further your professional skills.

Stop making excuses

No experience is necessary to take this course. ​Even if you’ve never coded before, you can join us. 

One of the best features is that you can watch the tutorials at any speed you want. This means you can speed up or slow down the video if you want to.

This course is project-based - you follow along with your instructor to build real projects. The best way for you to learn how to make your own app is to follow project-based training content. 

By enrolling​, you learn practical, employable skills immediately.​ You can put the apps you make in this course in your portfolio!

Included in this course is material for beginners to get comfortable with the interfaces.

Please note that we reuse this content in similar courses because it is introductory material. You can find some material in this course in ​The Ultimate iOS 11 & Swift 4 Course. Learn to Build Apps!

A hands-on approach

In Mammoth Interactive courses, you learn by doing: You create​ ​projects alongside your instructor. All source code for projects we make is included in this course. 

Our experienced instructors know how to explain topics clearly at a logical pace. We don't just teach you theory - we make projects you can put directly into your portfolio.

Also now Included in these bundles are our Extra Courses, if you want to learn to use other programs such as Camtasia or Sketch, you get more content than what you paid for this way!

We really hope you decide to purchase this course and take your knowledge to the next level!

Let's get started!

Enroll now to join the Mammoth community!


Creating Illustrations with Adobe and SVG!
Creating Illustrations with Adobe and SVG!
Creating Illustrations with Adobe and SVG!
Creating Illustrations with Adobe and SVG!


Photoshop Project

Build a New File

Navigational Controls

Basic Tools Rundown

Basic Tools Usages

Basic Secondary Tools

Basic Layers

Painting Sample

Adjustment Layers (Part 1)

Adjustment Layers (Part 2)

Adjustment Layers (Part 3)

Transform Tool

Transform Tool (Cont'd)

Colour Range Select

Image Settings

Image Adjustment

Photoshop fun

Photoshop fun (Cont'd)

Ruler Usage

Pamphlet Design (Part 1)

Pamphlet Design (Part 2)

Pamphlet Design (Part 3)

Illustrator Project


New File and Navigation

General Directions

Pen Tool

Line Segments

Shape Tools

Colour Filling


Pencil Tools

Rotation and Reflection

Scale Tools

Width Tool

Shape Builder (Part 1)

Shape Builder (Part 2)

Shape Builder (Part 3)

Free Transform

Perspective Tool

Mesh Tool

Gradient Tool

Symbol Sprayer

Graphing Tools


Illustrator Fun (Part 1)

Illustrator Fun (Part 2)

Illustrator Fun (Part 3)

Make Art by Coding - Create an SVG Scene for Web Animation

Introduction Part 1

Introduction Part 2

Creating Rectangle and Circles

Creating Lines

SVG viewBox

Polygon Element Part 1

Polygon Element Part 2

Polygon Element Part 3

Polygon Element Part 4

viewBox Attributes

viewBox Attributes (Cont'd)

Path Elements

Path Elements (Cont'd)

Bezier Curves Part 1

Bezier Curves Part 2

Bezier Curves Part 3

Bezier Curves Part 4

Quadratic Bezier Curves


Arcs (Cont'd)

SVG-edit and Illustrator

Styling Inline SVG

SVG in IMG tag

SVG in Background IMG

Modifying Inline SVG

SVG with Javascript

Adding Trees

Creating Trees

Creating Trees (contd)

Remove Button

Adding Other Type of Trees

Sorting Trees

Sorting Trees (cont'd)

Refactoring Javascript

Refactoring Javascript (Cont'd)

Saving as SVG

Saving as SVG (Cont'd)

Save as PNG

Downloading Images

Refactoring Part 1

Refactoring Part 2

Refactoring Part 3

Main Functionality

Main Functionality (Cont'd)

Testing Cross Browser Compatibility

Checking DOMcontentloaded

Styling Part 1

Styling Part 2

Styling Part 3

Modal for PNG Part 1

Modal for PNG Part 2

Modal for PNG Part 3

More Javascript Refactoring

Styling The Modal More

Adding Size Reset Button


Source Code


Course Intro and Sketch Tools

Sketch Files - Sketch Tools

Sketch Basics and Online Resources

Plug-ins and Designing your First Mobile app

Your First Mobile App Continued

Sketch Files - Your First Mobile App

Shortcuts and Extra tips

Sketch Files - Shortcuts by Mammoth Interactive

Learn to Code in HTML

Intro to HTML

Writing our first HTML

Intro to Lists and Comments

Nested Lists

Loading Images

Loading Images in Lists


Images as Link

Mailto Link

Div Element

Learn to Code in CSS


Introducing the Box Model

Writing our First CSS

More CSS Examples


More on Type Selectors

Getting Direct Descendents

Class Intro

Multiple Classes

id Intro

CSS Specificity

Selecting Multiple Pseudo Classes and Sibling Matching

Styling Recipe Page

Loading External Stylesheet


Introduction to Course and D3

Source Code

Handling Data and Your First Project

Source code

Continuing your First Project

Understanding Scale

Source Code

Complex charts, Animations and Interactivity

Source Code

Introduction to PyCharm

Downloading and Installing Pycharm and Python

Support for Python Problems or Questions

Exploring Pycharm

Learning Python with Mammoth Interactive

Python Language Basics

Intro to Variables

Variables Operations and Conversions

Collection Types

Collections Operations

Control Flow If Statements

While and For Loops


Classes and Objects


Setting Up and Basic Flask

Setting up Terminals on Windows 7 and Mac

Terminal basic commands and symbols

Source Code - Setting up Flask

Source Code - Basic Flask HTML & CSS

Basic Flask Database

Source Code - Basic Flask Database

Flask Session and Resources

Source Code - Flask Session

Flask Digital Ocean

Flask Digital Ocean Continued

Xcode Fundamentals

Intro and Demo

General Interface

Files System


Storyboard File

Connecting Outlets and Actions

Running an Application

Debugging an Application

Source Code and Art Assets

Swift 4 Language Basics

Language Basics Topics List

Variable and Constants

Learning Goals

Intro to Variables and Constants

Primitive types


Nil Values


Type Conversions

Assignment Operators

Conditional Operators

Variables and Constants Text.playground

Collection Types

Topics List and Learning Objectives

Intro to Collection Types

Creating Arrays

Common Array Operations

Multidimensional Arrays


Collection Types Text.playground

Control flow

Topics List and Learning Objectives

Intro to If and Else Statements

Else If Statements

Multiple Simultaneous Tests

Intro To Switch Statements

Advanced Switch Statement Techniques

Testing for Nil Values

Intro to While Loops

Intro to for...in Loops

Intro to For...In Loops (Cont'd)

Complex Loops and Loop Control statements

Control Flow Text.playground


Intro to Functions

Function Parameters

Return Statements

Parameter Variations - Argument Labels

Parameter Variations - Default Values

Parameters Variations - InOut Parameters

Parameter Variations - Variadic Parameters

Returning Multiple Values Simultaneously

Functions Text.playground

Classes, Struct and Enums

Topics List and Learning Objectives

Intro to Classes

Properties as fields - Add to Class Implementation

Custom Getters and Setters

Calculated Properties

Variable Scope and Self

Lazy and Static Variables

Behaviour as Instance Methods and Class type Methods

Behaviour and Instance Methods

Class Type Methods

Class Instances as Field Variables

Inheritance, Subclassing and SuperClassing

Overriding Initializers

Overriding Properties

Overriding Methods

Structs Overview


Comparisons between Classes, Structs and Enums

Classes, Structs, Enums Text.playground

Practical MacOS BootCamps

Introduction and UI Elements

Calculator Setup and Tax Calculator

Calculate Tax And Tip - Mammoth Interactive Source Code

Tip Calculator and View Controller

View Controller - Mammoth Interactive Source Code


Constraints - Mammoth Interactive Source Code

Constraints Code


Refactor - Mammoth Interactive Source Code

MacOsElements - Mammoth Interactive Source Code

Data Mining With Python

Data Wrangling and Section 1

Project Files - Data Mining with Mammoth Interactive

Project Files - Data Wrangling with Mammoth Interactive

Data Mining Fundamentals

Project Files - Data Mining fundamentals with Mammoth Interactive

Framework Explained, Taming Big Bank with Data

Project Files - Frameworks with Mammoth Interactive

Mining and Storing Data

Project Files - Mining and Storing with Mammoth Interactive

NLP (Natural Language Processing)

Project Files - NLP with Mammoth Interactive

Summary Challenge

Conclusion Files - Mammoth Interactive

Introduction to Video Editing

Introduction to the Course

Installing Camtasia

Exploring the Interface

Camtasia Project Files

Setting Up a Screen Recording

Introduction and Tips for Recording

Creating a Recording Account

Full Screen vs Window Mode

Setting the Recording Resolution

Different Resolutions and their Uses

Tips to Improve Recording Quality and Summary

Camtasia Recording

Introduction and Workflow

Tools Options Menu

Your First Recording

Viewing your Test


Mic Etiqutte

Project - Recording Exercise

Webcam, Telprompter, and Summary

Camtasia Screen Layout

Introduction and Tools Panel


Zoom N Pan


Yellow Snap Lines

TimeLine Basics, Summary and Challenge

Camtasia Editing

Introduction and Importing Media



Working with Audio

Clip Speed

Locking and Disabling tracks


Working with Images

Voice Narration

Noise Removal

Smart Focus

Summary and Challenge

Advance Editing Introduction

Advance Editing Introduction

Zooming Multiple Tracks




Color Adjustment

Clip Speed

Remove a Color

Device Frame

Theme Manager


Media and Summary

Camtasia Resources and Tips

Resources and Tips Introduction


Extending Frames

Working with Video

Exporting a Project for Youtube

Exporting a Project for Youtube

Code with C#

Introduction to Course and Types

Operator, Classes , and Additional Types

Statements & Loops

Arrays, Lists, and Strings

Files, Directories, and Debugs

Source code

Learn to Code with R

Intro to R

Control Flow and Core Concepts

Matrices, Dataframes, Lists and Data Manipulation

GGplot and Intro to Machine learning


Source Code

Advanced R

Course Overview and Data Setup

Source Code - Setting Up Data - Mammoth Interactive

Functions in R

Source Code - Functions - Mammoth Interactive

Regression Model

Source Code - Regression Models - Mammoth Interactive

Regression Models Continued and Classification Models

Source Code - Classification Models - Mammoth Interactive

Classification Models Continued, RMark Down and Excel

Source Code - RMarkDown And Excel - Mammoth Interactive

Datasets - Mammoth Interactive

Learn to Code with Java

Introduction and setting up Android Studio

Introduction - Encryption Source Code

Setting up Continued

Java Programming Fundamentals

Source Code - Java Programming Fundamentals

Additional Java fundamentals

Source Code - Additional fundamentals


Source Code - Classes

Please rate this course

Bonus Lecture - Mammoth Interactive Deals


Sanjaya16 December 2020

I bought this to learn about SVGs, and I think this is the only course in the Udemy that covers the domain in depth. The course is for intermediate/advance level developers. The instructor is very knowledgeable . I would have given 5-star if it had some real world examples - but the knowledge can be easily applied to the real world development.


Udemy ID


Course created date


Course Indexed date
Course Submitted by