Lo que aprenderás

How to build a portfolio of modern flat design digital illustrations and icons

How to independently use Affinity Designer

Contenido incluido

Introduction

1 lección

01:50

1Introduction to the course

01:50

Affinity Designer in web design

2 lecciones

11:55

2.1What is Affinity Designer and how to set it up for web design

03:12

2.2Affinity Designer’s web design abilities

08:43

Web design principles

2 lecciones

08:28

3.1Top 10 Principles of Good Web Design

03:54

3.2Top 10 Principles of Good Web Design – continued

04:34

Colors in web design

4 lecciones

19:53

4.1The most important factor to consider before choosing colors

04:06

4.2How to mix colors for the best possible User Experience

04:37

4.3How to choose the “psychologically right” colors

04:37

4.4-7 easy tools for choosing errorproof color schemes

06:33

Typography in web design

5 lecciones

18:31

5.1A super short history of web typography

02:41

5.2How to choose fonts for body text

05:18

5.3How to choose the right fonts for headings

03:38

5.4How to mix fonts for headings and body text

04:18

5.5The perfect font for User Interface design

02:36

How is a typical website built

4 lecciones

15:24

6.1Header, branding, navigation and Hero sections

03:53

6.2The center and bottom sections of your website design

04:13

6.3What are grids and how to use them

03:08

6.4How to design your very own grid

04:10

Web design inspiration

2 lecciones

11:28

7.1-7 web design trends that rule the web design world

08:59

7.2Where to find the RIGHT inspiration for your next design

02:29

The preparation stage

7 lecciones

45:44

8.1Every website design needs scaffolding

03:13

8.2Building your own wireframe in Designer

04:41

8.3Let’s continue building the library

10:08

8.4How to use the assets to create a wireframe

11:19

8.5Wireframing online

04:28

8.6Let’s talk about images and icons

05:53

8.7How to create font styles in Affinity Designer

06:02

The Design - Home Page

20 lecciones

01:44:14

9.1The Design Part Overview

06:02

9.2Let\\\\\’s Create the Color Swatches

04:05

9.3Let\\\\\’s Create the Text Styles

07:59

9.4Let\\\\\’s Take a Look at the Images and Icons

02:35

9.5Let\\\\\’s Create the Logo First

03:26

9.6Let\\\\\’s Build the Menu Links

04:04

9.7Let\\\\\’s Add the Social Media Icons

08:05

10.1Let\\\\\’s start by adding the main image

06:42

10.2How to Quickly Resize the Image

03:03

10.3Let\\\\\’s Make the Image a Bit Darker

03:15

10.4Now Let\\\\\’s Add the Main Text

05:05

10.5Let\\\\\’s Add the Slider Navigation

03:47

11.1Let\\\\\’s Start Creating the First Featured Secion

03:35

11.2Let\\\\\’s Add the Featured Items

10:08

11.3Let\\\\\’s Add the Second Featured Item Section

05:40

12.1Let\\\\\’s Start Creating the Blog Section

08:13

12.2Let\\\\\’s Replace the Images

03:06

13.1Let\\\\\’s Start Building the Image Gallery

07:13

13.2Let\\\\\’s Create the First Column of the Footer

04:14

13.3Let\\\\\’s Finish the Design and the Whole Footer

03:57

The Blog Layout Design

25 lecciones

02:15:46

1Let\\\\\’s Discover the Wireframe for the Design

06:09

2Let\\\\\’s Discover the Blog Design-

05:31

3Let\\\\\’s Take a Look at our Assets

06:06

4How To Create the Logo and Nav

07:38

5Let\\\\\’s Add the Social Media Icons

06:18

6Let\\\\\’s Add the First Images

07:23

7Let\\\\\’s Add the Shading to the Images

07:57

8Let\\\\\’s Add the Navigation Buttons

05:24

9Let\\\\\’s Create a Container for the Blog Post

05:17

10Let\\\\\’s Add the First Pieces of Text

04:29

11Let\\\\\’s Add the Remining Pieces of Text

06:07

12Let\\\\\’s Start Creating the Blog Post Grid

05:58

13Let\\\\\’s Create the First Blog Post Card

05:19

14Let\\\\\’s Add the Remaining Cards

06:35

15Add the post navigation link

04:17

16Let\\\\\’s Explore the Sidebar Project

02:38

17Let\\\\\’s Create the Search Box

03:55

18let\\\\\’s Create the About Me Section

06:37

19Let\\\\\’s Create the Text Section of the Sidebar

04:49

20Let\\\\\’s Create the First Container for the Most Popular Posts

04:07

21Let\\\\\’s Create the List of the Most Popular blog Posts

06:30

22Let\\\\\’s Create the Ads Section

02:51

23Let\\\\\’s tart Creating the Footer

04:07

24Let\\\\\’s Explore Different Footer Concepts

02:35

25let\\\\\’s Finish the Project and explore the next one

07:09

The Single Post Layout

10 lecciones

01:08:22

26Let\\\\\’s Explore the Single Post Design

03:13

27Let\\\\\’s Create the Featured Image and the Post Container

05:47

28Let\\\\\’s Add the Blog Post Title

06:21

29Let\\\\\’s Add the Paragraphs and Images

10:11

30Let\\\\\’s Add the Social Media Icons

07:18

31Let\\\\\’s Add the pre-Next Post Navigation

08:27

32Let\\\\\’s Add the Related Posts Section

07:21

33Let\\\\\’s Start Creating the Comments Section

04:46

34Let\\\\\’s Create the Texts for the Comments

05:55

35Let\\\\\’s Create the Post Comment Forms

09:03

The Delivery

4 lecciones

09:31

14.1Delivering the design to the client

03:39

14.2Delivering the file to the developer

02:30

14.3How To Use the Export Persona to Export the Assets in Bulk

02:29

Summary

00:53

Descripción

If you are thinking about starting out as a web designer you have probably tried to harness Photoshop sometime in the past.

You probably spent countless hours trying to figure out that monstrous program.

I know the pain.

I remember spending days after days, weeks after weeks just to remember how tools and effects work.

Luckily we live in times when if you want to start a career as a web design freelancer, you can just put Photoshop aside.

Hi, my name is Dawid Tuminski and in this course you will learn how to use Affinity Designer to design websites from A-Z.

This course is packed with valuable info any web design rookie should know, such as:

How to choose the BEST colors and fonts for your websites

What makes a professionally designed website

What are the modern web design trends you should know about

How to build website’s visual guides, such as wireframes and grids

…and that’s just the introduction!

Because the real bread and butter of this course is inside its practical parts.

We will get our hands dirty and explore all the tools and techniques professional web designers use to design a website inside Affinity Designer.

That includes:

Building wireframes and grids – the building blocks of every website

Using assets to make the design process ultra-fast

Creating text styles that let you change fonts in a blink of an eye

And of course designing a website

You will learn how to design it form opening a file, through placing images, adding text and backgrounds right up to exporting the design you would ultimately hand out to a client.

There’s a lot of good stuff to cover and I truly believe that once you’ve completed the course and practiced on your own, you will start creating amazing website designs in Affinity Designer in no time.

And to make things easier, this course comes with a lot of downloadable resources:

Presentations you can open up on your tablet or smartphone to revise the lecture when you are commuting

The design files you can explore to get the real feel of a website design

And images and icons needed to make recreating the design effortless

This is a more than a 4 hour long web design and Affinity Designer bundle. Every step of the process is explained thoroughly, but without the yaaaaaawn parts.

Please notice one thing.

This course is not about learning all there is to know about Affiinity Designer.

It’s a course for those who already got the basics of the software and would love to learn how to use their skills to design websites.

We won’t be looking at each and every tool to find out what it does.

We will however go deep on those tools that we will be specifically using for web design purposes.

I mean, if you don’t know jack about the software, you can always take a look at my Affinity Designer for Beginners course here on Udemy.

But of course, if you have any questions along the way, I will be more than happy to answer them.

I am here to help, so you can rest assured that you won’t be left out on your own when something is not clear and needs a more personalized explanation.

Also, don’t forget that you are totally covered by a 30-day money back guarantee.No questions asked.

So if you don’t want to spend ages on learning overly complicated software and you don’t want to visit your bank to ask for loans just to get that software, give Affinity Designer a try.

So far a very interesting course and definitely worth the $10. It brings together a lot of tips and tricks and general principles that you would otherwise have to put together from a lot of research. While I wouldn't say that this is all too in-depth, it does cover a LOT of areas. This course tries to be an all-rounder with a very clear focus and I am happy to have spent the money. I don't understand why I am getting annoying prompts to rate this when I am not even done with it, though.