DEV Community

Cover image for Why and how you can develop Design Sense? πŸ‘©πŸ½β€πŸŽ¨
Sarthak Sharma for XenoX

Posted on • Originally published at community.codenewbie.org

Why and how you can develop Design Sense? πŸ‘©πŸ½β€πŸŽ¨

This article is reposted here, originally posted on Codenewbies.
I first started coding 10 years ago in my college lab and it was magic. 9 years ago I got my first computer and 6 months after that I started my Freelance career as a CSS3 animator. Today, I'm the captain of a great team at Skynox Tech. But at the core, I'm still a learner and creator.

Why?

Though it's totally a choice if you don't want to but there are some particle reasons for it too.

The Frontend Confusion πŸ˜•

The spiderman representing Frontend Developer Confusion

Every time we try to find a Frontend Developer for your team, it's hard. The reason behind that is because developers who are good with React they are generally rusty with CSS skills and Vice versa. So we end up post CSS Developer and React Developer post separately. To find someone good with both CSS skills and JavaScript skills is Rare and being rare is good.

πŸš€ Note: There is a great article on this already on CSSTricks called "The Great Divide" that you can read.

Boost Your Side Projects πŸš€

Most of the side hustles are done alone. It's hard to find Partners in the beginning and it takes a lot of money to hire a UI/UX Expert. What I have learned from launching 15 projects in a year on Product and getting 8 in top 5 is that Your design needs to be good. The chances of your projects to skyrockets increase if you do the design well and it's economical also. Of course, you can't beat a UI/UX Designer but trust me it will sell.

It's kind of a necessity πŸ€·πŸΌβ€β™‚οΈ

The obvious workaround for some frontend developer is using frameworks like bootstrap and Bulma. But if you're not good with CSS it becomes hard to manage code. Also, there are certain areas of UX like A11y which is a necessity in certain countries. As a frontend developer, you should be aware of that.

So in the end, To be an All-Powerful frontend developer in a true sense having a Good Design Sense can be useful for your career. Now Let's dive into the How part of it.

How?

First of all, it takes time. Before getting into how to remember that you won't be an overnight design wizard. Like all the good things it takes time and constant effort to improve your Design Sense. So once you are committed the how section boils down to three main parts.

Observe β†’ Analyze β†’ Practice

Observe πŸ‘€

Observing things around is the best but the most confusing tip I can give. The question is observing what exactly? I would say everything. Everything that is popular among people or the masses find pretty at first glance. It can be a table, a restaurant menu, popular product on Producthunt, a tweet, yes a tweet too. There is always a reason people make something popular and most of the time it is designed. Your goal is to observe and analyze why.

By doing so you are training your eyes to detect the trends.
Here are a few places to look for such inspiration.

  1. Awwwards
  2. Dribbble
  3. Behance
  4. Designspiration
  5. Producthunt

πŸš€ Tips and Trick:

  1. You can use Panda Extension so that every time you open a new tab you will see trending designs.
    Screenshot 2021-01-24 at 2.12.34 PM

  2. Collect Designs you like on Pinterest using their web extension.
    Screenshot 2021-01-24 at 2.18.26 PM

  3. Try Muzli extension, it's like Panda but more design-focused Screenshot 2021-01-24 at 2.27.05 PM

  4. Subscribe to these Newsletters to be inspired every day.

Analyze πŸ•΅πŸΌβ€β™‚οΈ

Do you know "Design Thinking" is a subject in itself? Though you can't go to college now, by Analyzing what you have observed can definitely boost your creativity. it's basically reverse-engineering the content that you observe. Here some tips to keep in mind.

πŸš€ Tips and Trick:

  1. Looks out for colours that are trending. Use tool like Site Palette to get pallets of any sites.
  2. Use a tool like What Font to find fonts combinations used in trending website.
  3. Reading books can also help you analyse design better. Here are some books to consider

Practice πŸ‘©πŸ»β€πŸ’»

This was obviously coming, right? Perfection always takes time and constant effort. Start with replicating the design by other designers (always give credits) and once you are able to do justice with there design go next step and design something of your own.

Once you are confident with your design it's time to get feedback. Here are a few ways you get advice and critique:

1. Post on Twitter and LinkedIn
2. Post on Codepen
3. Go to Subreddit like design_critiques
4. Post it on Dev.to with #showdev
5. Or you can always tweet me πŸ˜‡

Embrace πŸ’ž

This is the toughest part I guess. Once you develop design sense you have to live with it. That means

  • Making sure whatever work you put out there is your best.
  • Appreciate good design and design habit.
  • Do justice to UI/UX designer work while writing code.
  • Teaching your teammates why it's important.

Passing on your knowledge to others is the best way to polish up your skills and it also helps you develop a good design culture which will help your company and in turn help you also.

🎁 Bonus Content:

Conclusion

I hope you liked this article. Design thinking helped me a lot in my career and I'm sure it will help you as well. If you liked this article check my other articles on XenoX and Medium and share with your friends and colleagues. You can also follow me on Twitter to take part in chit chats πŸ˜‰

Additionally, If you want to share some of your own tips hit the comment section below. Will see you next time see ya.

Top comments (4)

Collapse
 
qaismakani profile image
Qais Makani

This was extremely helpful. I've been a react developer myself for quite some time, but my design skills are severely lacking because I'm so accustomed to a UX Designer telling me what to do. Thanks for sharing!

Collapse
 
sarthology profile image
Sarthak Sharma

Thanks man πŸš€βœ¨

Collapse
 
jackortico profile image
prince Jack0

want more content like this. helpful thanks😊

Collapse
 
pranta profile image
PRANTA Dutta

Thanks, man. That was really helpful.