WEBVTT

0
00:01.460 --> 00:06.780
Hey guys. In this module I've got something a little bit different for you. Now, 

1
00:06.790 --> 00:13.220
up till now we've been working on how to build websites that have great functionality and how to use

2
00:13.220 --> 00:17.590
CSS, HTML, to build up the structure of the website.

3
00:17.630 --> 00:24.680
Now today I want to talk about something a little bit different namely how to design websites so that

4
00:24.680 --> 00:30.710
not only does your website have great functionality but it also looks beautiful.

5
00:30.800 --> 00:37.910
The most important thing to making a website loved by users is pretty much the design.

6
00:37.910 --> 00:39.010
After all, think about it.

7
00:39.020 --> 00:43.600
When was the last time you heard somebody tell you, "Hey I came across this great website.

8
00:43.610 --> 00:45.220
It worked really really well.

9
00:45.250 --> 00:47.180
So smooth and no bugs."

10
00:47.180 --> 00:49.000
Nobody ever says that right?

11
00:49.040 --> 00:55.050
They say things like: "It looked so beautiful. It just worked like I wanted it to."

12
00:55.910 --> 01:02.570
So today we're going to talk about design and I want to show you some of the different aspects of design

13
01:02.630 --> 01:04.450
when it comes to websites.

14
01:04.480 --> 01:07.340
Now more often than not, you've heard the saying right?

15
01:07.370 --> 01:10.260
"Don't judge a book by its cover."

16
01:10.340 --> 01:16.250
Now at the same time, you might have also heard of this saying: "You only have three seconds to make a

17
01:16.250 --> 01:17.770
good impression."

18
01:17.840 --> 01:22.400
Now when it comes to web design, the latter is probably more accurate.

19
01:22.460 --> 01:30.290
It's just like a job interview or a first date, your website has a crucial few seconds before the user

20
01:30.290 --> 01:33.720
is going to judge your company, your brand, your product.

21
01:34.250 --> 01:36.820
So take a look at this example.

22
01:36.860 --> 01:43.930
This is a website called Penny juice and it's a company that sells children's juice cartons.

23
01:43.940 --> 01:52.880
Now look at the design of it. There's clashing colors, there's different typefaces, there's different colors

24
01:52.880 --> 01:57.980
for the text and they have different fonts and it's all, to be honest, a bit of a mess.

25
01:58.670 --> 02:02.300
So this is a question I often ask students at this point.

26
02:02.300 --> 02:08.250
Take a look at this website and ask yourself if you were to buy a product from this company,

27
02:08.450 --> 02:12.200
if you were to buy a carton of juice, how much would you pay for it?

28
02:13.100 --> 02:15.920
Now take a look at this website.

29
02:15.920 --> 02:20.990
This is the same website reimagined by a professional web designer.

30
02:20.990 --> 02:28.100
Look at how the color scheme is now consistent, how the fonts and the typefaces now look a lot better.

31
02:28.100 --> 02:34.860
And ask yourself again, how much would you pay for a single carton of juice from this website.

32
02:34.860 --> 02:39.740
Now I've asked this question to a number of people and this is the result I got.

33
02:39.740 --> 02:46.570
People are willing to pay anywhere up to only a dollar for a carton of juice from the first wesite

34
02:46.940 --> 02:51.150
but anywhere up to $3 for the second website.

35
02:51.150 --> 02:57.480
Now I run a startup and a lot of friends and colleagues of mine also work on their own businesses.

36
02:57.710 --> 03:02.630
And we usually spend a lot of time brainstorming, how can we make our product better,

37
03:02.630 --> 03:04.930
how do we make our brand stronger.

38
03:05.000 --> 03:11.600
And there's very very few things that we can think of that can actually produce a three times improvement

39
03:11.720 --> 03:15.120
in the value of your product or in the value of your company.

40
03:15.140 --> 03:17.660
So design is really really powerful.

41
03:17.660 --> 03:24.980
It's one of the cheapest ways to make your company or your product look expensive because it's elevating.

42
03:25.250 --> 03:30.820
And it doesn't take a lot to get good at design as you'll see in the coming lessons.

43
03:30.860 --> 03:36.140
So we're going to be exploring some of the principles of web design in this module.

44
03:36.140 --> 03:44.210
And I want to take you through everything from color theory to typography to user interface design and

45
03:44.210 --> 03:46.330
user experience design.

46
03:46.490 --> 03:51.020
These are the four pillars of good web design.

47
03:51.020 --> 03:55.220
So once you are ready, head over to the next lesson and let's get started.