9 Reasons Why You Should Learn Coding as a UI/UX or Visual Designer
I've heard, seen, and, personally, been through this dilemma of code or not to
code for months now. In this article, I'm going to share with you 9 solid
reasons why I believe learning to code will be a profitable investment on your
end as a designer in the 21st century.
But before I begin, I know some of you may believe differently and that's totally respectable. I don't intend to convince you to enroll yourself in a coding Bootcamp.
I intend you to look at the infinite possibilities that open up when you, as a designer, supplement your design career with development tools like HTML, CSS, JavaScript, Angular, React, etc.
"But I'm a designer. I don't need to learn to code. Plus it's so boring and monotonous. I would rather spend my time designing some beautiful UI screens for this hypothesis app. Plus I never wanted to be an engineer. Give me one good reason why I should learn coding as a UX/UI designer!"
This is the most common argument any designer would put up when confronted
with the idea of learning how to code. I was one of them. But then something
weird happened to me.
Up until last year, I was perfectly fine with just
knowing the basics of visual design, some design software from Adobe, and tons
of practice in making print graphic layouts. But then something changed...
What convinced me to learn to code?
I was doing just fine as a visual designer. I was able to make static pdf
documents that looked pretty neat and interesting. I could create simple and
sophisticated marketing collaterals such as Social media posts, newsletters,
and presentations for my clients and myself. I was very well versed with
typography, colors, layouts, and other graphic design-related stuff.
But there was something lacking. I could feel it in my gut. The digital
experience was going to hit me hard in the stomach. The world wide web and the
pace at which people were moving to the virtual world were alarming for
designers all across the world. It was taking away all the attention from
print media and static forms of visual design.
Designers with conventional jobs or traditional skills were soon going to go
out of business. But at the same time, it opened up tremendous opportunities
to take visual design beyond the physical borders of canvas size, print size,
ink, billboards, and other forms of platforms.
Digital screens now made it possible to create responsive designs that
transform according to the screen you viewed. Motion design and animations
were going to revolutionize digital experiences.
I was overwhelmed by such a dynamic future of digital media. I didn't want to
be left behind. So I started my own research on web and app building. I stood
up late at night studying and learning all about UX and UI design. Heck, I
even completed the very famous Google's UX Design Certificate Course. I tried
building websites using templates and website builders like Elementor and
Webflow. I taught myself Figma and Adobe XD for wireframing and prototyping
screens.
But I could never build a functional web page or app that I wanted! I would
imagine a cool design feature but could only sketch it out or visually create
it in design software. There were all sorts of limitations and subscriptions
with these builders. All because I was too afraid to learn to code. I have
hated coding and computer programming since high school.
But all this refrain had to end now. I no longer wanted to be the designer who
acted like an architect and made all the construction drawings and beautiful
renderings but could never build anything in reality. So, here are my 9
reasons why I started learning web and app development with both designing and
coding in one package.
To save time, jump to a section from:
1. You'll Understand the Fundamentals
You surely cannot build a house without a solid foundation. It'll simply
topple.
Knowing web development languages will provide you with a fundamental
understanding of the web before you get on with the design.
Once you'll learn how the web works, how the different elements on a web page
relate to each other, and how all the pages are connected to each other on the
web, you'll be able to design better.
HTML5 teaches you how important semantics and tagging are for the content on a
web page. It's a markup language and without this language, we cannot tell our
internet browsers that this paragraph is supposed to be under this heading.
Think of it as a skeleton of the web page.
Similarly, CSS is a language that tells your browsers that the background of
this page should be light grey and the links should be blue. It's all about
the way content appears on the screen. Think of it as the skin of a body with
the HTML as the skeleton structure.
Lastly, JavaScript is the language that makes everything functional on the web
page. It is responsible for making everything work perfectly on the page from
subscription forms to ad banners. Think of it as the muscular system and the
rest of the organ systems in the body that help us live every day.
Now I know, it's the job of developers to know coding and all these languages.
But if designers are also well versed in the development fundamentals, it
makes the whole process of working on a digital product much simpler.
2. You'll bridge the gap between Form and Function
Designers love to dive deep into complex visual experiments. They love to play
around with gradients, realistic textures, 3d visualizations, and crazy
typography. They enjoy creating glass effects, complex animations, and visuals
that can be too artistic.
Often, if not controlled, they end up making designs that are simply not
feasible. They can be impossible for the development teams to build. They can
be too heavy to load for end users on their slow 3g internet connections. They
can also be too confusing or too out of contrast or too much to consume. It
could take forever for the user to find out what they were looking for to
actually complete their tasks. They could consume a lot of precious
development time and energy simply to create a feature that doesn't bring any
value to the product.
In short, designers should be familiar with coding in order to make more
feasible design decisions beforehand. This would save the product teams a lot
of time, effort, and money.
3. You'll be able to Build what you Design
I had a client that wanted to build his company's website but didn't have the
budget to hire a full-fledged design agency. So I offered him a reasonable
deal and started off with the project. Of course, I didn't know how to code
but I wanted the project and I was willing to figure out a solution on my
own.
Halfway through the web design, I realized that without adequate knowledge of
code, I'll have to depend on a lousy web template. Since I had no choice and
the clock was ticking away, I resorted to the template solution. Do you know
where I got stuck?
The moment my client and I agreed to change the layout of the way blog posts
were displayed on the website. We both hated it but since I couldn't build my
own designs, I had no alternative but to forfeit and find my way out of the
change.
Since then, I've come a long way and today, when I wish to enter a content
navigation list to my blog posts, like on this one, I open the HTML editor
without fear. I go down to the content list and nest it within nav tags while
providing each list item with an anchor tag linking to the heading tags of
each heading that has a suitable id tag. Similarly, if my blog images are
messed up. I add the suitable width and lazy loading tags in the HTML editor.
Didn't get the above HTML semantics? Don't worry. Simply learn to code. You'll be able to build what you desire without succumbing to cookie-cutter templates or waiting for help.
4. You'll be able to talk to your Developer Mates
Ever been on a professional team and still felt left out on purpose? That's
how some UI UX designers feel in product teams.
Once the designers are done with their high-fidelity prototypes, it's time for
them to sit down with their developer colleagues and hand over the design for
development. Word by word. Pixel by pixel. Line by line.
At times, if the designers are unaware of the development, it can be a bit
difficult to communicate the designs. How so? Let's say you're communicating a
design feature that involves an image.
Now you want this image to work perfectly on different screen sizes. The
developer asks for different image sizes for her to code all the sizes for
different situations. You just don't get it. You argue with her about why one
single can't work well with all screen sizes. The developer tells you that
it'll be heavier to load and might get pixelated. You still don't get it and
sadly, you don't have different sizes of the same image.
What happens? You end up in a spat with the developer and this becomes an HR
issue. HR calls you in and tells you that you need to improve your
communication skills and teamwork spirit. All because you couldn't take out
some time to get a good grasp of coding so that you could be beer buddies with
your developer colleagues!
5. You'll be able to set yourself apart in the market
Do you know who is a unicorn in the web industry? A full stack developer with
vast knowledge and skills in front-end development, back-end development, and
UI UX Design. A complete package. Obviously, they're rare to find and
companies all across the globe are looking for such creatures.
But if we look at the current market demand in this field, we'll find that
companies are looking for professionals that possess a multitude of skills and
flexibility and adaptability to stay fresh in the job market.
For the past few months I've been digging up jobs on LinkedIn, Indeed,
Glassdoor, and many other platforms, and guess what I found for UX UI
Designers? Everyone's job description says that you need a basic understanding
of HTML CSS and JavaScript. All of them are looking for, and are willing to
pay a hefty amount for such mini unicorns.
Moreover, UX UI design has become so popular so quickly that more people
entering this field means that there's more competition than ever. So how do
you, as a designer, make yourself stand apart from the competition?
You up-skill yourself with coding knowledge. You follow the T shape skill
curve that says you ought to be efficient at a variety of skills, such as the
horizontal line of T, and specialize in one field i.e. the vertical line of
T. You could specialize in accessibility design while possessing the
vast knowledge of web and app design and development along with the
functioning of several assistive technologies.
What's the best part about all this? You'll never become redundant in your
professional career. You'll never be looked down upon by young talent. You'll
never be tossed away for promotion. You'll be able to ask for a raise without
a hint of hesitation. And finally, you'll be able to become financially
independent by setting up your own sources of passive income or side hustles
or hell, even your own business.
Related Post: Jakob’s Law of Familiar Expectations: Why the search icon is shaped like a magnifying glass?
6. You'll appreciate the effort that goes into development
It's commonly said that managers don't understand how their employees get the
work done. It's also said that the design and effort that goes into designing
are often overlooked and under-appreciated in our society. Some even say that
bosses don't care about designs, they care about profits and ROIs. But what
about the effort put into actually building a digital product?
Do you know how many lines of code have to be written to set up a simple
'Hello World' page on HTML? Approximately 150. Without styling on CSS or
programming on JavaScript.
I realized this when I sat down myself and spent 18 hours learning and writing
the most basic HTML semantics. It was exhausting.
Eventually, VS code editor did make the job simpler with its automation but
writing code is still an extremely difficult and valuable task. One missing
bracket and the page won't show up.
What's more difficult? Finding the missing bracket among the hundreds of lines
of code. It's like finding a needle in a haystack.
And did I talk about building a strong memory for all the semantics? While
styling a border in CSS, you can give different values to different properties
by typing them in the correct order of border width, style, and color. I found
it really hard yet rewarding to memorize such orders and tags that are
necessary for the page to function.
So, as a designer, it's easy for you to change the page styling by simply
selecting some functions in the right bar of Figma or Photoshop. It's tons and
tons of lines of code for a developer. Once you learn how to code you'll
understand and ultimately, learn to appreciate the task.
7. You'll be able to build your own products and monetize them
Have you ever had a mind-blowing idea for a mobile app that could possibly
make you a millionaire? But all you could do is sketch out your idea and look
for developers to build it for you. There goes the dream of making money out
of your own apps and web services. All because you didn't want to learn to
code?
With inflation on the rise and companies cutting back their budgets by laying
off employees in mass numbers, having a personal business or a passive income
source seems necessary.
With coding knowledge in your head and development skills in your hands, you
could build the next revolutionary digital products and make an impact on
others' lives.
And possibly earn way more than your day job from selling digital products
like ebooks, templates, graphics, images, and other resources; selling
subscriptions to high-quality content; affiliate marketing for other companies
based on your readership; earning ad revenue from your websites and apps, and
selling several online services. Take leverage of the creator market and
attention economy.
There are infinite possibilities in today's digital market space. Code is the
new crude oil of the 21st century. It can make you rich while you're asleep on
your comfy bed with your lover.
8. You'll be able to take your design skills to a whole new level
Web development languages allow you to experiment with designs beyond your
wildest imaginations.
Up until now, designers were restricted by physical dimensions. But the
digital dimensions allow endless possibilities. One could experiment with all
visual design principles in ways that are practically impossible in
print.
Code can create immersive experiences that experiment with motion design
within typography and illustrations. It can change the way navigation works on
different web pages. Hop onto the website of Apple and you'll realize what I'm
talking about.
Related Post: Fitts’s Law of Acquiring Touch Targets: Why we want the buttons to be bigger, bolder & brighter?
9. You'll be able to make a successful career transition
If you're the one who's stuck in a field you don't enjoy anymore and would do
anything to get into UI UX design, I've got some good news for you. Web
development and design and related fields don't need you to hold a lawyer's
license or a medical practitioner's years of experience. Almost anyone with
enough grit and passion for learning about digital media can make a career hop
here.
I myself belong to an architecture background. It took me 5 years of grad
school to get my architecture license and 3 years of working in the field to
realize that architecture is not what I wanted to spend my life on. But the
transition wasn't easy. It isn't complete yet so I must not stress much here.
It took me months of studying and learning and preparing portfolio projects
and applying for UX schools to finally get a break.
With time, I've realized that this field is overcrowded with professionals and
amateurs from all kinds of academic and non-academic backgrounds. So, what
could I do to make myself different from everyone else? What could I do to
make up for all those years spent studying architecture when I could've
learned about the web?
A dear friend of mine advised me to learn web development to truly excel on
this path. Recruiters and executives are always looking for people with
interesting backgrounds and the ability to harvest multiple skills. It doesn't
give the impression of being a jack of all trades master of none.
Rather, it shows that you're a quick learner, enthusiastic, problem solver, a
go-getter, proactive, and above all, possibly a valuable resource to the
enterprise. It conveys that your professional values are way beyond what
society defines for you. It shows that you're willing to get out of your
comfort zone, willing to learn an alien language of the web, and portray
perseverance to push beyond your limitations.
What if I don't want to code?
Hey, it's your life. It's your decision. And you'll be the one bearing the
fruits of your decisions.
Here I would say that ultimately coding is not for everybody. Not everyone
enjoys sitting in front of a computer screen and typing hundreds of lines of
code. Not everyone can grasp the logic of web languages and programming. Not
everyone is made for a job that involves hours and hours of coding with bursts
of frustration when the code doesn't work. Not everyone likes to work on the
development side of the web.
Some prefer to stay on the research and design end of the web. Some find joy
in conducting usability tests and competitive audits and interviews for UX
research. Some prefer to stay with the visual design of screens. Some prefer
working on copywriting or UX writing along with marketing teams.
Some wouldn't mind sticking their heads in the information architecture of
digital products. And there are some who would rather stick to back-end
development with the server side of the web rather than taking up the extra
work of front-end development.
Every individual is different with different strengths and weaknesses and
interests. If you don't want to learn to code, then don't. Although I would
suggest, from personal experience, not to give up before trying
something.
If you try coding and end up enjoying it, then go ahead and sharpen your
skills every day. There are tons of resources available for you in the
information age. I started learning with
freeCodeCamp
because I enjoy their style of teaching web languages.
I've come to realize that before getting a strong hold on design, I need a
stronghold of development. Maybe your realization turns out differently than
mine. But you wouldn't know if you didn't give it a try.
The above article was to simply show you the benefits of an added skill in
your quiver. If your views are different from mine, I respect them and feel
free to comment.
If you found the above article exciting or interesting or if you gained
anything valuable from this, do me a favor, and leave a comment, or better,
share it with your friends, family members, colleagues, batchmates, buddies,
and your social circle!
