I have a question about designing for iOS devices in prototyping apps/software like Sketch, Adobe XD, etc. When you make a new document and select the size for your projects (or artboards), iOS mobile devices start at 375px in width. My question is how do you treat your designs in an odd number space when using even-numbered elements and spacing while respecting Apple's guidelines and the safe area?
Here's an example of what I'm trying to ask.
Each square is 40px x 40px with a 10px gutter between each square. If you want to touch the left and right safety margins, and group all and scale proportionally, you end up either with the squares or gutter spaces varying in width by 1px. How would you design this row so that it scales up for devices with the squares and gutters all being equal and also the layout working with the margins?
About a year ago I thought "Enough of this!" and started designing on 376px wide artboards. I'm designing web apps, so they should be responsive and 1px doesn't make any difference. This probably won't work for iOS app UI design. Also, I've noticed a long time ago that Apple prefers odd sizes and spacings: