This is the Tappable Grid 👇

This grid is 24 squares wide and 40 height. 24x40. And this is the basis of all your Web Stories.

Unlike the canvas design approach, the beauty to design on a grid is that your design becomes entirely responsive. This grid will adapt itself to all types of screen sizes. The squares will become slightly taller on a tall phone like the Samsung S10 or slightly wider on a wider aspect ratio, for example the iPhone 5.

So placing your text and imagery on the grid will ensure it will always stay there nomather what aspect ratio your end customer have.

Why did we choose this aspect ratio? Why haven't we used 9:16?

Pretty simple, currently AMP Stories still show the URL bar when you open an AMP Story in a mobile browser.

Further, it can 24 can be divided by 2, 3, 4, 6 and 12. On the other hand, 40 can be divided by 4.

Now it's your turn to put your blocks on the grid and build your stories.

Did this answer your question?