I’m writing this post for anyone who is interested in building web applications. The topic is really “Are you sure you want to be a webdesigner?”, and I’ll talk a little bit about _my opinion_ on what a good webdesigner needs to do and what their job is.

First, I want to clarify the terms a little bit. Designer is an extremely broad term and I generally break it down into three categories.

Designer

Required Knowledge: Photoshop

I tend to use the general term Designer for someone who is 100% focused on the design of something. That means they spend their time in Photoshop and send PSD files to the client when they are done with their part of the job. A designer is usually not as valuable as the other categories that I cover below, because they are not able to take the project from concept/drawing to actual product. In other words, they don’t implement what they design. A really good designer can still be invaluable though, if they know the constraints of implementation and the experience to crank out really phenomenal designs then they can certainly make a very good living off of just Photoshop.

Interface Designer

Required Knowledge: Photoshop, HTML, CSS

Interface Designer is pretty much just the term _I_ use for this category of designers. The Designer above is still designing the interfaces, but it’s the job of this designer to both design _and_ implement them. You need to be proficient with HTML (and preferably their slimmed-down versions HAML and/or SLIM) and CSS along with a modern CSS framework like Bootstrap. This type of designer can be the most key element of any startup, they can also be an extremely valuable addition to any consulting team. The design comes first and foremost, you might do some work in Photoshop or you might do everything in HTML and CSS from scratch (which many recommend). But your primary focus is always to make the product look good, you don’t care about what happens on the back-end when you click a button, it’s your job to make sure that the typography, positioning and look-and-feel of that button is right.

Experience Designer

Required Knowledge: Photoshop, HTML, CSS, JavaScript

The Experience Designer is responsible for exactly the same thing as the Interface Designer but they are one step up on the value hierarchy, they have some experience working with a back-end (not writing it, but communicating with it) and they have full responsibility for how the product behaves. This goes beyond just look and feel, but what a button says, how menus work, etc. It is your responsibility that the user who comes to a site has a great experience, this means being met with a pleasant functional design _and_ an easy to understand usable interface. You don’t take directions on how a site works, you decide how it works, design it, implement the front-end part of it and makes sure that the back-end meets the expectations you set.

What does it take to be a good designer?

There are few factors that go into being a good designer, no matter what type you are. First and foremost, you need to have a passion for design and for the user. It is always your job to look after the user. It can be to just make sure that what they look at is pretty, or it can be to make sure that they have a fantastic overall experience  visiting the product you are working on.

You need to be born with a sense of aesthetics. I usually hate to say that you need to be born with something, and it is true that you can train to become a great designer, with enough time and experience you can get there. If you’re really passionate about it then you will probably have already made that trip by now and you won’t be reading this article, so if you’re reading this, then you are likely to need to have some successful prior experience with some type of artistic endeavour.

I am not born with this sense of aesthetics. I can tell the difference between Arial and Helvetica and I can tell a good design from a great one, but I can’t sit down with a blank canvas and decide what colors to use and what fonts to use. I have read many of the resources that exist on becoming a good designer and I can recognise these factors on an existing website, but starting from scratch, applying that bulk of knowledge and ending up with a fantastic product requires that spark of creativity that is extremely hard to train.

So, to answer the titled question, answer this: Do you like people, like figuring out how people think and act, and have a spark of creativity that allows you to create something beautiful from nothing?

Resources

Alright, let’s talk resources; how does one practically become a good web designer? Let’s start with the holy grail of web design resources: https://github.com/dypsilon/frontend-dev-bookmarks

If you read everything that is linked on this site then you will know almost everything there is to know about web design and front-end development. If you are unfamiliar with the term front-end development then that is the same as my term Experience Designer. Front-end relates to everything that the user sees, back-end relates to everything that is on the server that the user doesn’t have any knowledge of.

Of course, the above link is extremely dense and hard to get in to, much of it is irrelevant and you should certainly not try to start learning everything that is on there.

My own personal recommendations follow a bit after what you aim to do.

Hack Design To learn generally about design, what to think about and what is important. This is a prerequisite for anything you intend to do in web design. It is absolutely not the definitive guide on the matter, there are many e-books, web sites and blog posts covering the same topic, but this is a good start.

Codecademy Web Track Codecademy is generally a good place to learn programming and they have a web track to learn the basics of HTML and CSS. Start here if you want to actually be able to implement your designs.

For further study after this, I will refer to sections of the above holy grail resource link, I refer to them here in the order I think they should be learnt.

  • Read the rest of the links under the “Guides” section.

  • Page through the links under “Programming & Markup Languages” -> “CSS” to deepen your knowledge a bit on CSS.

  • Take a look at the “Typography” section and try to read some of the material there. If there’s an article you don’t understand, just skip it, there are some esoteric subjects or some articles that requires knowledge beyond what you would have right now. You can revisit those later if you wish.

  • Check out some of the introductory material under ”Programming & Markup Languages” -> “JavaScript”, especially the book Eloquent JavaScript

  • When you have a grasp on JavaScript, start taking a look at jQuery under “Frameworks” -> “JavaScript” -> “jQuery”, you can skip the stuff on developing your own plugin, as you likely won’t be doing that any time soon.

  • Learn more about a CSS framework, I suggest Boostrap, under ”Frameworks” -> “CSS” -> “Twitter Bootstrap”

  • Finally, to see where your new skills can lead you, browse through the various links under “Jobs & Hiring”

Working with design

Once you have legs to stand on in the design world, you want to start working with design as soon as possible, the sooner the better. The only way you will become truly great is to work with many clients in many different circumstances with many different types of requirements. When you’ve seen enough situations you will know what to do in each of them, which solutions have worked before. Most importantly you will know which jobs aren’t worth taking, there are many of those.

Fortunately or unfortunately depending on your preference, the role of the designer is often temporary. There are many companies (especially startups) that appreciate the value of a good designer and will have one or several on board full-time to create and continually sculpt their product. However, there are many more companies that just want to create something and have a designer on board initially, and after an initial design is provided there is no real need to continually update the design and thus the designers role becomes redundant. For this reason many designers only work on a project-basis and are either banded together as a design firm or will be working as freelancers by themselves. Something that will boost your ability to get work is to team up with a willing back-end programmer (or learn that yourself as well) so that you can create full websites from end-to-end. The amount of people looking for web consulting work creating their company website is infinite, while the amount of jobs looking only for a designer is quite limited in comparison. However, the quality of the jobs only looking for a designer is almost guaranteed to be better than the quality of the jobs looking to create “a company website” of some sort.

The ideal way to work and what to aspire to will differ greatly among people. Personally, I think the peak of a designers career is to work on a product of their own, whether that means starting your own company for this product, being part of a startup or just work in a company where you are responsible for the design of a product given to you; if you control the design of the product you have ultimate freedom to create something great.

That said, most jobs will not have  you in a position where you have total freedom and you will see your artistic abilities limited, sometimes you will even see your creation destroyed by horrible committee decisions. There’s nothing you can do about that other than take the cash and move on to the next job with that experience in your backpack. Soon enough you will learn to recognise these situations and perhaps take command of them so as to not let it happen again.

So the question is, where do you find work? The best way, as always, is obviously through contacts of your own. Make sure you network and that you put your name out there, don’t be afraid to take on work that you think is over your skill/capacity, that is one of the few ways to improve. All programmers, designers and I’d argue most other professions as well learn on the job, so should you.

If the above method fails there are three primary resources I would use until I had a solid portfolio to show off.

  • Participate in 99designs competitions! Participate in as many as you can, this is essentially work for free, but it’s an excellent opportunity to see real projects and try out and practice your skills. If you start winning some competitions there’s possibility to earn money as well, and the better you are the higher the chance to win something. The benefit is that it doesn’t matter if the result is terrible, you don’t _have_ to deal with a client. It’s also a good opportunity to find out if this is actually something you like doing or not.

  • Create a profile on Odesk and Elance. One company recently bought the other so they are essentially the same now, but they still have quite different cultures and users. Some like Odesk and some like Elance, my tip is to create a profile on both and start looking for projects and apply to them. With an empty profile it will be hard to get any work, but if you get a portfolio with 99designs and have a properly filled out profile then you are a step ahead of many others on the site. You also get to set your own price (or choose to work on projects with only an acceptable payment), so you can try to increase your likelihood of getting something by starting out low and progressively increasing your price.

  • Look at remote job boards for temporary (or permanent if you want) positions. There are quite a few good boards for remote jobs now and I will leave you to google for it yourself, but I can recommend 37signals latest board We Work Remotely.

  • Check out Folyo, if you can land a spot there then you are pretty much golden. Unfortunately they have removed the ability to browse the designers in their registry so you can’t draw much inspiration from them anymore. However, all accounts there have Dribbble and/or Forrst accounts, and you should too. So you could look there for inspiration.


tetris