Design

Responsive Design Scenario Planning

Design for real devices and contexts. Don't rely on abstract breakpoints. Map actual use cases across screen sizes. Then, design appropriate experiences for each. "Mobile-first" and fixed breakpoints are often misguided. Design for how people *actually* use different devices.

Duration
2 hours
Group Size
3-4
Category
Design
Difficulty
Easy
Participants will:

  • Identify device usage patterns in your audience.

  • Design device-appropriate experiences.

  • Make informed decisions about responsive strategy.

  • Avoid over-engineering responsive solutions.

Participants will produce:

  • Device-appropriate designs for real use cases.

  • Informed responsive strategy decisions.

  • Reduced over-engineering of unlikely scenarios.

Mobile-First Isn't Always Best: Mobile-first works when mobile is the primary use case. If desktop usage dominates, desktop-first is a better approach. Design for the primary use case first.

Breakpoints Are Implementation Details: Don't start with breakpoints. Instead, ask: "What experience makes sense on small screens in mobile contexts versus large screens at desks?" Breakpoints should emerge from experience needs.

Context Matters: A mobile phone means thumb navigation, variable connectivity, and on-the-go usage. Design for the context, not just screen dimensions.

Consider Responsive Costs: Full responsive support adds complexity and overhead. A separate mobile site or app might be better. Evaluate the trade-offs honestly. I've seen teams waste months on fully responsive sites that delivered less value than a simple mobile-optimized version.

Unlock Step-by-Step Instructions

Free account, no card. Every exercise, agenda, and resource in full.

Unlock Pre-Work Requirements

Free account, no card. Every exercise, agenda, and resource in full.

Unlock Materials Required

Free account, no card. Every exercise, agenda, and resource in full.

Unlock Resources & Templates

Free account, no card. Every exercise, agenda, and resource in full.

Discussion

Loading comments...