How to start your journey as UI/UX Designer ??

Preet Raval
Skillship Vellore
Published in
5 min readAug 14, 2022

How to start your journey as UI/UX Designer ??

We humans, love to design things, whether it be architecture, shapes, tools or the website you’re reading on. This artistic need is what drives us forward in building a captivating design. The scope of this blog revolves around UI/UX designs which act as a blueprint for various websites.

What is UI/UX design?

For all the newcomers in this field, UI design is what the users see in an application: the screen, text, colour, background, icons, and animations.

UX design is the study of how users will go through all the components of UI. The flow of user experience is understood and the elimination of problems is done during these interactions. It makes the product easily accessible and enjoyable to users.

How to start your design journey?

First of all, the work starts with deciding the website you want: a portfolio design, food website, club website, etc. After deciding on the topic, go through a website that is already present and analyze it. Don’t try to clone things, rather take some inspiration from them. Focus on the things from which you can obtain inspiration for your website and try to improve it.

Secondly, choose the platform where you will design your website. I would prefer using FIGMA as it has many plugins and other exciting features. There is much other software such as Sketch, Axure, Craft, Adobe XD and Marvel that can be used instead.

Selection Of Color Palette, Font, Icon, Vector.

When the first steps are completed, we should go for the colour palette and font selection so that during website designing we won’t have any confusion regarding it.

One should decide the colour palette according to the website theme and go with the same palette throughout the website. Don’t change the palette page to page or don’t change the colour code by any mistake.

For colour selection, you can use UI Goodies Background gradient: (https://webgradients.com/?ref=uigoodies.com).

From here, one can take references for colour selection. Let me give some examples of colour selection.

These two are examples of colour references. We can go with a palette and check the colour contrast.

In the first palette. black is the background colour, followed by the font colour and vector/icon colours. Let me give some examples of the same.

One must use a font that would make the website look groovy but professional at the same time. My best picks would be “Glacial Indifference”, “League Spartan”, ” Raleway”, ” Mulish”, etc. If one has a fancy website then one can use some elegant, handwritten fonts to make the website more attractive. Here are some names of fancy, handwritten fonts: “Adine-kirnberg”,” Alex brush”,” Bedtime Stories”, “ Creation demo”, ” Eraser’’, “Great-day-personal-use” and many others.

Adding a background with texture makes the visuals more appealing. You can use UI Goodies for backgrounds with patterns. The link to the website is: (“https://www.toptal.com/designers/subtlepatterns/?ref=uigoodies.com”)

For example:

You should add your social media handles and other images too.

Plugins In Figma:

There are a variety of plugins supported in Figma. This makes Figma a very versatile software and allows you to do a lot of things.

The plugins which I usually use in UI/UX design are mentioned below:

  1. Iconify
  2. Removebg
  3. Unsplash
  4. Blobs
  5. Get waves

Let’s discuss all the Plugins one by one:

Iconify:

This plugin is used to get different types of vectors in SVG form so that we can change colours according to our needs. It contains all the emojis, social media handles, and many other things.

If we search some icons, we can find many options for the same. For example:

Removebg:

It removes the background of any images to use the elements from the picture.

These were a few examples of using remove bg.

Unsplash:

You will get a lot of pictures to aid in making sample designs instead of pictures of the person or any place, etc.

Blobs:

It is utilized to get different types of blobs to use while designing and make it more attractive.

One can make any blob shape and it comes in SVG form so one can change the colour according to your colour palette.

Get waves:

Get different types of waves to use in design and make it funky!

One can make any shape of waves and it again comes in SVG form so one can change the colour according to your colour palette.

Conclusion:

Lastly, the most important skill required for good UI/UX designing is experience. My work at various levels has taught me more about design. With every task, there is enough learning which tells me the extensive details I can add to augment my design. Every step leads toward mastery in UI/UX design.

--

--