TLDRLearn about 16 UI design rules and guidelines that can make a big impact on the usability and aesthetics of an interface. Explore topics such as using space to group related elements, being consistent in design, creating a clear visual hierarchy, and selecting the right typeface.

12m read time From adhamdannaway.com
Post cover image
Table of contents
Let’s fix this example using logical rules1. Use space to group related elements2. Be consistent3. Ensure similar looking elements function similarly4. Create a clear visual hierarchy5. Remove unnecessary styles6. Use colour purposefully7. Ensure interface elements have a 3:1 contrast ratio8. Ensure text has a 4.5:1 contrast ratio9. Don’t rely on colour alone as an indicator10. Use a single sans serif typeface11. Use a typeface with taller lower case letters12. Limit the use of uppercase13. Use regular and bold font weights only14. Avoid pure black text15. Left align text16. Use at least 1.5 line height for body textWe fixed it!Want more?
28 Comments

Sort: