Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Start a free Basic trial
to watch this video
Creating and maintaining the design of a great web experience is the job of a web designer. In this video, we look at what the role of a web designer is, what they make, and how you can become one.
-
0:00
The web today is a far cry from what was originally proposed in the late 80s.
-
0:03
An original webpage consisted of only text,
-
0:06
and there was essentially no design involved.
-
0:09
But the web we know today has evolved into something much more.
-
0:12
Websites now aren't just pages on a global network.
-
0:16
They're complete experiences with rich and engaging content.
-
0:19
It's a fair assumption to say
-
0:21
that we're spending increasing amounts of time on the web,
-
0:24
and this number can only go up in the future.
-
0:26
Creating and maintaining the design of a great web experience
-
0:31
is a task handled by a web designer.
-
0:33
Web design is a vast topic that encompasses
-
0:36
many different skills and disciplines
-
0:38
in a fast-paced and constantly changing environment.
-
0:41
As a web designer you need to have knowledge of topics
-
0:44
ranging from color theory, typography, and user interaction on the design side
-
0:49
as well as HTML, CSS, and JavaScript on the technology side.
-
0:53
And that's just the tip of the iceberg.
-
0:56
You will also have to keep up with methodologies
-
0:58
that are a part of this trade—
-
1:00
things like responsive web design.
-
1:02
Now while this might seem daunting
-
1:03
web design is a very engaging, interesting, and rewarding field.
-
1:07
Now sometimes you might see this position listed as a front-end designer
-
1:11
or even a user-experience or user-interaction designer.
-
1:15
The tasks vary from position to position,
-
1:17
but they all encompass the same set of skills.
-
1:20
To get an idea of what it is like to start out in web design
-
1:24
let's talk to some of our teachers in the field.
-
1:26
[How did you get started in web design?]
-
1:29
Well I got started in web design by just making a personal homepage.
-
1:36
I was 11 years old, and I think I was using FrontPage at the time.
-
1:44
And I just posted all sorts of things that I was interested in at the time—
-
1:49
mostly video games.
-
1:51
From there I progressed to actually hand coding HTML and CSS.
-
1:58
I think I moved onto Dreamweaver at some point
-
2:01
and eventually just started using a text editor.
-
2:04
And then—at some point—I started learning back-end coding
-
2:10
so I started learning PHP—I think around the time I was graduating high school
-
2:16
or going into college.
-
2:18
And I just taught myself out of books from the college library.
-
2:25
Then I moved on to Ruby on Rails—
-
2:29
got an internship and—kind of just—
-
2:33
progressed from there in the professional world.
-
2:36
Well the way I got started in web design was at an early age.
-
2:41
My dad was a programmer, and my mom was a graphic designer.
-
2:44
So I—kind of—just always had the programs and the software
-
2:48
available to me to use.
-
2:50
And they—kind of—introduced it to me at a young age.
-
2:54
I didn't really start coding, though, until I was about 12 or 13
-
2:59
when there was a big diary boom—like the online diaries.
-
3:04
So like for Zenga and BloopDiary I would create custom layouts and stuff like that.
-
3:11
Well I got started in the industry around high school.
-
3:16
My parents came to me and they were like,
-
3:17
"You know all this stuff that you're doing in your free time
-
3:20
as a web designer—you know you can make a career out of that, right?"
-
3:23
And I was kind of surprised, or I just didn't know that
-
3:26
that was something that I could actually pursue as a career.
-
3:28
So I enrolled at the Art Institute of Tampa
-
3:32
and went to school for my Bachelor's degree,
-
3:35
and I ended up meeting my professor my sophomore year,
-
3:39
and he hired me.
-
3:40
I don't really think I had a beginning point of when I got started in design.
-
3:45
It was more of a transition.
-
3:50
I've done fine arts pretty much my whole life—
-
3:52
from painting, drawing, illustrating, creating stuff, sculptures.
-
3:57
And then when I originally went to college, I went for athletic fitness
-
4:00
because everybody thought it would be a good idea for me to go for art
-
4:03
and I didn't listen to them.
-
4:05
And then I did about 2 years of that,
-
4:07
and anatomy and physiology just wasn't working out for me.
-
4:10
So that's when I made the transition, and I got a degree in fine arts
-
4:15
and then transitioned that into a degree in multimedia design.
-
4:20
[What was your first experience like?]
-
4:23
I think—it was definitely a big shock the first time I worked in the industry
-
4:28
because unlike school where they give you a lot of perfect scenarios to work with
-
4:34
the perfect client, the perfect—you know—set up,
-
4:37
the perfect project—you get to do whatever you want—
-
4:39
it was a big shock to work for an agency where
-
4:43
you have clients and real-life work to do and on a timeline,
-
4:50
and you have a brand to work with.
-
4:51
So I think the shock of just having to track my time and
-
4:57
design not just for myself but for other people was the biggest shock for me.
-
5:03
My first professional experience actually programming websites
-
5:09
was in an internship that I got through my university.
-
5:14
It was actually Jim that convinced me that I should work at a company
-
5:18
rather than just trying to freelance.
-
5:20
At the time I was in college,
-
5:22
and it was a time where lots of big websites were popping up
-
5:27
like Facebook and YouTube, and I just naively thought
-
5:33
I was going to just make a website just like that
-
5:35
and retire a billionaire at age 30
-
5:38
and not really have anything to worry about.
-
5:41
Of course that didn't really pan out for me.
-
5:45
I did get an internship at a healthcare consulting firm,
-
5:50
and that turned out to be a really valuable experience for me.
-
5:54
I was programming PHP.
-
5:56
[What was your first work or project?]
-
5:59
Basically what the company did was they sent out
-
6:02
surveys to patients that were being discharged from hospitals
-
6:08
and then the patients would send those back—
-
6:11
this was all through the mail—
-
6:12
and we would write software that would process all of that data
-
6:18
and then deliver it back to the healthcare professionals
-
6:21
in the form of all types of graphs and interesting reports.
-
6:26
When I first started I was kind of an apprentice designer
-
6:30
so I would do a lot of the little stuff that my professor—my boss—
-
6:36
didn't have time to do
-
6:37
So I would make buttons and little call to actions and stuff like that.
-
6:42
A couple of the first clients I worked with was Outback
-
6:45
and some financial companies—a lot of healthcare companies and stuff like that.
-
6:50
And then the next step up was actually taking on entire projects on my own
-
6:55
so I would be responsible for the whole design of the email campaign
-
6:59
or the whole design of the website or whatever.
-
7:02
My first experience with designing in the industry
-
7:06
was with an agency called Infamous Graphics
-
7:09
also the Level Agency in Albany, New York.
-
7:13
At the time I was getting my Bachelor's degree,
-
7:16
and I had my Associate's in fine arts
-
7:19
and was basically helping out with print—large-format print and small-format print
-
7:25
and some logo design work.
-
7:29
[What skills do you need to work in the web design industry?]
-
7:32
I think the skills I needed to break into the web industry were
-
7:37
first the technical skills—
-
7:39
so I definitely needed to know HTML and CSS,
-
7:43
which I had a pretty firm grasp on at the time.
-
7:46
And, for me and my particular case,
-
7:49
it was really good to know a back-end language.
-
7:53
This was before Ruby on Rails started getting popular,
-
7:57
and PHP was the big back-end language at the time.
-
8:02
So I knew PHP—I built my own website in PHP
-
8:10
and it was actually a flyer board for my college.
-
8:14
So I was looking around campus and saw all of these paper flyer boards,
-
8:19
and I thought I could make a digital replacement for that.
-
8:23
And about 8 weeks after I launched, Facebook Marketplace came out
-
8:28
and basically crushed any hope of that idea succeeding.
-
8:33
But the good news is it helped me get a job—
-
8:37
I had something that I could actually show to an employer.
-
8:41
So not only did I have the skills, but I also had something in my portfolio
-
8:46
that I could use to actually demonstrate that I had those skills.
-
8:50
And the last thing—I think—was just having good oral communication skills.
-
8:55
When I worked in a group in high school or in college
-
8:59
I was usually the person that would—kind of—lead the group,
-
9:03
or pick up any slack, or take extra initiative,
-
9:07
or what have you, and that ended up being pretty valuable
-
9:12
in a job interview situation.
-
9:16
First and foremost you need to be a problem solver.
-
9:18
So you need to be able to recognize a problem and then offer a solution.
-
9:22
As far as technical skills go from a print standpoint,
-
9:27
Photoshop and Illustrator, both Raster and Vector Images.
-
9:31
And from a technical standpoint on web,
-
9:34
your basic HTML, CSS, and anything further than that
-
9:40
will definitely help you improve in the industry.
-
9:43
Color theory—aesthetics, being able to recognize good design from bad design
-
9:48
and appropriate design
-
9:51
are huge—are key to being a good designer.
-
9:56
I think that the most important thing as a designer
-
10:00
to break into the industry is good typography.
-
10:04
I was actually just having lunch with my old boss—my professor—
-
10:09
and he mentioned that the one thing that made me stand out from the other people
-
10:12
was my attention to typography.
-
10:14
So I didn't necessarily know the coding languages
-
10:17
or some of the other stuff could use a little bit of work,
-
10:20
but he saw that the kerning and the letting
-
10:22
and my treatment to type was good
-
10:24
so any good designer—the foundation to me is typography
-
10:28
and everything else can be taught.
-
10:30
Some of those things—to keep on moving up
-
10:32
you would need to learn some front-end languages
-
10:34
like HTML and CSS.
-
10:36
It really just depends on what kind of route you want to take—
-
10:40
whether it's a front-end developer route or a user interface designer.
-
10:44
But to me, typography is everything.
-
10:47
As a front-end designer the most important skill set
-
10:50
is probably just completely understanding typography
-
10:54
and hierarchy and color theory
-
10:56
and just being able to take content and break it up into a layout
-
11:01
that delivers the content the best.
-
11:04
And for a front-end developer it's so important to understand
-
11:07
those things like hierarchy, but it's more about the technologies
-
11:13
like HTML and CSS and the code and everything.
-
11:15
Typically places don't have—don't have a position for a user-experience designer,
-
11:22
but if they do that person would have to know how to create personas
-
11:27
and how to do user testing.
-
11:30
They would work closely with the designers and with the marketers
-
11:34
and bridge that gap for the client.
-
11:36
[How hard was it to learn these skills?]
-
11:40
You know—it's actually shocking how easy it is.
-
11:43
Web designers and developers are smart
-
11:47
but we're certainly not curing cancer or smashing atoms.
-
11:52
This is something that really anybody can learn how to do.
-
11:57
I think it's very much a skill that can be picked up just by practicing
-
12:03
just like art or music or any of the other applied arts.
-
12:09
I view web design and development as not necessarily a science
-
12:15
in terms of computer science.
-
12:17
I think it's the application of those tools.
-
12:21
So it's actually pretty easy
-
12:24
if you're willing to put in the time and effort to learn the skill.
-
12:28
Learning the technical skills of web design isn't as hard as you think it is.
-
12:34
The HTML and CSS—once you understand the format
-
12:40
and the layout of the languages
-
12:42
the rest of it comes naturally.
-
12:44
I personally feel that learning aesthetics and understanding good design
-
12:51
is a little bit harder for some people.
-
12:53
Personally I come from a design background so it wasn't that hard.
-
12:57
It transpires across the plane pretty much for everything
-
13:01
in the design world, but if you are coming from a DIV background
-
13:06
or don't understand design that well,
-
13:10
it might be a little bit harder for you to understand than it will—
-
13:13
HTML and CSS programming language.
-
13:16
Learning design skills I feel is more about
-
13:22
opening yourself up to good design and knowing what is good design,
-
13:26
understanding aesthetics—why things look good and why they are apprpriate
-
13:32
in certain environments.
-
13:36
Following designers in the industry that are successful
-
13:39
allowing them to almost mentor you but not directly
-
13:43
but show you good design.
-
13:46
And then it just catches on.
-
13:48
Like once you understand it and once you are able to critique work
-
13:52
and critique it solidly, it comes very easily.
-
13:57
What I feel is good design is a solid mixture
-
14:02
of the art and the content merging together
-
14:07
creating a seamless experience for the viewer.
-
14:11
[How do you keep up with the pace of the industry?]
-
14:14
I don't keep up with industry news in very traditional ways.
-
14:19
So—for example—I don't really read a whole lot of blogs.
-
14:23
I don't subscribe to RSS feeds.
-
14:26
I don't listen to a ton of podcasts.
-
14:30
Most of the news that I get is from social media.
-
14:34
So people I follow on Twitter and people I'm friends with on Facebook
-
14:39
will post articles, and I find that that's a really good way
-
14:44
to get a very relevant filter on the world.
-
14:47
Those people are people I trust,
-
14:51
and they usually bring the best articles to the surface.
-
14:56
So when somebody like Chris Coyier or Paul Irish
-
15:02
tweets an article, I'll definitely go ahead and read that.
-
15:06
Or if they say that, "You should really listen to this episode of this podcast."
-
15:11
I'll go ahead and tune in.
-
15:13
And even if I don't have time right then,
-
15:15
I'll save the article for later whether it's just by emailing it to myself
-
15:20
or using a tool like Instapaper,
-
15:23
and then I'll go back later on and actually go through those articles.
-
15:28
But I find that social media is actually a pretty good filter on the world.
-
15:34
It tends to just get you the most relevant things the fastest
-
15:40
rather than going through a popular blog or an RSS feed
-
15:44
and having to look through and find the relevant information for yourself.
-
15:49
It's very difficult to keep up with the pace of the industry
-
15:52
because things are changing all the time.
-
15:54
Luckily I—kind of—have a job where our job is to stay up on top of things
-
16:00
and to research, but I remember working at an agency
-
16:04
and just going to networking events all the time—
-
16:07
sharing what you know with other people,
-
16:10
following blogs and reading books,
-
16:14
just dedicating time each week to stay on top of that kind of stuff
-
16:18
because it will age you quickly if you don't.
-
16:21
So keeping up with the pace of the industry is very important
-
16:27
even nowadays because we have this while device-era going on
-
16:32
and everything is constantly changing.
-
16:34
So reading the latest blog posts of popular design blogs,
-
16:39
following professional designers on Twitter
-
16:44
and checking out their work and seeing what they're doing
-
16:48
is really important.
-
16:51
Hopefully those answers gave you a little insight
-
16:53
into what it is like starting out as a web designer
-
16:56
or thinking about starting out.
-
16:58
But for all that work you put in what are the rewards?
-
17:01
Well as a new entrant to this industry
-
17:03
you're looking at starting salaries of around $30,000 to $40,000.
-
17:07
On the high end with experience, a grasp of all the necessary technologies,
-
17:11
and the ability to lead teams,
-
17:13
you can earn upwards of $100,000.
-
17:16
Web design is—as the name states—design-oriented.
-
17:20
So if you have a background in art or design
-
17:22
and want to break into the tech industry,
-
17:24
this could be the career path for you.
-
17:26
Now art school isn't a prerequisite,
-
17:29
but the job is designing websites
-
17:31
so to reiterate what our teachers said
-
17:33
you should have a sound understanding of topics like
-
17:36
color theory, typography, design patterns, and aesthetics.
-
17:40
You should also know how to use software packages like
-
17:43
Adobe Photoshop and Illustrator.
-
17:45
If this is what you're looking to start out with then don't worry.
-
17:48
We've got all the resources you need right here at Treehouse.
You need to sign up for Treehouse in order to download course files.
Sign up