FMLayoutMode.com

Remember this layout? This is from my May 26, 2010 post. We started cleaning it up later that day by getting rid of the “clown puke” colours.

Before:

After:

A definite improvement, but it still needs some work. So what’s next?

Okay, maybe it’s time to talk about our good friend, Lovable Furry Old Grover. I met a client who had a database developed by one of his staff, who was no longer with the company. The developer has just learned how to work with calculations and container fields, and — as we all tend to do — had gone a little bit mad with the power.

If the client record had a status of “Current client”, this was seen as a good thing, so he had created a calculation that showed a picture of Grover for this happy situation (since Grover is basically a happy guy); if the client record had a status of “Inactive client”, the calculation would show a picture of Oscar the Grouch (because in most situations, this is not a happy thing).

My client had to regularly take these reports into meetings, where they would be perused by his boss, and his boss’ boss — a regular source of embarrassment.

So, what to do?

Here’s the problem. When someone first views this report, they have no idea what Grover or Oscar are trying to tell them: it requires an explanation. Our goal is to require as few explanations as possible to convey a meaning.

That’s where icons and images can cause regular problems. How many of you have looked at a database, or another piece of software, and while looking at a particular button, thought, “Now what’n hell is going to happen when I click that?”

That’s a trick question, Grasshopper. We’ve all done it.

There are a very few icons that have become so embedded in our brains that we never have to think about them: The scissors for “Cut”, the glue for “Paste”. Sure, there are probably a few others.

But mostly, these are icons that made a lot of sense to the developer at the time, and leave the rest of us scratching our heads.

A few versions ago, FileMaker introduced tooltips, so that our users could mouse over layout objects, and we could have a message pop up in a tooltip. Is that the answer?

Nay, Bob. That ain’t it. First, you look at the icon; you wonder if that’s it; you mouseover it; you wait for the tooltip to appear; you try to read it before it disappears a few seconds later. And here’s the best part, if that wasn’t the icon you wanted, then you have to do the same thing to the next icon.

If you really must include an icon — and you rarely must — include text with it as well. For example, your Grover icon could have text under it that says, “Grover is happy this is a current client.” Or you could take Grover right out of the equation.

So here’s what I’m going to do: I’m deleting that field.

That’s right.

Not just from the layout, I mean right out of the database. It offends me that much.

Get thee into Layout Mode, my son.

You’ll notice the container field isn’t even there anymore. When I deleted it from the Manage Database > Fields area, it removed it from all the layouts in the database.

Now what should we replace it with?

Your first, and most obvious option: Nothing.

When you’re looking at a client record, is the most important thing for you to know whether the client is Current or Inactive. If your answer is No, then we need to go no further. Really, stop reading.

If your answer is Yes, then how do we convey that? Maybe we could have the entire entry area turn green for a current client and red for an inactive one?

If that sounds like a good idea to you, then go back to my May 26, 2010 post. You obviously weren’t paying attention to my “clown puke” rant. And besides, you’ll be forcing your users to try to figure out why the screen is different colours for different clients.

The answer then? Like we used to say to our sons when they were little: Use your words, you little weirdo — or something along that line.

At the bottom of your layout, select the status field by clicking on it, and then click Cmd-D (Ctrl-D on Windows). This creates a duplicate of the field. Now move that duplicate up to the top right corner — where Grover once reigned supreme.

On the Inspector’s Appearance tab, you will change that field to have no effects (it’s currently Embossed), and give it a transparent fill. We’ll also remove the field borders.

Now choose a dark grey colour for the text. I like the one at the bottom of the second column of colours. It mutes it a little, but is still prominent.

Finally, make it the same size as your large text that says “Clients”, and align it to the right. Let’s see how this looks in Browse Mode.

All right, now. This change may not be as stunning as the last one, but it solves the icon puzzle: What is Grover trying to tell us? This is a current client.

One last thing: what is that thing under the FIND button that looks like a rolodex card? Another icon puzzle. That’s the button to print this form. Once again, that icon made total sense to the developer at the time it was put there, but nobody else knows.

As a matter of fact, the developer came back to it later, forgot what it meant, and created a new button above it called “Print”.

Just to show I’m not totally closed to the idea of using icons (I am slightly ajar), I will magically transform that button into this new one:

While we now have a printer icon on the button, we also have the word “Print”. It might even be nice to say “Print this form” so that the user isn’t left saying “Print what?” That’s for your judgement; you know your users better than I do.

So, we’ve solved a couple of icon puzzles for our users, but our layout is still pretty ugly. As a matter of fact, on the ugly spectrum, we may even have backslid a little.

In the future we’ll be looking at text styles and sizes, and we should probably do something about those ugly, misaligned buttons.

We’ll get you there, friend.

A note:

I have met developers who couldn’t disagree with me more on my opinions about colour and icons. So trashiness truly is in the eye of the beholder. However, I’m sure we can all agree that there are fewer questions about this layout. We may even end up making it look pretty at some point.

Paul Spafford
FMLayoutMode.com
Spafford Data Solutions