UI and UX micro-tips: part 7

Sometimes it takes only minor changes to your design to create effective and beautiful interfaces.

In this article, I’ll present another collection of easy-to-use micro UI and UX design tips.

Tips to effortlessly improve both design and user experience.

Want even more micro UI and UX design tips? Then check out my previous articles:

Let’s get started …

1. Texts should be short and sweet

Always try to keep the lyrics short and to the point, and speak to the user in a language that is easy for them to understand.

If you don’t need jargon, drop it. By providing the user with clear and concise messages, you will help them achieve their desired goals better.

UI and UX micro-tips: part 7

2. Try a 20pt font size for large amounts of content

For long content (e.g. articles, project descriptions, etc.) use font size for body text twentypt (or even a little more).

Of course, the font used has to be considered, but the most popular fonts look great at 20pt and provide the best reading experience for your users when they are faced with a wall of text.

UI and UX micro-tips: part 7

3. Don’t rely solely on color for error messages

As vivid as the color in your projects is, never rely on it alone to convey important information to the user.

For example, for a shape error condition, one red border is not enough for a large proportion of users.

Adding an icon and descriptive text will better convey the desired information to the user, and at the same time increase accessibility.

UI and UX micro-tips: part 7

4. Create a harmonious vertical rhythm with a 4pt baseline grid and an 8pt grid

When it comes to type, combining a 4pt baseline grid with an 8pt grid results in a more harmonious vertical rhythm in your designs.

Align the font to the baseline grid 4ptthat uses a multiple of 4 for the row height (4, 8, 12, 16, 20, etc.).

Why 4? For me, scaling the baseline grid to a multiple of 8 in the past has pushed the lines too far apart when dealing with specific font sizes. While using a 4pt baseline grid provides more precise control and significantly better results.

UI and UX micro-tips: part 7

5. Reduce letter spacing and line height in headings

Unlike long body copy, headlines are usually much shorter, allowing reduce a little the height strings

Also, they are more likely to be typed in a larger font size, and the letter spacing will appear optically larger, so reducing the letter spacing will help the headings look more balanced.

Reduce letter spacing and line height in headings to achieve optimal cheatbelnawn

UI and UX micro-tips: part 7

6. Use drop shadow or thin border to highlight elements!

Using multiple drop shadows or a very thin 1 pixel border (just a couple of shades darker than the actual shadow) around certain elements can render them sharper and clearer

Following this simple technique can make elements more visible, help avoid smudgy shadows, and give your designs a certain polish.

UI and UX micro-tips: part 7

Hopefully, with these little tips, you can see how even the smallest design changes can lead to better end results for both you and your users.

Thanks for reading.

Leave a Reply

Your email address will not be published. Required fields are marked *