Do you design for iPhone 8 or X first?

over 2 years ago from Alex Hoffman, Product Designer

  • Alex HoffmanAlex Hoffman, over 2 years ago

    Guess I didn't think of it ¯_(ツ)_/¯

    I assume you're suggesting just always starting with the smallest device?

    0 points
    • Duke CavinskiDuke Cavinski, over 2 years ago

      Was actually curious if you had a reason. But yeah I tend to do the smallest and the largest at the same time.

      1 point
      • Mikael StaerMikael Staer, over 2 years ago

        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.

        2 points
        • Alex HoffmanAlex Hoffman, over 2 years ago

          Awesome, appreciate the response, some really good points you brought up!

          0 points
        • Sean R, over 2 years ago

          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?

          0 points
          • Mikael StaerMikael Staer, over 2 years ago

            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?

            0 points
            • Sean R, over 2 years ago

              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

              0 points
          • Mikael StaerMikael Staer, over 2 years ago

            Definitely refer to the OS guidelines too: https://developer.apple.com/ios/human-interface-guidelines/overview/themes/

            https://material.io/guidelines/

            0 points