Regarding the width issue, I'm having a hard time designing for multiple screen sizes. Any tips on how to do that?
1. The best, but also the most expensive option is to buy test devices. That's most reliable when you have on hand experience. I bought 4 devices and it helped me a lot. If you can afford it, pick edge case devices. I choosed those:
Samsung Galaxy Tab3 - because it was most used tablet at the time (6 months ago) and it has small resolution compared to the big screen (1024 x 600 - 7in screen)
Samsung i9300 Galaxy S III - most used phone
Samsung Galaxy Tab Pro 8.4 - because it has huge resolution (2560 x 1600)
GIGABYTE GSmart Guru G1 - phone with hd display = small screen x high resolution (1920 x 1080)
I bought them second hand, about $120 a piece, which is ok I think.
2. Second option would be to have friends with various devices. Meet with them once a week/month and let them play your game. This might be even better than option one, because it won't cost you that much and they'll also give you instant feedback. Sometimes you just need to change one thing and see if that button is sized correctly, than it's better to have an in house device.
3. Big monitor with high resolution. 4K+ would be great, but I guess 1920x1080 should suffice, which you can get a new one for $120. Than you can stretch the browser window to see where it breaks.
- while previewing the game in Chrome browser
- press F12 or "Ctrl + Shift + i" to open dev tools and undock it into separate window
- stretch/shrink preview window, you'll see actual resolution in the upper right corner
- try unusual screen sizes and see how it looks. Sometimes I try crazy resolutions like 1800x100, 200x900 and see if the game is still playable and if the background stretches properly.