Image by SIMON LEE
  • antoniodellomo

Coding is Designing

Designers and developers collaborate for a common cause–to build products and experiences their customers want or need. Their shared purpose is to serve their users.


To achieve this common purpose and collaborate effectively, designers and developers should understand the other’s discipline. Designers don’t have to become coders, but understanding the basics of code and its limitations is incredibly beneficial.


Just like an architect must understand building materials to design a structure, UX designers need foundational knowledge of front-end code like HTML, CSS, and a little bit of Javascript–the building blocks of product design!



Benefits for Designers Knowing Code

Designers who learn code have nothing to lose and everything to gain. The benefits far outweigh the time it’ll take to put your head down and learn a new skill.



Better Collaboration With Developers

When designers have a fundamental understanding of code, they can communicate with developers significantly better. They’ll also earn developers’ respect, who in turn might make more of an effort to understand design.


Design handoffs are always sticky between designers, product teams, and engineers. Why? Because they speak different languages with different constraints. By learning to code, or at least the basics, designers can better understand code constraints and limitations, making it easier to solve problems collaboratively with engineers.



Understanding Development Limitations

When designers know how to code, it’s easier to understand the limitations and fix problems, especially during quality assurance (QA) after the handoff. For example, designers can use the browser’s developer tools to inspect an element’s HTML and CSS if something doesn’t look right in the browser.


Understanding technical limitations can also save designers significant time during the design process because they know what is and isn’t possible-avoiding design decisions that exceed technical constraints.



Improve Prototyping

Image-based design and prototyping tools don’t offer the fidelity or functionality of a coded product. Limiting the testing and problem-solving designers can do during the design process. Designers who know HTML and CSS can build functioning prototypes that outperform image-based design tools.



Increase Your Value

The tech industry is an exciting landscape with new roles and opportunities constantly emerging. By learning to code, UX designers can take on bigger roles, transition to new careers, and increase their value to prospective clients or employers.



Conclusion

Coding is an essential part of the design process, a launchpad to modular and scalable thinking, or a valuable design tool.


To ensure that code-thinking is part of the design process, consider the following:

  • Include a developer or two at different checkpoints during the project planning and design activities.

  • Collaborate with a developer about prototyping techniques that will benefit the project at hand.

  • Discuss a modular approach with the development team to understand how the bits and pieces of information can positively influence the design.



Photo by Alexandru Acea on Unsplash