Design Tip#24 – Use Visual Indication and Text Message to Explain Errors
To encourage minimalist design, it’s tempting to use only the color to indicate an error, however, it is better to provide a related icon and text message.
Design Tip#23 – How to Design Empty States?
A well-designed empty state uses visuals to show the purpose of the app and suggests actions that the user can take in response to an empty state.
Design Tip#22 – Making Profile Pictures Stand Out with Borders
Adding a border of the background color around the profile picture makes it distinguishable from the cover photo behind it.
Design Tip#21 – Use Appropriate Form Controls in Your Design
A multi-line input control is used to get longer, open-ended responses. Design the layout of the control in a way that makes it clear to the user that they can enter multiple lines of text.
Design Tip#20 – Use Multi-Step Forms to Manage Information
A multi-step form makes it easier for users to manage large information in a simplified way. They can focus on a single group of properties at a time.
Design Tip#19 – Don’t Use Label as Placeholder Text
Design Tip: Don’t use labels as placeholders. Hiding the label when the user clicks inside the text control strains the user’s short-term memory.
Design Tip#18 – Don’t Use Two Icons in the Same Button
Design Tip: Don’t use two icons in the same button as it makes difficult for users to understand the real purpose of the button.
Design Tip#17 – Use Checkboxes When Settings Need Confirmation
Design Tip: Use checkboxes when applied settings require confirmation before they are submitted.
Design Tip#16 – Use Background Overlay with Modal Bottom Menus
Design Tip: Use a background overlay with modal bottom menus so that users know that they cannot interact with the rest of the screen.
Design Tip #15 – Navigation Bar
Don’t use multiple colors in the bottom navigation bar. It will make it harder to find out the selected icon and navigate between options.
Design Tip #13 – Place Buttons Side by Side
Don’t place a button below another button if there is enough space to place them side by side.
Design Tip #12 – Use Divider to Group Related Items
Don’t use dividers to separate individual items, instead use dividers to group items.
Design Tip #11 – Use Color Contrast for Better Readability
The color contrast should support easy-to-read and distinguishable text over the background and make the useful information stand out effectively.
Design Tip #10 – Don’t Use Disabled Buttons
While designing the UI, avoid using a disabled button as it becomes hard to find out why it is disabled and what should be done to make it enable.
Design Tip #9 – Add Icons to Menu
Icons provide a great visual way to grab the user’s attention and are fast to recognize and understand.
Design Tip #8 – Button Labels
Always use button labels that are clear and meaningful to the user. Button labels inspire the users to take an action. To indicate what a button will do, use the function as the label of the button.
Design Tip #7 – Error Messages
A good error message is humble and conveys the issues graceful to the user.
Design Tip #6: Use Appropriate Control Width
Use width of an input field as an indicator to identify the number of input characters it can contain.
Design Tip #4
Most of the times, all fields in a form are mandatory except a couple of fields that are optional. To avoid clutter, it is better to mark optional label for fields that not required.
Design Tip #3 – Don’t Use Placeholder Text in Controls
Don’t use placeholder text as it disappears as soon as the user starts typing the input. Recalling the instructions while entering the text is annoying for the user. The only way to restore it is to remove the entered text. Want to Learn UX Design? Try Interaction Design Foundation. IxDF offers online design courses that cover …
Design Tip #3 – Don’t Use Placeholder Text in Controls Read More »
Design Tip #1: Don’t Wrap Text in Buttons
Don’t wrap text on Buttons. A button label should remain on a single line. Thanks for reading. Find more related articles at uxdworld.com. Get my free 5-day UX design course via email. SIGN UP to get Free E-Book: UX Design Fundamentals to learn best practices, UX design process, and career advice from expert designers. If you have any questions, contact me …