background image

Design Matters

You should learn about design if you are a developer

I still remember my first months working as a web developer. We were sharing the office with another company and they were amazing print designers. They worked with big brands and I was a biologist diving into web development basically self taught, no clue about design. All I knew was to 'slice and dice' a photoshop file and try my best to build the design somewhat like how it looked.

The first website I built was actually one of the most complex designs I've ever built. The background was full of textures, there were polaroid pictures with scotch tape that looked like a collage. It was really cool but the first time I saw it I got almost paralyzed! It took me probably a couple of weeks to do the HTML and CSS for that website (well, maybe a bit more) and I had to learn a lot about floats and margin negative (kids, there were no grids or flex back then, ok?). I had to debug things for IE6... and that was a hell on its own. But I got through it, I built it and my bosses were happy with it. In fact, my boss told me years later that he thought I wouldn't be able to pull it off... but I did it 🎉. The feeling was great, my first real website was shipped and I felt like: "I've got this!"

This was back in 2010 and, although Responsive Web Design already existed, it wasn't really a thing for us, clients still wanted 'fixed' layout websites. If the important things fitted 1024x768 screens (because important things couldn't stay "below the fold"), we were good to go. So, my slice and dice technique worked for a while, as long as things would stay somewhat were they were designed. That first website had been designed by a freelancer web designer that worked for us. Although it was a complex design and it looked nice, there was something missing... it was clearly not a 'professional' design.

And then, about a month after I started working, I was tasked to build another website. But this one was for a big wine brand and was designed by the print designers of the office. THAT design looked amazing! THAT was a professional design and that was not too complex. There was something that made it look great, like those websites on awwwards.com. There were some tricky things that I'd have to build but I was feeling good about it. So I started building it, started making some progress up to a point where I thought it was almost done, perfect time to share with my boss and with the designers. Oh, man, how I was wrong! 🤦🏻‍♂️

There's this scene that runs in my mind so vividly until today. I recall the designer looking over my shoulder while I was showing my build and he was like: "That box is not aligned. It's like 5 pixels off" but like a good and humble developer, I obviously disagreed. He insisted and I insisted back saying it wasn't. He stormed out, went to his desk, grabbed a ruler, stormed back to my desk and put the ruler on my screen and said: "You see, it's not aligned!". And he was right, I was wrong and I hated that guy for a long time. The fact is that I kinda knew it wasn't exactly the same alignment as the original design and I didn't want to admit. For me, those 5px were not important but they were to that guy, I just didn't understand why.

So that was the first of many times one of their designers pointed out all the misalignments, wrong font sizes, wrong colors etc. on my builds. It was not easy to take the negative feedback but I'd fix most of the issues and, when I couldn't, I'd explain the "technical impossibilities" of what they wanted and they'd leave, frustrated with me. And that didn't feel right, not even to me.

I used to read all those articles and cartoons about developers and designers picking a fight with each other and I would laugh and just nod, accepting that was just how things were. Up to a point when I decided to change my attitude and learn about design. It wasn't like I wanted to start designing myself, I needed to learn their rules so I started looking for books about design concepts. I don't recall how I found out about this book, but it changed my life. The name of the book is "The Non-Designers Design Book"... it's a small, fun and easy to read book but with some concepts that just changes how you see things. I won't get into the details on this post but after reading that book, my career changed and I started communicating so much better with designers and ended up building pretty amazing websites. To a point where I found a digital ruler to measure the distances myself and shared the app with all designers I worked with.

Being able to discuss design using proper language – I mean, design jargon – gave me an advantage I didn't expect. I suddenly started talking more about design and translating that to other developers. I started paying much more attention to details (that old sentence that I saw several times in CVs and that made me and still makes me laugh) during my builds. That attitude turned into less feedback cycles when it came to the point were designers had to review my work. It led me to start overseeing other devs work and give them feedback before the builds were sent to designers for review. It was the edge I needed to become a Lead Frontend Developer and helped me to start working with other agencies, with bigger clients, and high impact projects. I was brought to big meetings, communicated with designers, other developers, project managers, clients... my professional career evolved because I invested time learning something that I didn't have to.

Another event that made me pay much more attention to design was something one of my bosses wrote about me once. He had to make a presentation to a client and he was rebuilding his main power point. He added the pictures of all the team members (we were still a small agency) and added a description to each one of us. And I recall him writing something like "Gledsley builds pixel perfect websites..." and I didn't like it. I told him I didn't do that, but he insisted in keeping it there but I didn't pick a fight. The problem is that, somehow, I knew this was being presented to every single client of ours and I had to be that guy. Only years later I found out reading some Psychology studies that by allowing that description to go public, I committed to it internally and that public commitment was a powerful thing. And then I became the pixel perfect developer that was described in that power point presentation.

Design everywhere

As a result, I started appreciating the design of everything after a while. I talked to my designer friends and our conversations would go further than just websites or print media. They'd discuss design of objects, of ambients, of experiences. One of them even shared his views about using a protective cover on his iPhone. He said something like: "look at the design of this phone, it's beautiful. It's a lot of money and a lot of design work to be hidden underneath a horrible protective cover. I want to hold the phone, feel it in my hands as it's supposed to be felt. I want to see it how it's supposed to be seen..." and he even convinced a developer to drop the horrible Pikachu cover she had for her iPhone after that speech. I still have my cover though... the number of times I drop my phone over the years is growing exponentially, but I get his point.

New lenses

Nowadays I see things differently. I appreciate the craft of each designer out there and I strive to bring these pieces of art to life when I build them. Learning these design principles opened new doors and opportunities to my professional career. But it also gave me new lenses to see the world around me. And, for that, I thank that designer who took his damn ruler, put on my monitor, and showed me my misaligned mistakes. Thank you, dude, you were the push I needed to move forward!

#en ,design ,learning ,dev