The Unicorn: Hybrid Designer + Developer

Have you ever read a designer job listing that sounds like this?

Seed-stage startup looking for rockstar junior designer to sketch wireframes and design beautiful mockups. You’ll be responsible for crafting our logo and brand and writing UI copy. Must know how to run usability studies, prototype and write production-ready HTML and CSS.

In today’s industry, a web designer is expected to have many skill sets, so to land a job with this mysterious title, the hybrids tend to raise more interest than the specialists.

What is a hybrid? The hybrid; part designer, part developer — a talented person who can design visually, is a Html/CSS guru and yet also has the mindset of a developer. Mindset here meaning understanding the tools of the trade when it comes to web development and being able to integrate those into their workflow.

According to Visual.ly’s infographic: Web Designer vs. Web Developer, there are 1,336,300 available jobs for web developers compared with a meager 200,870 open positions for web designers. Not only is the hiring demand a huge difference, but also the salary difference is stark. The median salary for a web designer is $47,820 while the median salary for a web developer can run up to $115,430.

The hybrid or designer-developer combo is the white unicorn of the internet world. Many believe they exist, some know someone who hired one, few claim they saw one in the past, always in strange circumstances. Developers who can design and designers who can code are one-stop shops and hot commodities, especially in the startup world. Being a jack of all trades allows you to quickly and effectively take products from concept to shipment — something that young companies in particular are eager to do.

A question I get asked often is: How do you go from being an expert in just one field to a digital Swiss army knife professional?

My advice is to follow these rules:

1. Start with learning to code with HTML/CSS/Javascript. Think of web development like building a house. First you lay down the foundation, the brick and mortar. Then once the architecture is fully functional, you bring in the Interior Designer. You spice up the place, pick your color palette, etc.
2. Learn the limitations of the browser. Once you understand the limitations that come with coding for the browser you will better understand what is and what isn’t possible in your design heavy mockups. For example, that triple radial gradient or fancy dropdown that you design to pixel perfection will have you pulling out your hair when you go to code in production. Of course you could slice images for buttons, but hopefully you don’t want to sacrifice optimization for a fancy gradient overlay which you can achieve using CSS that is also cross browser compatible.
3. Never stop learning. Start with HTML/CSS basics. Then move to Javascript. Learn Javascript the right way. Don’t rely on jQuery. A great resource I have used is https://javascript30.com/ by Wes Bos. Once you have mastered these then you should move on to more advanced branches of these areas. For example, learn SASS or another CSS preprocessor or CSS in JS. After you branch out from these areas you can start to move into other related areas like learning how to use Github to store your code repositories. Finally, learn a more advanced language like React.js or Vue.js. Don’t get overwhelmed and NEVER EVER give up. Developers are not only knowledgeable, but more than happy to share their knowledge with you. At times, you will run into developers who come off as smarter-than-thou but I assure you they are few and far between. I would be lying if I told you that learning code is easy — but it’s not as impossible as you may think! I would argue that learning to code is easier than learning a foreign language, especially since there is a visual element to it. I love the satisfaction of seeing my code turn into shapes and colors on the screen that communicate an entirely new idea that I just created. The browser is my canvas, and code provides me with the tools I need to make beautiful things.
4. Market yourself as a Developer AND Designer. It is no secret that Developers’ salaries are higher than Designers, but for companies to hire you for both skillsets and only pay for the Design side is deeply gouging the industry as a whole. Stand your ground when it comes salary for your next job. I’m not proposing ask for a market rate that is double, but instead understand that your pay should commensurate with the roles and responsibilities of the job. If development is included, the rate should reflect that.
5. Designers are not the only creatives. Sorry designers, but developers are creative types in their own right, even if they don’t consider themselves to be. Too often the term “creative” is reserved for artists, designers and other visual creators. Developers are just as creative as your average designer, if not more so. We all solve problems; we just do so in different ways.

Even if you’re staying with the same employer, make sure your supervisors know about and have seen your recent cross-discipline side projects. You might ask them to consider a lateral move including a wider range of tasks or a promotion with a pay raise.

By knowing how to code, I am better able to communicate with our developers on both UI and functionality. I’ve also found that knowing at least some code leads to mutual respect.