Support different mobile screen sizes

It's been a while since I started using Construct, and it's still not very clear to me how to properly set up my game so that it's perfectly adaptable to any kind of screen on mobile.

If I want to create a UI like this (see image below), how should I set up my design and place the various instances of each layout?

I've tried setting the aspect ratio of the project to "Scale outer" (so the view is increased to match the screen size), but if I do a test in the browser, all my instances remain aligned to the left side of the window, while I would like everything to remain centered. What method should I use to solve this?

If the method I'm using is wrong, how do you suggest I proceed to get a perfect mobile screen fit?

To design UI for multiple aspect ratios, you first have to decide which direction is "flexible". Usually this is the direction you expect scrolling to be allowed. In your case, I'm going to guess its vertical. So your horizontal width will be fixed as far as your UI design is concerned.

So use scale outer, design for the width of the viewport, and understand that the vertical portion may get cut off depending on the aspect ratio, but it's ok because they can scroll.

dropbox.com/s/g8egk507es8kl2m/scaleouterportraitexample.c3p