Hello (Code) World!

Like many graphic design students in college in the early to mid 2000’s, I didn’t take a single coding class during school. All I cared about was Swiss typography, paper, and ink. I dreamt of being a poster and book designer for the rest of my life. Now, as a designer at Braintree, I’m able to take on graphic design projects as well as front end development projects. It’s been a pretty cool journey and I took a few lucky turns. But there was a point when I felt overwhelmed and unsure if I wanted to jump into this code thing. When you’re staring at a screen filled with matrix-style text instead of photos and type, it’s pretty scary. Once I got over the fear and jumped in, it turned out to be one of the most rewarding decisions I’ve made in my design career.

I really want to help anyone else that is considering a trek down the same path. So I reached out to some friends that are doing visual design work but aren’t sure if they want to learn to code. Here are some common questions they had and answers from my own experience:

Do you think all designers should code?

Definitely not. If you force yourself to do it and you aren’t interested or even hate it, you will be miserable. But if you’re at all interested in learning, I would highly recommend taking that first step. I’m not going to lie, it isn’t easy, and I hit roadblocks pretty much every day. I even had a moment when I wanted to give up completely. But it gets easier. Being a designer and developer is a long journey and I’m just excited to know more than I knew a few months ago.

Where did you start?

I started out doing basic HTML/CSS Treehouse tutorials out of curiosity. While I was working at a web design agency before Braintree, I secretly started building out small components of the websites I was designing. Specifically product modules and playing with hover states. It was really fun to see my designs come to life in the browser and to tweak them in real time. I had a moment when I thought, “Maybe I can do this.” I continued with Treehouse and Code School, but I really wanted to learn alongside other aspiring developers and to be able to ask questions on the spot. I eventually enrolled in classes at Startup Institute and The Starter League in Chicago.

Do you enjoy it?

I really do. There’s something about typing out lines of code, hitting refresh in your web browser, and seeing exactly what you were anticipating (although, a lot of times it’s not exactly what I was anticipating). I also enjoy the change of pace going from a robust graphics application like Photoshop or Sketch to jumping into a lightweight text editor and vice versa. It’s fun to know that you can actually build something yourself that will be used on the web.

What are the most useful things to learn?

It all depends on what your goal is. A milestone I created for myself was being able to build out a very simple static page, which is basically a page that doesn’t require any back end code knowledge or dynamic content. For a project like that, all you need to know is some basic HTML and CSS. So, figure out what you want to build, and find out what you need to learn to build it.

What opportunities does it bring from a career standpoint?

In the beginning I honestly didn’t think of learning code as a career move. I just wanted to build the things I was designing. But it is obvious that having this knowledge is a huge plus, especially if you are working (or want to work) at a startup or tech company. Also, if you are doing client work on your own, you won’t always need to outsource the development work if you can do it yourself. I was feeling stagnant in my design career when I started dabbling with code. It opened up a new dimension for me to grow as a designer. Now the learning path is pretty much endless.

Is it worth all the time, effort, and possibly money?

For me, definitely. When I first successfully completed a code project, I remember feeling so empowered. I thought to myself, “Wow, a year ago I wouldn’t even have attempted a project like this.” That feeling is priceless.

Does it save you time?

In a sense, it does. For example, before I did any front end development, I would spend a huge chunk of time creating a pixel-perfect website comp (a highly-detailed image of what the website would look like) in Photoshop. This included making sure everything was exact -- colors, font sizes, spacing, etc. This would then be handed over to a front end developer to be used as a guide to build out the page/site. For a responsive page, I’d have to make comps for multiple screen sizes. For any interactive parts, I would have to create additional comps to show things like hover states, drop downs, transitions, etc. It was very tedious. Now, I’m able to create a rough comp and finesse the details in code. The freedom to make changes on your own is also way more efficient. If I need to make my blue button a little darker, I don’t have to bother a developer to do this. It feels way better to sweat the details in the actual build of the page rather than in a huge Photoshop file.

Why do I need to learn to code if I can just use one of the free website builders available online?

Using a website builder can feel pretty limiting for a designer. You won’t have complete control of the design unless you have a good understanding of html/css. You also won’t be able to say that you designed the website because the website builder’s design team actually did 98% of the work. (Note: I do think website builders are amazing tools to quickly build a simple site without the use of code.)

How will learning to code help me in my design efforts?

If you know how something is built, it will definitely influence your design decisions. I used to only focus on user experience and visual impact when designing for the web, but after some development knowledge, I also think about maintenance (will this site be easy to update?), modularity (can parts be reused for efficiency and consistency?), development effort (is this visual execution worth the amount of code complexity?), etc. Now when I design a comp, I’m instinctively thinking about how it will be built even if I’m going to hand it off to a developer.

Should I just learn enough code to be able to more clearly communicate with developers?

Sure, that’s a start, but what is “enough”? Also, the best way to learn about code is to actually write code.

Is it too late for me to learn?

I don’t think it’s ever too late. Plus with all the tutorial websites, blog articles, and schools now available, you can get ramped up pretty quickly. If you’re learning something, you’re growing. If you’re growing, you’re moving forward, not backward. For me, getting into code has been a great opportunity to become a student again. It was humbling to take a look into this side of design and development and realize that I was just scratching the surface.

If you are a designer curious about coding, front end development, or just building for the web, it’s a great time to jump in. While you might feel lost and frustrated at times, that’s all part of the learning process. The reward of seeing something on the web that you designed AND coded will be well worth all the blood, sweat, and tears. If you still need a push and want to chat, feel free to tweet or DM me at @paul_maeda.

Paul Maeda Paul went to art school, taught English at a junior high school in Japan, narrowly survived a few agencies, and now he designs things at Braintree. More posts by this author

You Might Also Like