Whether it’s out of personal desire to push their knowledge-base further or in response to industry demands, many designers are learning more traditional developer skills. Designers who learn coding skills often find their marketability enhanced when they can tackle much of the front-end development for web or mobile projects. If that sounds appealing to you, here’s a brief guide for moving from designer to developer.

Designers are often apprehensive about moving into coding and development. One designer explained that “design and programming represent two completely different ways of thinking.” I would argue that, while different skills, there is sufficient overlap and similarity to make the transition easier than most people think.

Both the designer and developer skill sets represent a combination of art and technical skill. A modern-day designer is not highly employable without knowledge of the technical tool set. Similarly, a developer with only technical skills and no understanding of the art of software development is likely to be relegated to only entry-level positions.


First Steps

The first step for most designers who want to move into coding is learning HTML. HTML has been around for 20 years, and its most current version is HTML5. HTML provides structure for the content on all websites, mobile sites, and some mobile applications. The HTML5 iteration of the language adds features geared towards mobile users and creating more complex web applications with its new Javascript APIs (Application Programming Interfaces).

There are a number of resources on Skillfeed, Shutterstock’s new online learning platform, that are perfect for first timers who want to learn HTML. My own award-winning HTML course is available as part of your Skillfeed subscription.

Like driving a car, you can’t learn HTML by watching lectures alone — you have to get actively involved. Try lab experiments that allow you to practice the techniques discussed in videos or in books. In other words, write some code and try it in your browser. The more you write, the better you’ll get at it. Often, you’ll make mistakes, but finding those mistakes and correcting them are an integral part of the learning process.

What’s Next?

Once you’ve wrapped your mind around HTML, the next step is to immerse yourself in CSS. CSS, which is an abbreviation for Cascading Style Sheets, is the language used to determine the design of your web and mobile documents. I can guarantee that CSS will seem strange at first, but as you understand it better, you’ll likely find it a powerful way to style documents.

With CSS, you can control everything from typography within your document to the layout of the document itself. Developers skilled in CSS can change the entire look and feel of a document with just a few lines of code. To explore the power of CSS, I recommend checking out CSS Zen Garden. Using a common set of HTML code, this site demonstrates the dramatic impact CSS can have.

I have found that developers rarely understand CSS well. However, it seems very appropriate for a designer to be an expert in CSS coding. You will find that understanding CSS gives you complete control over how your designs will appear on the web or in the mobile space.


Become a Coding Superhero

After you’ve got HTML and CSS down, it’s time to move on to Javascript. Javascript is increasingly becoming one of the most important programming languages. It’s processed by browsers, which are used universally on laptops, tablets, and mobile phones. Javascript has also become increasingly powerful, with new libraries available regularly to exploit the power of the language.

Learning Javascript is a bit different than learning HTML and CSS. Javascript is one step closer to a full-fledged programming language. It’s partially object-based, and has a similar command structure to languages like C and Java. (Don’t confuse Java and Javascript!) It’s a steeper climb, but once mastered, it does allow you to create dynamic applications within the browser.

My Javascript course is also available on Skillfeed and is very highly rated. Check it out!

Learn The Libraries

Once you’ve learned HTML, CSS, and Javascript, you can dig in to the many libraries available to make developing with these technologies easier. For example, jQuery, a powerful Javascript library, makes quick work of many common tasks. The Bootstrap framework makes laying out responsive designs a breeze. I would caution you, however, that many people attempt to learn the libraries before they understand the basics of HTML, CSS, and Javascript. This, in my opinion, is a mistake. You can only fully take advantage of these languages if you understand the technologies they are built upon.

Whatever path you choose, remember to have fun as you make your journey from designer to developer. Feel free to drop me a line at mark(at)learntoprogram(dot)tv and be sure to visit learntoprogram.tv along the way. I’m happy to help!