Name: Create your graphics for a responsive website with Inkscape!
Rating: 4.4 (80 reviews)

Udemy Business

Teach on Udemy

Turn what you know into an opportunity and reach millions around the world.

Learn More

Your cart is empty.

Keep shopping

Created byIstván Szép

Last updated 1/2017

English

What you'll learn

Create a graphical website layout both for desktop and mobile, using a free graphic design program

Course content

3 sections • 14 lectures • 1h 30m total length

Introduction2:11
In this course you will learn how to create a website layout with Inkscape.
Document setup4:08
Welcome to Inkscape! Let's start with setting up our document for designing a website layout!

Create the first shapes4:59
Let's get a bit more familiar with the tools of Inkscape!
Make a basic layout6:10
Now we will create a very simple layout plan with the tools we already know!
Using colors in Inkscape9:05
Colors are an important part of webdesign. And with Inkscape you can deal with them with ease!
Learn the text tool, create the main navigation7:48
The web is all about text, so it is evident we should add that to our layout too. Also in this lesson You will create some simple buttons too!
Layout of text11:03
The text tool is obviously not only good for short words but for longer texts as well. In this lesson we will create textboxes and learn about dummy text.
Dealing with photos9:10
Inkscape is a vector program, but it doesn't mean you should forget about photos for your design! Here is how to import and scale photos in Inkscape!
Drawing icons in Inkscape9:58
As Inkscape is a vector design program, this is where it is the best: creating icons from scratch! In this tutorial I show you how to do 3 simple icons in Inkscape with different methods.
Modify layout7:22
Vector layouts are so easy to modify! In this tutorial I will position the icons and change the layout accordingly. Never be afraid to make a mistake with Inkscape, it is very flexible!

Create the mobile layout10:20
We all know that the mobile web is important. Creating a mobile web layout with Inkscape is very easy. Focus on what is important, remove the arts that are secondary!
Tips and tricks about exporting5:26
This lesson is about how to get color codes, photos and graphics out of Inkscape to build them into a website template.
Export SVG for web2:34
Svg is very valuable in web design, so it is good to know how to export it properly.
Bonus lecture - check this out!0:41

Requirements

Download Inkscape
Have an idea in mind for your website design project. Having a real problem at hand will make you more creative at finding a solution!

Description

This course will teach you how to make your own website layout. You will use web design principles, learn about colors and creating your own buttons and icons. All this with an amazing free design program called Inkscape!

If you take part in the course, you will also receive the source file of both of the templates and the fonts used, so you can experiment and modify it!*
During the course I am creating the website layout for a florist shop, but I encourage you to create a site design straight for your own business, or own hobby! Because what I show you is not about flowers! It is about creating, learning design principles and learning to use Inkscape!

This course is about designing a graphical layout for a website.
So the course is NOT about creating CSS and HTML templates!

The course starts with 13 videos and it takes about 90 minutes to complete! Of course, as with my other courses, I will be here to answer your questions and add more videos if you need it!

Go on, download Inkscape for free now, and start to create your own design!

*Sadly, I can not give you the photo, as I don't own the rights. Find a good photo that is matching your design idea instead!

Who this course is for:

You don't need to have any knowledge of Inkscape to start this course! - but believe me, after finishing it, you will crave more, it is a very versatile tool ;)
Also, Inkscape is a FREE tool! If you are not sure to buy expensive graphic design software just yet, or you are a hobbyist, Inkscape is your best choice to learn and do graphic design!
This course if for people who are not satisfied to use boring templates, but want to create their unique designs themselves!
This course is about designing the graphics for a website layout.
This course is NOT about CSS and HTML

What you'll learn

Explore related topics

Course content

Preparation2 lectures • 6min

Creating the layout - and learn Inkscape while doing it!8 lectures • 1hr 6min

Modify and export the layout4 lectures • 19min

Requirements

Description

Who this course is for: