Designer News
Where the design community meets.
almost 6 years ago from Alex Hoffman, Product Designer
Guess I didn't think of it ¯_(ツ)_/¯
I assume you're suggesting just always starting with the smallest device?
Was actually curious if you had a reason. But yeah I tend to do the smallest and the largest at the same time.
Agreed. Always start with the smallest first, as it typically presents the most challenges.
If you can get everything into the small form factor,. then it quite easily scales up.
The problem is when you get to "phablet"sizes (and tablet sizes). In some cases, depending on your UI, you may have to reorganize content. Similar to designing a properly responsive website, you may have to scale elements or reformat the layout for it to fill the space in a way that makes sense. For example, a popular pattern is a horizontal/side scrolling card list; depending on the size and number of cards, at bigger screen sizes, there may not be anything to scroll—so how do you account for that. Likewise, how small can those cards get at the smallest screen size before you have too much text wrapping.
Awesome, appreciate the response, some really good points you brought up!
I actually have a related question kind of. If I use a 12px font at 320SE does dev have that font scale up proportionally at 375 and 414? Or do I need to let them know what that font size should be at the different resolutions?
Typically the same size.
But I would say actually that it could be a good idea to do so. Not so much for the phones, but once on tablet, there's so much screen real estate, that it makes sense. However, you may run into issues if using default UI components, like navbars and such, since I don't think those have scaling built in. This can add a lot of complexity, so it may not be feasible for your dev team. It all depends on your needs—do you have many tablet users, does it make sense to make such detailed changes for that case?
Ok I see. I worked on a design mobile app and when I viewed a screen on the 8+ the font looked smaller that's why I asked and they said that's how it is. Thanks for the links
Definitely refer to the OS guidelines too: https://developer.apple.com/ios/human-interface-guidelines/overview/themes/
Designer News
Where the design community meets.
Designer News is a large, global community of people working or interested in design and technology.
Have feedback?
I’m curious, why not start at SE (320) ?