8 (more) tips to help you quickly improve your UIs
In this follow-up article, I've provided you with another set of easy-to-implement UI & UX micro-tips to help quickly improve your designs.
Creating beautiful, usable, and efficient UIs takes time, with many design revisions along the way. Making those constant tweaks to produce something that your clients, users, and yourself are truly happy with. I know. I’ve been there many times before myself.
But what I’ve discovered over the years is that by making some simple visual tweaks you can quickly improve the visuals you’re trying to create.
In this follow up article, I’ve put together a small, and easy to put into practice, selection of tips that can, with little effort, not only help improve your designs today, but hopefully give you some handy pointers for when you’re starting your next project.
Lighten up your text if it's looking a little too heavy.
When it comes to long-form content, certain Regular weight Typefaces can still look a little too heavy, and stark.
Easily fix this by opting for something like a Dark Grey (ie; #4F4F4F) to make that text a little easier on the eye.
The smaller the font size, the more generous your line height needs to be.
As your font size decreases, increase the line height for better, all-round legibility.
The same applies to when the font size increases. Simply decrease the line height.
Choose a base colour, and then use tints & shades to add uniformity.
You don’t always have to stuff your design with a mass of colours.
If the project allows it, simply using a restricted colour palette, by choosing a Base Colour and then using Tints and Shades, can add uniformity to your designs in the simplest of ways.
Give prominence to the most important elements.
By using a combination of Font Sizes, Weights, and Colour, you can easily give prominence to the most important elements in your UI.
Simple adjustments to make the user experience that little bit better.
For consistency, make sure your icons share the same visual style.
When implementing icons in your UI, keep things consistent.
Make sure they all share the same visual style; the same weight, and either filled, or outlined.
Don’t mix and match.
Always make your 'call to action' the most prominent item on the screen.
You think this would be common sense right? Erm. Not always I’m afraid.
Make sure that ‘Call to Action’ is as prominent as possible, via the use of colour contrast, size, and labels.
Don’t always rely on icons alone if you can. If you can use Text Labels too, use ’em, to enable much better user comprehension.
Add an extra visual aid to your form errors.
Adding an Error Message close to the action that the user has just taken can be a simple, but helpful, extra visual aid for when they’re filling out short Forms inside of your site, or app.
Every little helps right?
Give prominence to the most frequently used action in your menus.
When designing a Menu to use inside of an application, make sure to give the most frequently used action (ie; Upload Image, Add File etc…) the most prominence on the screen.
By the way, if you want to improve your design skills fast, and save yourself hundreds of design hours, my Design System for Figma; Cabana could really help you out. Use the code CAB35 to receive 35% OFF. 👇
Thanks for reading the article,
Marc.