1. Navigation & Information Architecture
Clarity over cleverness: Use literal labels. “Pricing” outperforms “Plans.” Don’t make users guess. (Booking.com principle.)
Consistency across devices: Mobile nav should condense into a bottom bar with one dominant action. Web can use top nav with dropdowns.
3-click depth rule: No critical action should take more than 3 clicks.
Validation: Run nav A/B tests every quarter. Track bounce and time-to-action improvements.
2. Onboarding & Activation
Find your Aha moment: Slack found retention skyrocketed after 2,000 messages. Every product has one. Define and measure yours.
Design for it:
Empty states pre-filled with example projects or templates (Figma/Notion).
Checklists that unlock one by one, so users always know the next action.
Contextual tooltips only when needed, not walls of tutorials.
Remove friction: Zoom’s success came from one-click join. Minimize required fields at signup. Delay billing/profile forms until after value is seen.
Validation: Measure % of users who hit the Aha within 7 days. Optimize flows until this KPI consistently rises.
3. Visual Design & Content Quality
High-quality visuals convert: Airbnb doubled revenue by upgrading listing photos. Apply the same to app screenshots, demo clips, UI illustrations.
Avoid generic imagery: Instead of stock art, show in-context usage of the product. Example: screenshot with annotations pointing to benefits.
Consistency: Create a visual QA checklist: resolution, brand palette alignment, accessibility contrast, and “does it feel premium?”
Validation: Track lift in conversion or engagement when swapping imagery.
4. Habit Loops & Retention
Positive reinforcement: Duolingo’s streaks and progress bars keep users returning. Use streaks, completion rings, or milestones.
Timely nudges: Push notifications or email reminders should be tied to abandoned progress, not random marketing.
Gamified but honest: Reward actions that align with real progress, not vanity. (E.g., “3 tasks done = milestone” not “opened app = milestone.”)
Validation: Monitor 7-day retention after a streak is introduced. Compare against baseline.
5. Performance & Responsiveness
Performance is UX: Tinder’s success with PWAs proved fast load = higher engagement.
Budgets: Aim for TTI < 2.5s and input latency < 200ms on mid-tier devices.
Skeleton loaders: Always show placeholders while content loads to reduce perceived waiting.
Validation: Track Core Web Vitals. Make p75 metrics part of design QA, not just dev QA.
6. Collaboration & Virality
Design multiplayer features: Figma exploded because of real-time presence. Consider live cursors, commenting, shareable links.
Template gallery: Encourage community and virality by letting users duplicate pre-built templates or boards.
Validation: Track number of invites sent per user. If it’s flat, collaboration features aren’t sticky enough.
7. Developer Experience (for API products)
Docs as UI: Stripe won developer love by obsessing over their docs and samples.
Consistency: Standard naming, clear error messages, quickstart code in multiple languages.
Validation: Track time-to-first-successful API call. Optimize docs until it’s <5 minutes.
8. Experimentation & Decision-Making
Culture of testing: Booking.com ran thousands of A/B tests at any time. Don’t guess — validate.
Process: Every experiment ticket should state: Hypothesis → Metric → Variant → Result.
Validation: Maintain a living experiment log. Share wins and failures so the team learns.
9. Payment & Trust UX
Clarity at checkout: Stripe and reMarkable showed that trust and smooth checkout accelerates adoption.
UX rules:
Inline pricing, no hidden fees.
Smooth retries for failed payments.
Instant receipts and refund flows that reassure.
Validation: Track drop-off at checkout. Reduce it with each iteration.
10. Mobile UX Rules
One main action per screen. Secondary actions belong in overflow menus.
Touch target size: At least 44×44pt.
Offline mode: Cache recent activity, show “syncing” indicators.
Haptics: Confirm key actions (success, error).
11. Design System & QA
Design tokens: Colors, typography, spacing standardized.
Component states: Loading, error, hover, disabled always included.
Copy rules: Verb-first CTAs (“Start trial” not “Trial start”). Error messages in plain language.
Validation: Every release goes through device lab tests (low-end Android + iPhone mini), accessibility checks, and color-blind simulations.
📌
Bottom line: Great UI/UX isn’t about beauty alone. It’s about designing for speed (Zoom, Tinder), clarity (Booking.com), habits (Duolingo), trust (Stripe, Airbnb), and collaboration (Figma). Each factor is measurable, enforceable, and can be validated in sprints.