Balanced and Unbalanced Grid Layouts

To Pad or Not to Pad:

If you print your keyguard and the grid rails don’t align well with the buttons’ edges, you may have an AAC app that is “out of balance.” Padding is the way to get back in balance.

Balance is all about the distance between grid cells and between the outermost tiles and the edges of the screen. A “balanced” grid layout has half as much space on the outside of the grid as between each cell.

This is a completely fake Proloquo2Go layout:

It has a very irregular grid layout – in the terminology of the designer, it’s unbalanced.

You use padding to make the keyguard grid match the grid cells.

These settings will only affect the grid area – bounded in red:

The best way to determine the amount of padding needed is to use your screenshot – converted to SVG format and loaded into the designer.

Occasionally you may run into an app that “looks” like a regular grid but really isn’t.  The VocoChat app from Grid is one:

This may look like a grid-based app with three rows and five columns, but the buttons in the right-most column are significantly smaller than all others.  In reality, this is a three row, four column grid. In order to properly layout the grid, you will need to add a significant amount of “right padding” to the design and then put instructions in the openings_and_additions.txt file to create openings for the “Back”, “Delete”, and “Clear” buttons.

The case isn’t helping!

Sometimes, the case itself is the culprit.  There are two different scenarios.  In either scenario, something about the case prevents the grid from sitting in the middle of the case opening.   These are called “unbalanced case openings,” and they are both addressed in the same way.