English

Hybrid Layout Design

When mobile devices first became prevalent over a decade ago, it was a pretty easy process to design for both mobile and desktop. You just made one layout for each respective device. There weren't as many variations as there is now.

In fact, these days, things are much more complex. If you decide to design for smartphone, tablet and desktop you could easily end up having to create three layouts for each possible view. This isn't something I'm personally fond of. I'd much rather limit myself to a maximum of two layouts for each possible view. One for the smaller form factor and the other as a hybrid approach for both tablet and desktop.

Fortunately, this is totally possible within FileMaker. It's a simple matter of finding the most ideal width and height which will account for the widest range of devices your solution will run on. Figuring this out, however, does take a little bit of work.

By walking you through my own process, and the tool I use for creating a hybrid design, we'll get you familiar with hybrid layout design. A design which would work on a Microsoft Surface Go, iPads and both Mac and Windows desktops. You'll establish a strong understanding of how to approach your hybrid layout design by watching this video. I also provide a few tips about working in Layout Mode with regards to making sure you create a consistent look across all of your layouts.

Tags:
iOS
AttachmentSize
Kiosk.zip90.36 KB

Using FileMaker's Grid

Recently, while providing intermediate training at the annual FileMaker Devcon, I had an attendee approach me and ask a very simple question. "How do you turn off the grid in FileMaker?"

Like all questions, it was asked within the context of innocent ignorance. This was simply because this person had not yet used, nor explored this area of FileMaker. This is totally understandable with the increasing number of options found across the increasing number of palettes within FileMaker.

However, if you think this video is simply about how you turn on/off the grid, then you'll be missing out on a whole host of features and options which can both benefit your layout designs and make things much faster for you within the area of your designs.

This video is about taking full advantage of the grid and making decisions about how to use it and how to choose the right width for your designs. Plus, you'll get all kinds of tips about how to make your layouts feel "visually comfortable" so they appeal to users. Think you know about using FileMaker's Grids? Double-check by watching this video!

Tags:
AttachmentSize
FileMakerGrids.zip34.75 KB

Touring FileMaker's Inspector Palette - Part 2

The Inspector palette is your primary tool for designing your layouts. Of course, being familiar with all its various options and settings is what makes it possible for the creation of great looking layouts.

This video focuses on going through the second and third tabs of the Inspector and looking at the impacts of all the various settings which control styles and themes.

While the settings themselves may seem all to obvious in terms of what they do, it’s the combination of using those settings which makes the difference.

Tags:

Creative Layout Design

While recently teaching the layout/design portion of an in-person FileMaker training course, I found myself showing off one of the features which FileMaker has had since version 12. It’s an often overlooked feature which can be used quite creatively when you know how it works. It’s the Layout Background style of the layout theme.

When you understand the order in which FileMaker displays things, you’re free to create nice modern looking layout designs. Further, when you combine this with knowledge about themeing and styles, you can create a look and feel which is quite flexible as well.

In this video, I walk though an example database where I grab an image from Flickr and integrate it into a new custom theme for a FileMaker file. If you’ve never used images as part of your theme design, then watching this video will give you a great level of insight into what’s possible with layout backgrounds.

Tags:
AttachmentSize
LayoutBackground.zip1.46 MB

FM Devcon 2016 - Designing in Tight Spaces

In July of 2016, Matt was afforded the opportunity to present as a speaker at the annual FileMaker Developer's Conference. FileMaker Inc. decided to make the release of the session videos available for the general public. The session was well received with high marks given all around.

The session was a jam-packed roundup all the various things you can do with FileMaker layout objects in order to meet the objective of creating designs which work well within a small form factor. If taking advantage of FileMaker Go's highly portable convenience is one of your personal objectives, then set aside an hour of time and watch this video.

If you're looking for the sample file provided, then the link is provided below and within the video itself as well.

Tags:
UI

(Re)Theming Solutions

As FileMaker Inc adds new features and functionality to FileMaker, it’s really easy for older projects to start to feel like they’re aging pretty quickly. Fortunately, one of the easiest fixes to make is to give things a brand new look and feel.

The process, however, of going about a re-theming isn’t always as easy as it seems. You’ve got new layout objects which may have been added and there are a ton of “older tricks” which may be replaced with newer ways of doing things.

Without going down the rabbit hole of a complete do-over, you can start re-theming with a good starter theme.

In this video, I showcase how I tackle the project of starting a new project or re-theming and existing solution. It’s a process which can put new life into an older project. You just need to have a good place to start and a way to approach the process. That’s what this particular video is all about. Taking full advantage of FileMaker’s Theming tools!

Tags:
UI
AttachmentSize
Petrowsky_Starter_Theme.zip78.88 KB

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.

Tags:

Creating Color Palettes

As we’ve all likely heard before, a movie isn’t just great because of the cinematography, it’s the sound that counts just as much. What you hear, not just see, is what makes the difference between good and great.

So, if sound is so critical to a movie, then the analogy to a FileMaker layout is color. Sure, anyone can move and arrange fields and objects into some semblance of order. And, using FileMaker’s layout objects to furnish your layout for the best possible user experience does take a bit of skill, but nailing down a color palette for your theme is just as critical as all the rest. Sticking to those colors is what adds that final bit of class which makes a design look great.

The wonderful thing about the Internet, and the world of freely available tools, is that you can generate your color palette super easily. Personally, I enjoy using an online tool called Paletton.

Well, one day while creating a new design, I wanted to easily integrate the palette of colors I had chosen using the tool. Since this wasn’t being done for me, I decided to do it myself. The result was a handy little tool where you can not only take advantage of the tool but learn a little more FileMaker along the way!

Tags:
AttachmentSize
ColorPalettes.zip69.28 KB

Desktop/Mobile Hybrid Design

More and more these days, we find ourselves jumping back and forth between desktop computers and using our increasingly convenient mobile devices. At least, that’s how it’s been with many of my personal FileMaker projects./Users/matt/Desktop/filemaker-desktop-mobile-design.png

While designing for each target device, in an ideal world, is a luxury we’d like to afford, there just isn’t an unlimited supply of time and money.

The solution is to create a hybrid design which will work as well on mobile as it does on desktop. In order to accomplish this, you have to leave some of your “desktop ways” behind and adopt some of the minimalism you find within mobile design.

While FileMaker is adding more and more for the mobile platform, we still have a somewhat limited set of field widgets for interacting with data. At least as it relates to portals and related data. On mobile, a portal typically needs to be scrollable via a finger or thumb flick, yet on desktop we tend to want to enter/edit data quickly because of the tab key and physical keyboard access.

Striking a balance is the goal, and it can certainly be accomplished with the tools we have today. This video is about a common pattern for input of data. It covers a number of tips and tricks about keeping data presentation minimal yet exposing the necessary functionality.

Tags:
AttachmentSize
DesktopMobileHybridDesign.zip294.58 KB

Pages