How small design tweaks can level-up your App’s design

Image Credits: https://dribbble.com/Jonlehman

1) Improve the navigation

How?

🔹 Minimize the links:

Minimize the navigation link or icons to the critical areas of your App. The rest of the links you can hide under a “more” section.

🔹 Rename the links:

Rename the links, directing users to the critical areas to single-word clicks. Doing so will make them easier to remember for returning users. Try swapping “Recent Sales Orders” to “Orders.”

🔹 Make your navigation very accessible:

Try to have the critical links fixed and visible as users use your App. You can hide it as they scroll up to view content, then show it instantly as users scroll back up.

🔹 Make them clickable:

Make them clickable (for large fingers). People can get turned off when the links are unclickable! 40px by 40px is what Google says you need for our fingers!

2) Improve the colors

How?

🔹 Simplify the color pallet:

Choose one primary color that represents your logo/brans and use that for the most buttons and accents. Prepare 5–6 secondary colors to liven up your App here and there. Don’t go crazy!

🔹 Black and Crispy:

The regular reading text should be black and legible. This goes for all the data you’re showing up in your App. All-black text is not a set rule, so that you may get more creative with this rule!

🔹 Guide with Color

Traw the attention of your user and guide them with color. If you lead, people will follow. Save that bright orange for “See more” of “Full course here” so you can easily guide users on what to do next!

3) Improve the fonts.

How?

🔹 Choose a creative font:

Yes, it makes all the difference! You can choose 1000’s of creative fonts on Google Fonts or Adobe Fonts. This step can take your App from a 4 to a 9 in seconds! It’s an underestimated hack!

🔹 Visuall Hierarchy:

A heading should look like a heading. A link should look like a link. Tweak the font sizes and weights to differentiate and visually guide people what they’re looking for.

🔹 Easy to read:

Make sure your text and messages are easy to read. Add proper spacing between lines. Try not to use ALL CAPS and think of how you would like to read an excellent blog post!

🔹 Test Numbers and Symbols:

When selecting a typeface, test how it will work with $#$%!. It is a crucial part most people overlook, and many apps are number and symbol heavy. You can always change a font easily!

4) Make everything have rounded corners

How?

🔹 Rounded Buttons:

It will literary level up the design of your App! Take all your harsh cornered buttons and give them a nice border radius of 6 pixels.

🔹 Rounded Input Fields:

Make them a bit rounded too. It will add more approachability to your App.

🔹 Rounded Modals Pop-ups:

Round the corners of your modal pop-ups and whoof your App will look next-level. I promise. Also, round your in-app slide-out menu or other popouts.

5) Add Shadows

How?

🔹 Data Card on a Dashboard

Make your background a light grey. Leave your data card white and add a shadow to make the cards POP!

🔹 Increase Shadow on Hover

When users hover od touch on your cards, increase the darkness or the distance of your shadow so that element will stand close then the non-hovered ones.

🔹 Make the Shadows Big and Soft

This means, the shadow should have very low opacity, but it should go out pretty wide from the card.

See this link to learn more about the magic of UI shadows.

https://www.booklets.io/b/how-to-create-soft-long-distance-shadows-bazenagency

👉 I hope these tips will help you level up the design of you web app or mobile app.

If you’d like a free call about helping you with UX Design please visit our website.

All Blogs
Get the help