Designing for Desktop and Mobile Before Development
Planning responsive behavior as part of the design phase, instead of leaving it as a problem for development to solve alone.
By Touhidul Islam Rukon
What is it?
Deciding how a layout, its type scale, and its interactions should change across screen sizes, as part of the design work, rather than only reacting to breakpoints once the site is being built.
Why does it matter?
A design that only exists as a single desktop frame leaves every mobile decision to whoever builds it, under time pressure, without the context the designer had. Planning responsive behavior up front keeps that intent intact.
Real-world perspective
Designing the ERTH website myself means responsive behavior isn't a separate handoff. The same person who decided how the four-step flow should read on desktop is the one deciding how it collapses on mobile during the build.
Key considerations
Decide early which elements are core to the experience at every size, and which are desktop enhancements.
Test type and spacing at the smallest realistic width, not just the most common one.
Keep the core user flow (the actual steps someone takes) identical across sizes, even when the layout around it changes.
Conclusion
Responsive design done well is invisible: the site simply makes sense at whatever size someone is using.