Did you know that FileMaker, Inc. offers free tutorials, webinars and much more?
It’s true!
Check out the FileMaker Learning Center for webinars (upcoming and recorded), self-paced video tutorials, and even the exam prep guide for FileMaker certification!
Of course many FileMaker developers, such as AppWorks, offer in-person training. Contact Shawn at shawn@app.works to receive one-on-one custom training.
One of the new features in FileMaker Pro 16 (and one we’re super excited about!) is the Card Window, which is essentially a new window that lives within your current one. So why are we so excited? Cards have all the benefits of popovers plus all the benefits of a new window. In other words, you get to maintain the context you are in by not leaving your current layout, and still work within a different context since a Card can be based on any layout (and table) within your solution. Finally!
Although Cards use the same script steps as regular floating windows, there are some differences in the available options and overall behavior. So let’s dig in…
The default behavior when a Card first opens is to center itself within your current layout and dim the background. Unlike a floating window, this means you can no longer interact with the underlying layout. You also have the option to leave the background layout visible (not dimmed), however it will still be frozen until the Card is closed.
Here’s the best part: you don’t need to worry about having an existing relationship between the table in your current layout and the table in the Card’s layout, so a Card Window really can be based on any layout. Cared Windows can even open layouts in another file!
In FileMaker Go with the ‘close’ option enabled, you can tap anywhere outside of the Card to close the window. If you choose to disable that option, you will need to create a custom button for that purpose using the Close Window script step.
In FileMaker Pro with the ‘close’ option enabled you must click the ‘close’ button found in the top left corner of the Card, otherwise you’ll need to create a custom button.
Note: Keyboard shortcuts work either way in FileMaker Pro: Command+W (OS X) and Ctrl+W (Windows)
Cards will be a welcomed replacement for many popovers, windows and custom dialog boxes.
Here are just a few examples:
With the release of version 16, FileMaker developers finally have the ability to natively pass and parse multiple script parameters . This is made possible by the new JSON functions — specifically, the JSONSetElement function and the JSONGetElement function. There are various methods and syntaxes FileMaker developers have been using for passing multiple parameters to and from scripts, but the most common one I’ve come across is key-value pairs in the format “key1 = value1 ; key2 = value2 ; key3 = value3” etc. This is a nice simple format, but it has some limitations. The new method in 16 is to pass a JSON object, with a series of elements that form the key-value pairs, and parse those elements out of the JSON object in the sub script. So, what once was passed as:
"id = 32313 ; name = alice ; address = 123 Main St. ; member = true"
is now passed as:
{
"id" : 32313,
"name" : "alice",
"address" : "123 Main St.",
"member" : true
}
And on the receiving end, we parse out each element into a variable and use them from there, using the JSONGetElement function. There’s no longer a need for custom parsing functions, or complex let statements that parse and instantiate each variable.
There are two ways to form the JSON object when passing the parameters. The first, and more clunky way, is to just write the JSON from scratch. I say clunky because you have to do things like escape lots of quotation marks, and insert ampersands, and insert unescaped quotation marks, and insert syntax errors, and (barf) and I wouldn’t recommend it. But this is what you’d write, if you so desired:
"{
\"id\" : " & TableName::ID_Field & ",
\"name\" : \"" & TabelName::Name_Field & "\",
\"address\" : \"123 Main St.\",
\"member\" : true
}"
The second, and more elegant way, is to leverage the JSONSetElement function:
JSONSetElement ( "{}" ;
[ "id" ; TableName::ID_Field ; "" ] ;
[ "name" ; TableName::Name_Field ; "" ] ;
[ "address" ; "123 Main St." ; "" ] ;
[ "member" ; True ; "" ]
)
Now when the script into which you’re passing parameters begins running, you (optionally) set a variable to*:
Set Variable [ $param ; Value : JSONFormatElements ( Get ( ScriptParameter ) ) ]
And in the following script steps, you instantiate a variable for each of the incoming JSON elements as needed, using the JSONGetElement function. Since the variable $param is now just a tidy little package of JSON, you can pull out individual elements from it like so:
Set Variable [ $id ; Value: JSONGetElement ( $param ; "id" ) ] Set Variable [ $name ; Value: JSONGetElement ( $param ; "name" ) ] Set Variable [ $address ; Value: JSONGetElement ( $param ; "address" ) ] Set Variable [ $member ; Value: JSONGetElement ( $param ; "member" ) ]
It works beautifully. This is JSON functionality at its most basic, but it’s a pleasure to use, and provides us with a brand-new, simple way to do something we’ve wanted to be able to do natively for years. And what’s cool about the new JSON functions is that FileMaker developers can start natively doing even more complex things, like building arrays of data, with child records and all, right inside variables, and pack and unpack them at will using native functions. All in all, JSON is a welcomed addition to the FileMaker platform’s toolset.
*The JSONFormatElements function is nice to have for looking at parameters in the data viewer, but is not actually required. All it does is take the JSON that is passed in and format it neatly with line breaks and indentation. You can just use Get ( ScriptParameter ) alone and everything will work just fine.
Matt Navarre catches up with Mark Scott from Beezwax on Button Bars.
Like this? Check out more podcast at FileMaker Talk.
The FileMaker platform enables us to build software very quickly – far less time than the typical software development cycle. With the ability to construct a working piece of software so fast, it’s easy to “rough in” a quick user interface that gets the job done (whatever that job may be), but may not be very intuitive to use.
The most intuitive software needs little or no explanation. The user intuitively knows how it works, either from visual cues, conveniently integrated documentation, or through the use of conventional UI techniques that people already understand.
Unintuitive software, on the other hand, is initially confusing or overwhelming, and will leave a user asking where to find what they’re looking for, or how to accomplish basic tasks. A badly-designed user interface can be learned eventually, just through sheer muscle memory, but that doesn’t mean it’s become easier to use. It just means that the user has been able to finally remember the steps to get their job done. It means that they’ve finally been able to construct a “mental map” of the system.
Just like in the real world, people need to create a mental map of software in order to find their way around. You know how to get to work every day without consulting your phone, because you’ve built a mental map of your surroundings, based on your starting point. To find their way around in a piece of complex software (particularly in the case of relational databases), your users need to build a mental map too.
A map graphically describes the spatial relationship between objects in an abstracted form. In the case of a geographic map, that’s the overhead view. In a desktop operating system, the overhead view is analogous to your “desktop”. So you visually move into and out of folders, scrolling through files that are contained in them, and then close the folder again, which goes back to its original location on the “desktop”. You move “into” and “out of” folders and applications, go “back” in your browser, and up and down in the directory structure, and all of that is reinforced by visual cues in the UI. You have a sense of where you are, and where you’ve been at all times. The same sort of interface conventions hold true for your mobile OS. You swipe left/right to move across the surface of an imaginary area. Even though the entire surface of that area is not visible at all times, you are able to create a mental map of the entire workspace because the location of objects in it are reinforced by the movement of the interface. You know that the app you’re looking for is “to the right” of your home screen. Likewise, when you click on an email in a list, and the single email slides in from the right, you know that the list of all your emails is still “to the left”, and clicking the arrow at the top left corner will return you there. Of course there is no “to the right” or “to the left” on your phone, but the software has enabled you to build a mental map that makes it easy to remember where to find everything.
As a FileMaker developer, you’re intimately familiar with the relationship graph that serves as your actual map to the system, at least in data form. But it’s all too easy to forget that the user of your software will likely never see that graph. This is your map to show how table B is accessed from table A, but the user doesn’t see that. They need to be shown, through the interface, what the relationship is between the two tables. And similarly, the relationship between a found set of records in list view, and a single record in form view needs to be clearly delineated. As a developer, your aim for the UI should be to enable the user to easily create a mental map of the system as a whole.
There are several techniques that I use to reinforce a user’s mental map in the systems I design.
The first technique is using a “Home” screen or “Dashboard”. This serves as a central point from which you can access almost any other screen in the software. Think of it as the front door, or perhaps more accurately, a “software foyer”. Taking this analogy, you enter the software through the front door, and are presented with a set of doors and hallways that take you to other locations in the house. If one doorway leads to the dining room, and one to the living room, and a staircase leads upstairs, then you always know how to get to the living room from the dining room, or from the dining room upstairs: by going back through the foyer. The well-known home icon always takes you back to the starting point, and you can now move to a different part of the software. It’s easy to build your mental map based on a single home screen, with all the different sections of your software radiating out from there (not unlike the FileMaker relationship graph).
Another key technique I employ for reinforcing the mental map is to limit navigation across contexts. Every time you move from one context to another, it adds another layer of complexity to your mental map. If you move your user between contexts without providing some very clear indicators that they’re looking at things from a different perspective, you run the risk of actually breaking their mental map, since the place they think of as “back” is no longer the same as it was moments before. As a real-world example, wouldn’t it be confusing if you started at the front door, went upstairs, then into a bedroom, and then walked through a door and suddenly found yourself back downstairs in the kitchen? For that same reason, it’s generally better to make the user return to the dashboard (back downstairs to the “foyer”) in order to visit a new context, so that they can easily add on to their existing mental map. Alternately, you can enable your user to view their related data from a single context, without forcing them to move to a new screen. I do this whenever possible. For example: My user is viewing a “Customer” record, and on the layout is a portal that displays related “Jobs” for the customer. When I click on a job in the portal, instead of navigating away from my customer to the Jobs context, I simply load the single related record right there from the customer context, using a global-field-based relationship. Now, my user only has to hold the Customer “location” in their mind, and from there can see into detailed info about that customer (i.e. their jobs), rather than forcing them to build a new location into their mental map – the Jobs “location”. If they are required to move over to a new layout in the jobs context, they’ll need to somehow build into their mental map exactly how that relates to the customer, how to get back to the customer they were on, and how that relates to the system as a whole. If, however, they’ve never moved from the customer context, they can immediately understand how the job relates to the customer, and how they got to that information, because in theory, they’ve already built that part of their mental map.
As I described earlier in this post, one of the ways that mobile operating systems reinforce the mental map is by using buttons that explicitly display an arrow icon, typically coupled with animation that shows the movement of one screen to another. When clicked, the screen shifts over from the direction that the arrow pointed, reinforcing the mental map of “detail on the right, list on the left”, or the “master-detail” view that we’re all familiar with. Although we don’t currently have the benefit of sliding animation in FileMaker (with the exception of slider panels on the Mac and iOS), we can still reinforce the mental map by using arrow icons on buttons. From a Customer list view, I’ll place a clear button (i.e. no color fill, gradients, or outlines) over the row that navigates to the detail view. At the far right end of the button I’ll place a simple arrow icon, which implies that the Customer detail is to the right. When I arrive at my detail view, there’s a button in the upper left corner, with an arrow pointing to the left, that says “Customer List”, implying that the List view I was just on is to the left. These reinforce the user’s mental map, in which they begin at the dashboard, click customers, then click a single customer. They’ve “moved” from left to right. When moving back up the chain, all icons point to the left, reinforcing the movement back from right to left. And moving from left to right, they can build a mental map of All>Some>One, which is not unlike navigating a hard drive, where the user drills down from hard drive, to folder, to file.
Designing an intuitive interface for your app is probably the single most important element contributing to the successful adoption of your software, as a database system is only as good as the user’s ability to get at the data. If they have a hard time wrapping their head around how it all connects, what the relationships between tables are, and how to get the right data into or out of it, then it will be of no use to them. They’ll probably find something they can more easily grasp. If, however, your user can easily build that mental map, they’re much more likely to feel comfortable using and understanding the software, and if you can make that mapping process effortless, all the better. Having a few go-to techniques to help reinforce the mental map can be especially valuable for projects in which the development time is limited, but as a software UI designer, you should always try to have foremost in your mind your user’s perspective, and remember to help them create their mental map.
By Thomas H. Meglasson III
Have you ever been limited by screen real estate in a solution? Have you ever had a field that you thought would only ever have a few words in it but user’s decided to write an essay in?
Sometimes the data in a certain field can vary greatly. It is a waste of layout space to size the field to show the largest possible amount of data, but also not optimal for users not to be able to see all of their data because a field isn’t big enough. This is especially true with number fields, where FileMaker chose to display an incredibly helpful ‘?’ if the number is to long for the text field object.
On Wednesday, September 7, 2016, the PDXFM Meetup Group welcomes Vince Menanno to Portland. He’ll be discussing InspectorPro and much more. It’s a can’t miss meeting. If you plan to attend please RSVP. If you would like to sponsor the Food and Beverage for the meeting, please contact Gerald Chang of Eight2.com. Details HERE, or click the link below.
By David J. Weiner
In our first blog post on the topic of FileMaker 14 button bar techniques, I outlined why we love them so much (calculated labels!), and the main reason they’re so useful (calculated labels!). In our second post on Button Bar Techniques, I delve into the first of several actual tricks we use them for. And, as I looked over some of the examples that I’ll be explaining, it occurred to me that one thing that these techniques all have in common is that the formatting of the button bars is typically invisible — entirely, or partially.
By David J. Weiner
Button bars, for me, are the single most useful new feature introduced in FileMaker 14 (aside from the Script Workspace, which is a beautiful thing). Interestingly, the reason I find them so useful has nothing to do with their primary intended use case: the navigation bar. Sure, a simple and neatly-aligned navbar is great to have, and being able to switch segments from a regular button to a popover and back again is truly useful for speed of UI design, but the killer feature of button bars is the calculated label. This feature alone is, as they say, worth the price of admission. It means that you can display output from FileMaker’s calculation engine right at the user interface level, which, prior to FileMaker 14, was not available without creating a calculated field or resorting to script or Let statement variable tricks.
Our FileMaker monthly Meetup group met this last Wednesday in a new space! It was beautiful and the conference room was enormous – with a convenient wireless presentation system for laptops to present on a giant projection screen. Our many thanks goes out to Ken Skeen and the fine folks at Hanna Andersson that graciously offered their space for our meeting, to Gerald Chang of Eight2 for providing drinks and Chris Irvine of ThreeProng.com for bringing the pizza and co-hosting the meeting!
Our topic was: FileMaker Alternative Modal Dialogue Showcase. The idea was to show alternative methods for creating a modal window, without using a custom dialogue. It was great to delve into the different ways in which developers will tackle and solve the same problem in different ways.
Hello from the top of the
