Visually Separate Elements
Image: uidesign.tips Prefer to visually separate menu sections with whitespace. Whitespace makes the UI look cleaner and request less cognitive eff…
The Perfect Header
Image: uidesign.tips A good header needs to put attention on the title and then lead the reader to the description, which must be readable. A few …
Prompt User to Scroll
Image: uidesign.tips Your website needs to prompt users to scroll to communicate your product's value better. Especially when the header conte…
Padding On Rounded Cards
Image: uidesign.tips The left cards use the same padding around the card. Yet the visual result seems off. A quick fix is to make the padding larg…
How To Enhance Hierarchy
Image: uidesign.tips Visual hierarchy is important in design because it boosts the user experience and leads the user attention Your No.1 priority…
How to Apply the Brand Color
Image: uidesign.tips Colors are a core element for any user interface. One of the most common mistakes in UI design is the over usage of the brand…
Fallback for Transparent Avatars 2
Image: uidesign.tips Another visual hack to ensure consistency for transparent avatars is by adding a subtle border around them, the same color as …
Fallback for Transparent Avatars 1
Image: uidesign.tips Many platforms (like Twitter) allow PNG avatars that can cause UI inconsistencies To avoid this problem add a subtle border a…