I'm dealing with a challenge where the design team has created **client-approved** designs for three breakpoints (mobile at 393px, tablet at 1024px, and desktop at 1920px). I find the design transitions to be too sparse, especially between tablet and desktop. For example, users on 1280x800 laptops will view the tablet designs. Moreover, instead of using a max-width container to keep content centered as the viewport expands, they want everything to scale with the viewport width. This means that users on devices sized between 1024px to 1919px will see the tablet designs scaling 1:1 with their screen width, which initially looks good but worsens toward the upper limits. For screens 1920px and wider, the desktop designs will also scale similarly, which isn't as problematic since fewer people use maximized browsers on large screens. How can I convince both teams that this approach to responsiveness isn't ideal?
5 Answers
At the end of the day, just show them how the designs look across devices. If they still think it’s okay, it’s ultimately their product. If they need changes later, they should be prepared to pay for it.
The best approach here is just to show them. Trying to convince them without a visual reference is going to make your job a lot harder.
There were a few key mistakes here: first, the designs were approved without any developer input. Second, there are too few breakpoints, and they’re set at screen sizes instead of between them. Share your concerns, but you might need to let the designers face the consequences of these choices first. Next time, push to include developer feedback early on. Let them figure it out themselves – they'll learn from it!
Try creating a demo where you display the designs in a simple HTML page set to fill the space at 100% width. Ask them to view it on larger screens and this might help illustrate the problem clearly. I've found this approach quite effective before!
Absolutely! Seeing things visualized makes a huge difference. Designers are all about visuals, so a mockup showing the flaws is the way to go!
They might need to see the designs in action to really understand the issues. It's possible they haven't fully considered the implications of their decisions. Also, having the desktop view kick in at 1920px is definitely not ideal – it feels like a waste!
I totally agree! I think tablet designs should end at 1023px and desktop should start from 1024px. That just makes more sense!
Definitely bring up that this was identified early on as a potential issue. It’s a lot nicer than saying "I told you so!"