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