💎 5 Rules of Good Icon Design
✅ Good icons are universal
✅ Good icons are simple
✅ Good icons are legible
✅ Good icons are nonverbal
✅ Good icons are consistent
💎 Ready-to-use UI Grids for Desktop, Tablet and Mobile
Nice examples of layout grids for different mediums. Very handy when you start working on a responsive grid system for your product.
💡How To Approach Product Redesign: Step by Step
1️⃣ Define Jobs to Be Done
2️⃣ Deconstruct existing design
3️⃣ Identify key problem areas
4️⃣ Understand the value versus the effort
5️⃣ Building a shared understanding of what you want to redesign and why
💎 How to structure color palette
✅ Choose color-specific colors
✅ Define color pairs
🛑 Avoid poetic names (difficult to remember)
✅ Primitives to semantics to components
✅ Test for color contrast (and communicate contrast ratio)
💎 UI spacing cheatsheet
This spacing system was created using a principle of proximity: elements positioned close together are perceived as belonging to the same group. This system works well for dynamic spacing.
👇
Voice & tone in design systems
Duolingo: https://t.co/YXyuW1KuHx
Line: https://t.co/68Ivhtyr5P
Shopify: https://t.co/J1UHJdIvNU
Uber: https://t.co/f9oMCRo8qC
Zendesk: https://t.co/K4VxrgvGmN
💎 Content scanning patterns on the web
Nice visual summary of common scanning patterns that are important to consider if you’re optimizing layouts for better user engagement