【FileMaker】設計時に見落としがちなレイアウト仕様

今回は、[Qiita Advent Calendar 2018](https://qiita.com/advent-calendar/2018)の[設計時の見落とし Advent Calendar 2018](https://qiita.com/advent-calendar/2018/overlook)として、FileMakerのレイアウト設計時に見落としがちな点をまとめたいと思います。

# FileMakerって？
という方もいらっしゃると思いますので、簡単に説明します。
[FileMaker, Inc.](https://www.filemaker.com/jp/)は、Apple の子会社であり、モバイル、クラウド、およびオンプレミス環境で動作するカスタム App を作成して展開するための統合型プラットフォームを提供します。
※ [FileMaker,Inc. 会社情報](https://www.filemaker.com/jp/company/)より引用

コーディングレスで実装可能な部分が多く、かつレイアウトをプロっぽく（というと変ですが）仕上げることができます。

# レイアウトとは
レイアウトとは、つまり画面です。
データベースとレイアウト（画面）がセットで開発できるので非常に重宝するのですが、レイアウトを作るにはまずテーブル設計をします。
図形や単純なフィールドだけで配置して「こんなんできまっせー」ということも可能ですが、実際のフィールドに値を入れてみてどう動くかなどをみるには、テスト的でもいいのでフィールドを作ってお客さんにデモンストレーションした方が齟齬が少ないです。

# レイアウト設計で見落としがちなところ1
FileMakerはレイアウトを作るのが初心者でも綺麗にかつチェックボックスなどを手軽に作成できてしまいます。
表現方法が多彩にあるところが、いいところでもあり、見落としがちなところにもなります。

先ほどのように簡単なフィールドだけを作ってお客さんと打ち合わせをしていると、簡単なフィールドを変更しながら、とか、フィールドに計算式を入れながら、などのようにすることもあります。
お客さんの要望を聴きながら「こうですねー」とその場で作っていくのもできるので、設計が口頭で済ますことになりがちです。
よくて、メモ書き。。。
（私はその後画面遷移図などに起こして共有しますが。。。）

お客さんの「こういうの作りたい」が動く画面をみながら

「あぁ、こんなこともできるんだ！」

とパァッと目の前に光が開け、当初予定になかった「あれも」「これも」が出てくる確率は９割（当社比）です。

お客さんからの要望を表現する方法がたくさんあることで希望も膨らみがちなので、

お客さん「こういうこと、できるの？」
開発者「できますが、今回の要望には入ってないですねー」

と華麗にスルーするか次に繋げられるような会話力が求められます。

そう。
レイアウト設計で必要なのは、

「気軽に引き受けない会話力」

です。
（猛反省）

# レイアウト設計で見落としがちなところ2
本筋に戻ります。
FileMakerでは、Webサイトでいう所のCSSをカスタマイズできます。
これを、「テーマ」と呼んでいます。
![layout1.png](https://qiita-image-store.s3.amazonaws.com/0/60538/f7e0e316-fbec-13eb-0f15-ebcf626c9292.png)
そして、それぞれのフィールドやオブジェクトのデザインを「スタイル」と呼んでいます。

一つのテーマには、そのテーマに沿った文字サイズや色の組み合わせなどがセットされており、この組み合わせをそのまま使ってもいいし、自分なりに変更もできます。

例えば、この「エンライトンド」テーマにあるテキスト入力フィールドのスタイルで、あらかじめ登録されているスタイルを当ててみます。

1.デフォルトのスタイル
![layout21.png](https://qiita-image-store.s3.amazonaws.com/0/60538/926a9ed2-d22b-7d5a-3b05-f7383e150e25.png)
実際の表示は、こんな↓感じです。
![layout22.png](https://qiita-image-store.s3.amazonaws.com/0/60538/f01cffd1-1b61-81ee-3ee5-063e84893d75.png)

2.ナビゲーション編集ボックスのスタイル
![layout31.png](https://qiita-image-store.s3.amazonaws.com/0/60538/cb2ba670-d27c-b296-9cb8-d6d7bd03f16d.png)
実際の表示は、こんな↓感じです。
![layout32.png](https://qiita-image-store.s3.amazonaws.com/0/60538/87fa85e1-8489-3d00-1015-ba3254e1117f.png)

3.最小編集ボックスのスタイル
![layout41.png](https://qiita-image-store.s3.amazonaws.com/0/60538/0fdbfc11-10f1-fd13-2980-bf3465d01fc8.png)
実際の表示は、こんな↓感じです。
![layout42.png](https://qiita-image-store.s3.amazonaws.com/0/60538/59afca2f-5dd1-5400-eb3f-0dc9ed542031.png)

このスタイルやテーマは、自分仕様で新規作成することもできます。
![layout6.png](https://qiita-image-store.s3.amazonaws.com/0/60538/2a637f3e-7791-dac7-e252-e79cb7ce0dc9.png)
仕事として開発する場合は、受注した案件ごとにテーマを決めてスタイルを決定していくことがよくあります。

もちろん、これらのスタイルを使わずにそれぞれカスタマイズができます。
![layout5.png](https://qiita-image-store.s3.amazonaws.com/0/60538/22c0eff4-56f3-ce5a-f3cd-482ecb7a508a.png)

# 初心者が陥りやすいワナ

ノンテーマ＆ノンスタイルは自由にフォントなどを設定する自由度が高いのがメリットですが、デメリットにもなります。

そして、初心者ほど、テーマやスタイルを設定せずに各フィールドでデザインします。
別のフィールドやレイアウトで同じスタイルを使いたいときに、スタイルとして登録されていないがために、修正するときの作業箇所が修正箇所分となることです。

スタイルを登録しておけば、1回スタイルの修正を行うだけで済むため、どれだけ作業時間が短縮されるか、わかりますよね。

# つまり
レイアウトをデザインするときに見落としがちなのは、この、
・テーマ
・スタイル
を決めずに進むことです。
開発に入ってから「あ、テーマとスタイル決めるの忘れてた」では手戻りが発生してしまいます。

レイアウト数は、単純な見積書・納品書・請求書システムでも２桁になります。
大規模なシステムでは、3桁になることもあります。
スタイルを決めずに３桁のレイアウトを修正するのは、どれだけ疲弊するか、、、目に見えます。いや、見たくないです。

WebサイトのCSSにももちろん同じことが言えると思いますが、FileMakerのシステム開発でも、スタイル登録を初期の段階で「忘れずに」決めてください。

現場からは、以上です。