Snooker Scores App - Grid Development

Grid Development

I initially set up a 4 x 7 square modular grid to try and keep the layout as simple as possible, but realised quite early on that the columns didn't lend themselves very well to displaying rows of scored, as demonstrated by the Goal Live Scores App overlaying the guides shown below.

 

I then tried a grid based on the golden ratio knowing that I've found it successful before in app design. I found the columns fitted a lot more appropriately, but the positioning of the rows didn't leave as much space for the results compared to the Goal Live Scores App, as well as leaving large gaps at the top and bottom of the screen that my app will have little use for, particularly at the bottom, as shown below.

 

I then had the idea to try and use a snooker table with all the balls on as a basis for a grid, which is shown below.

 

As shown below, this fitted the Goal Live Scores App pretty well. It's rows are in roughly the right position for the navigation at that top of the screen, as well as there being plenty of room for results. The columns allow room for scores to be put in the middle of the screen between two names, as is the convention for writing down scores. I'm deciding to take this grid forward to work with for these reasons.

 

I took this onto paper to try and refine it further, with particular reference to where the numbers would go to represent the scores, as this will require 5 columns. This was something I had problems with initially, as shown below.

 

I had to modify it slightly because of this. I got rid rid of the two centre columns, filling the big gap left with 5 even columns. These columns still take up the space between the green and yellow balls, so the concept is still in tact. I also split the main content area into 8 equal sections that could be used to show the different statistics mentioned in the last post, as well as adding a bar above it that can potentially be used for navigation. The below is the grid that I hope will be the basis of my designs from here on, but it may require some sort of modification if the 5 columns aren't wide enough to fit text in that's big enough to be readable. I can't see this being a problem though as it takes up a much wider area than the middle section in the Goal Live Scores App.