Practical Layout Design Tips
When it comes to creating a great design within FileMaker's layout mode, there's always a bit of skill and experience mixed in with some practical know-how.
Fortunately, the creative side of the experience can be enhanced quite a bit when you know how to apply those practical bits of knowledge. If you've always wondered how the masters achieve their streamlined and balanced look and feel, then wonder no more.
This video will showcase how to use FileMaker's grid and word processing features in order to achieve a flexible and clean-looking layout design. Follow along with the video as I explore the use of the grid, paragraph settings, merge fields and styles and themes.
Comments
Indexing the Videos
Hi Matt - yet another great video presented clearly and your enthusiasm really shines through. Here is a non-critical but potentially really valuable suggestion: could you please think about numbering the videos and then having an Index listing them all so that we can see where we are, how many we've watched and so on? This would really be of use to all of us who have not much time but want to watch the Master (that's you, right!) So, number them and list them, maybe even in an updatable db?! Thanks very much and keep on making files fly! dickon
Columns and Gutters
Hey Matt,
Great video. One thing I'm confused about is why you would set the major grids to be the column you want and not include the gutters in that number? By doing it the way you show in the video you have the perfect column for the first group of fields. But then you start the next group one box to the right, we no longer have the major grids as the the guide for the Column. Therefore, what is the point of setting the major gridlines as the column width if they only can represent 1 column?
The minor grid defines gutters
Unlike columns and gutters in web design, we don't have the nuances of how gutters operate within FileMaker. In web design, the full width of a gutter (which is typically a percentage of a column) can be split on either side of the column or placed to the left or right of the column.
When we subdivide the major columns by minor divisions, we get gutter amounts. These "gutters" would presumably be on one side or the other of each column. However, if you want to split your gutter then you would subdivide even further to have smaller blocks. It is up to you, the designer, when placing your layout elements to "account" for any desired gutter width.
So, with a 768 width design (iPad portrait), using 128 for Major, you would use 16 (instead of 8) to have split gutters on either side of columns. Therefore, you would not be sizing your fields based on the Major grid lines, instead, you would be inset from the Major grid lines in order to utilize the "gutters" created by the Minor grid.
The key here is that your gutters, according to how FileMaker shows its grid, are within each column and not on the absolute edges of them.
At least this is how I visualize things when working with FileMaker's grid.
...of course, there are other ways you can use the grid too.
-- Matt Petrowsky - ISO FileMaker Magazine Editor
Yeah, that makes perfect
Yeah, that makes perfect sense. So following your example, I would just make the field one box short of the major, and then start the next column at a major line. One other thing I was wondering.... I love the idea of making the field labels the full width of the field, and using attributes to move them around. Very cool. However, what is the reason for extending the fields text box over the field to the bottom border? Is that to align them all on the bottom? That was not clear from the video.
It was just for that one design
Making the label extend to the bottom of the field was just something I had done for the specific design I was working on at the time. It's an arbitrary thing that really depends on the look you're going for.
It's perfectly ok to make the labels simply span the same height as the field and position them either above or below depending on the look you're going for.
-- Matt Petrowsky - ISO FileMaker Magazine Editor
Your calculator
Hi Matt
Thank you, its a verry good idea to think in columns and gutters when layouting in FileMaker.
And you have a verry cool calculator on your Mac.
The inspector windows don't disapear when you use it!
Hey, where is this tool available?
LaunchBar
It's integrated into this app. https://www.obdev.at/products/launchbar/index.html
-- Matt Petrowsky - ISO FileMaker Magazine Editor
Anther good one
Vids have been great lately Matt! Good core stuff with minimal witchcraft!