While starting out in web development, one of the issue faced by new learners is that the projects don't look attractive or sometimes they'll use framework like Bootstrap.
As a starting point doing that would be fine but as you get to showcase your projects to a potential employers you might also want your projects to look good and make sure they don't look same as others.
For that let's see some pointers to keep in mind for UI of your projects:
🌟 Keep it Simple
As beginner you'd be seeing and wanting to apply some really awesome ideas for your projects, but problem occurs when you try to implement many complex ui elements at once.
There are certain style or asthetic every good and professional looking website follows that makes it professional looking.
But if you mixed multiple different styles in a same page then it can make your site a little messy and users might want to leave it after sometime.
🌟 Use a colour palette limited colours
On point of a particular style, you might want to use only few colors in your project, you should only use 2/3 colors to make sure it doesn't look overly colourful that is bad to look at
You can use sites like colourhunt or coolers and use pre made color pallets.
By doing this you make a personal rule for yourself and not use colors randomly that ruins your UI.
🌟 Better choice of fonts
You will notice that most of the sites nowadays use sans-serif fonts as they look modern. so you can try them too, it can make your website look modern and professional.
Sometimes you can try using monospace fonts too, as they are kinda techy and minimal fonts, if used in certain way they could look great too.
And on some rare occasion you can also try using serif fonts. I'm not saying you shouldn't use serif fonts but they can be used only on certain types of asthetics.
🌟 Use Micro Animations
You might want to give some kind of feedback on user actions, like showing message when clicked somewhere, hover effects etc...
It doesn't look good when there is this success message that just comes and hides randomly, you can apply some fade animation quickly using CSS, so why not use it.
🌟 Making your site mobile friendly
Most of your users will be coming from mobile devices so you might want to make sure that your website is also looking better at a different screen size.
That is a whole different section on how you can make your site look better at mobile screen size, so do your research on it too.
These are just some pointers to reference but there are so many things to make sure of while making or improving UI designs as a developer
If you found the content i share useful than share it with your developer friends and also follow me on Instagram and Twitter
Top comments (0)