Should a Front-End developer be a good designer as well?

No. Yes?

Maybe. And here’s why:

It depends on the work really. Here is one example: You are a front-end developer working in an agency. The task of converting a designed business site comes. What do you do?

A nightmare

It has all the twenty+ pages, sitemaps, google documents with weird explanations on what is where, what happens when you click on that button, where that other link points to, what visitors see this or that information and so on. A large portion is a stuff you should read, but not implement. Nothing out of the ordinary here.

But then you look at the 20+ PSD files you’ve received (or sometimes JPG) you see that all of them are designs for the desktop. And to make it more fun, most of them use interesting overlapping graphics, lots of content, columns and so on.

You get all that bunch of content that needs to be converted to an HTML/CSS code that is then sent to the backend developers to write it up with the CMS you’re using/developing.

In the limited time you have, you decide to write to the client to ask for tablet and mobile and the only response you get is:

“Well just make it work for mobile”.

If you’re even more unlucky somewhere in the original planning they’ve mentioned that they care most of the mobile and have 60% userbase on mobile devices or something.

And what they give you is desktop only designs. Their designer is not really active anymore or doesn’t have the time to design the mobile views.

And trust me, this can happen. You can try to communicate this with your clients, but sometimes even they don’t have much saying about it, especially if they come to you as the “professional that will fix their issues when all hope is gone”. It’s understandable, really, even if it sucks for you.

When you need to design on your own

So this is the moment when you need to be a designer as well. If you are  great, it will be a little easier. If not then you will need to find a way to show the content they have on the desktop in a much narrower space and still make it look okay.

Then sometime later you’re ready and you show the initial views to the client and they’re unhappy about the mobile/tablet. They send you 20+ comments on what needs to be changed. You do that, although if you have no design knowledge and experience you try to follow their comments as close as possible.

Source: http://www.webdesigndev.com/funny-posters-and-memes-designers-will-relate-to/

It just gets worse. Most times the clients want things that don’t look too good and if you’re inexperienced in designing you simply implement the content. It’s highly likely that they won’t be happy with it and will demand more changes.

The more they browse the newly “designed” mobile/tablet views by you they will add more and more requirements for changes, since it’s something they see for the first time. They will probably think it’s the same as when they’ve worked with the designer on their side and demand more and more changes.

As time goes by you’re now some weeks behind, the backend developer’s work is delayed from constant changes, you’ve been hacking here and there a few times, causing potential issues. Wild iPhone issues arise that need fixes. Everything becomes delayed…

Dealing with the “no mobile design” case

What would be the better approach in this situation? If you were a designer, you would’ve opened the PSDs and rearranged most of the elements, added a few new ones, removed a few so that the data remains accessible as much as possible.

Let’s say one PSD would take you less than one hour to convert to mobile. And maybe only 6–8 of the other 20+ are more unique, so that’s around 5–6 hours total worth of work. You send then these new mobile views to the client on day one. By the next morning you get feedback if everything is okay. if not you can make the changes easily on PS instead of writing front-end code.

Once everything is decided you can begin work. If you follow everything pixel by pixel you will have the leverage of saying “You’ve agreed already, what you need is changes to the original design that will extend the deadlines. Are you okay with with that”?

Summary (tl;dr)

So… why did I say No and Yes in the beginning? Because if you receive a good design spec that you can easily follow, you will produce the expected results. No design work involved from your side.

But if what I’ve described above happens, you will need to “design” new stuff in a different views, just as if they want some design changes here and there because they “don’t like it now” or “changed opinion about it” or “read somewhere that bla bla..”

Having experience in designing web elements/sites is always a huge plus when working as front-end developer. it will allow you to easily decide if something would look and function a bit better if you’re adding 5 instead of 10 pixels spacing as it’s on the PSD or creating new elements or seeing mistakes or working on revisions and feedback from the client.

As a front-end developer you should browse every now and then design gallery sites like dribbble to see what’s the current trend, how do they make it work on mobile devices, tablets, desktops, what are the best patterns for different type of elements. You should be on a good level when working with tools like Photoshop or Sketch depending on what your client provides mostly.

You can’t get it wrong if you invest your time in developing your design skills. Always strive to learn more in all possible directions!