Principles of UX / UI (Product Design): UX Roadmapping and Prioritization (Impact‑Effort, Kano Model)

UX Roadmapping and Prioritization (Impact‑Effort, Kano Model)

UX Roadmapping & Prioritization: Impact-Effort & Kano Model

A Portfolio-Ready Study Guide

What This Is

UX roadmapping and prioritization help teams decide what to build and when to build it—balancing business goals, user needs, and technical constraints. Without it, teams waste time on low-value features (e.g., a flashy animation that doesn’t improve conversion) or miss critical fixes (e.g., a broken checkout flow causing 30% cart abandonment). Example: A hospital patient portal might prioritize appointment rescheduling (high impact, low effort) over a virtual waiting room (high effort, niche appeal) to reduce no-shows and improve satisfaction.

Key Terms & Principles

• Impact-Effort Matrix (2x2 Quadrant):
  A prioritization framework plotting features by user/business impact (y-axis) vs. development effort (x-axis). Example: Redesigning a mobile checkout button (high impact, low effort) vs. building a custom AI recommendation engine (high impact, high effort).

• Kano Model:
  A theory categorizing features into:

• Basic Needs (must-haves; e.g., a login button that works).
• Performance Needs (more = better; e.g., faster load times).

• Delighters (unexpected but loved; e.g., Spotify’s "Discover Weekly" playlist).
  Example: A banking app’s biometric login (Basic) vs. spending insights (Performance) vs. a "surprise" cashback reward (Delighter).

• MoSCoW Method:
  Prioritization by Must-have, Should-have, Could-have, Won’t-have. Example: For a food delivery app, real-time order tracking (Must) vs. dark mode (Could).

• Opportunity Solution Tree (OST):
  A visual tool to map problems → opportunities → solutions. Example: Problem = "Users abandon carts." Opportunity = "Reduce checkout steps." Solution = "One-tap checkout with saved payment."

• RICE Scoring:
  Prioritization formula: Reach × Impact × Confidence ÷ Effort. Example: A feature with Reach = 1000 users, Impact = 3/5, Confidence = 80%, Effort = 2 weeks scores 1200.

• Hick’s Law:
  More choices = slower decisions. Example: A 3-option pricing page (good) vs. a 10-option dropdown menu (bad).

• Jakob’s Law:
  Users expect your product to work like others they’ve used. Example: Placing a search bar in the top-right corner (like Google) instead of a hidden menu.

• Progressive Disclosure:
  Show only essential info upfront; reveal details as needed. Example: A collapsible FAQ section vs. a wall of text.

• Design Thinking (Double Diamond):
  A process with 4 phases: Discover (research), Define (problem), Develop (ideate), Deliver (test). Example: Redesigning a ride-hailing app’s payment flow by first interviewing drivers and riders.

• Heuristic Evaluation:
  A usability audit using Nielsen’s 10 Heuristics (e.g., "Error prevention"). Example: Adding confirmation dialogs before deleting an account.

Step-by-Step Process Flow

1. Align on Goals & Constraints

• Action: Host a stakeholder workshop (Figma Jam or Miro) to define:
• Business goals (e.g., "Increase retention by 20%").
• User goals (e.g., "Book appointments faster").
• Technical constraints (e.g., "No backend changes in Q1").
• Tool: Use a Problem Statement Template: "We’ve observed [problem] affects [users] because [reason], leading to [impact]. How might we [goal]?"

2. Gather Data & Insights

• Action:
• Quantitative: Analyze Google Analytics (e.g., 40% drop-off at checkout).
• Qualitative: Review user interviews (e.g., "I hate re-entering my address every time").
• Competitive: Audit 3 competitors (e.g., "Amazon’s one-click checkout").
• Tool: Create a Figma research board with screenshots, quotes, and metrics.

3. Brainstorm Solutions (Opportunity Solution Tree)

• Action:
• List problems (e.g., "Checkout takes too long").
• Map opportunities (e.g., "Reduce form fields").
• Generate solutions (e.g., "Auto-fill address," "Guest checkout").
• Tool: Use Figma’s sticky notes or a whiteboard to cluster ideas.

4. Prioritize with Impact-Effort & Kano

• Action:
• Impact-Effort Matrix: Plot solutions on a 2x2 grid (Figma template).
  • Quick Win: "Add a ‘Save for Later’ button" (high impact, low effort).
  • Big Bet: "Build a loyalty program" (high impact, high effort).
• Kano Model: Survey users to categorize features (e.g., "How would you feel if [feature] was missing?").
• Tool: Use Typeform for Kano surveys or Airtable to score RICE.

5. Validate with Prototypes & Tests

• Action:
• Low-fidelity: Sketch 3 checkout flow variations in Figma.
• Guerilla test: Ask 5 users to complete a task (e.g., "Buy this item").
• Iterate: Combine the best parts of each version.
• Tool: Figma prototypes + Maze for unmoderated testing.

6. Roadmap & Communicate

• Action:
• Create a Now-Next-Later roadmap (e.g., "Now: Guest checkout. Next: Saved payment methods. Later: AR try-on").
• Present to stakeholders with data-backed rationale (e.g., "Guest checkout could reduce drop-off by 15%").
• Tool: Notion or Asana for roadmaps; Google Slides for presentations.

Common Mistakes

Design Interview / Portfolio Tips

What Interviewers Look For:

1. Data-Driven Decisions:
2. Show how you used analytics, surveys, or usability tests to prioritize. Example: "Our heatmaps showed users ignored the sidebar, so we moved key actions to the top."
3. Stakeholder Management:
4. Demonstrate how you aligned conflicting priorities. Example: "The PM wanted Feature X, but user research showed Feature Y had 3x the impact."
5. Visualizing Trade-offs:
6. Include Impact-Effort matrices or Kano survey results in your portfolio. Example: A Figma slide with a 2x2 grid and sticky notes explaining your rationale.
7. Tricky Distinctions:
8. Roadmap vs. Backlog: A roadmap is strategic (e.g., "Improve onboarding in Q3"); a backlog is tactical (e.g., "Add a progress bar to Step 2").
9. MVP vs. MLP: MVP = minimum viable product (barebones); MLP = minimum lovable product (delights users).

Portfolio Storytelling Tips:

• Before/After: Show a problem (e.g., "Users struggled to find the ‘Cancel’ button") → solution (e.g., "Moved it to the top-right with a red outline").
• Process Artifacts: Include screenshots of your Impact-Effort matrix, Kano survey results, or roadmap slides.
• Metrics: Quantify impact (e.g., "Reduced checkout time by 40%," "Increased sign-ups by 15%").

Quick Check Questions

1. Scenario: A stakeholder insists on adding a "live chat" feature to your app, but your data shows users rarely use it. How do you respond?

2. Answer: Use the Kano Model to explain that live chat is likely a Delighter (not a Basic or Performance need) and suggest prioritizing Basic Needs first (e.g., fixing a broken login flow). Offer to A/B test live chat later.

3. Scenario: Your team is debating whether to build a "dark mode" or a "saved payment methods" feature. How do you decide?

4. Answer: Use the Impact-Effort Matrix:

   
   
   • "Saved payment methods" = high impact (reduces friction) + low effort (API integration).
   • "Dark mode" = low impact (niche appeal) + high effort (design system updates).
   • Prioritize saved payments as a Quick Win.

5. Scenario: A product manager wants to launch 10 features in Q1, but your team can only handle 3. How do you negotiate?

6. Answer: Use the MoSCoW Method to categorize features and explain trade-offs. Example:
   • Must-have: "Fix the broken checkout flow" (Basic Need).
   • Should-have: "Add Apple Pay" (Performance Need).
   • Could-have: "Dark mode" (Delighter).
   • Push back on Won’t-haves with data (e.g., "Only 5% of users requested this").

Last-Minute Cram Sheet

1. Impact-Effort Matrix: Plot features on a 2x2 grid (Quick Wins, Big Bets, Fill-Ins, Time Sinks).
2. Kano Model: Basic Needs (must-haves), Performance Needs (more = better), Delighters (unexpected).
3. RICE Scoring: Reach × Impact × Confidence ÷ Effort.
4. MoSCoW: Must, Should, Could, Won’t.
5. Hick’s Law: More choices = slower decisions (simplify menus).
6. Jakob’s Law: Users expect your product to work like others (follow conventions).
7. Progressive Disclosure: Show only essential info upfront (e.g., collapsible sections).
8. ⚠️ User Interviews ≠ Usability Tests: Interviews uncover problems; tests observe task completion.
9. ⚠️ MVP ≠ MLP: MVP = functional; MLP = delightful.
10. WCAG Contrast Ratio: 4.5:1 for normal text, 3:1 for large text.