FileMakerで自社用エディターを作りました。

FileMakerでエディターを作るのは、フィールドの仕様上あまり好ましくない、とずっと思っていたのですが。 

今年の夏くらいに一つのアイディアがきっかけでモックを作り出し、現在はほぼ毎日使っている状態です。 

そのお話を。 

ブレイクスルーになるアイディア

それは 

• 入力と表示を分けること

でした。 

• 表示はWebビューア
• 入力はポータル

とすれば 

• ブロックエディター的な入力方法で間をつなげる

と思ったのです。FileMakerでエディターを作ることについては、常に一つの不満がありました。

枠が小さい。余白を縮小できない。

ポータルでいくつも関連レコードを作るような場合。どうしても枠が小さくなります。 

入力はまだ問題ないのですが、表示の時が問題です。
入力が大きすぎると、スクロールバーに内容が隠れてしまうのです。 

ぱっとみて「これが全部だな」と思ったら隠れた続きがあった…。
こうなったら間違いの元。 
　

その逆でフィールドを大きく取ると。
今度は「余白を上に詰める」といったことが、ブラウズ表示ではできません。
たった一行の文字でも、下に余白がたくさんできてしまう。
これもまた視認性に問題があります。 
　

こういった問題があるので、FileMakerでエディターをつくるのは意味がないと思っていたのです。 
　

そのあたりの問題を、今回Webビューア表示で解決できました。

実際のエディターの動作

ここからは実際に作った（作っている）エディターの動作のお話です。 

ネガティブな話はここまでにして、ここからは良かったこと、自慢話を軽い程度でしていきましょう。 

まずは基本動作の紹介です。 

良かったこと、自慢したいこと

作った経過順でなく「よかった・自慢したい順」でご紹介していきます。

プレゼンを簡単に作れるようになった！

これは最初予定していなかった機能なのですが。ふと思いついてやってみたら 

• できた！

となったので嬉しかったです。
HTMLでスライドを作ることには否定的だったのですが、今回利用したライブラリとアイディアの掛け合わせで一気に大好きになりました。

リッチテキストメールも簡単に作れるようになった！

ある時ふと気がついたのですが 

• Webビューアの表示内容は
• コピーすればリッチテキストになる

んですね。これは最初「ふんふん」って感じだっのですが 

• あ、メールにペーストできるかも！

って思ってやってみたらできた！
それが嬉しかったです。 
　

今までHTMLメール自体を業務で使うのはどうかな？って思っていたのですが。
ここまで体裁がととのっていれば、むしろ使わなければ損かと。 
　

同じ内容をPDFにすることもできますが、スマートフォンなどで見るのは手間です。
大きさも拡大しないと見えなかったりしますよね。 
　

スマートフォンでもしっかりみやすいリッチテキストになっているので。
このあたりも思いがけず便利になりました。 
　

SVGも表示可能に

SVG形式のファイルは、オブジェクトフィールドで表示ができません。ファイル扱いになってしまう。 

これもWebビューアなら問題なし。解決しました。 

これにより「FileMakerで使うSVG素材を、エディターに保存する」ということも、気兼ねなくできるようになしました。 
　

エディターと名前がついてしますが、割とファイルや素材の保存先としても使っています。

カラフルなフラグはカスタマイズ可能

メールなどにある「フラグ」これをエディターにも実装しました。 

こちらは 

• フラグフィールドを作成
• チェックボタン＋値一覧

で実装ができるのですが。それを綺麗にみやすくしました。 

その仕組みを検索側に持っていくことができたので、検索もわかりやすくなりました。 
　

フラグについているアイコンは、ちょっとひねった形で実装しています。
そのおかげで、ユーザが簡単にカラフルなアイコンを利用できるようになりました。 

他にも細かい部分は色々あるのですが…

流石に長くなってしまうので、今回はここまでに。 

今このブログも自作のエディターで書いています。最後に 

• どうやってエディターの内容を、自社のブログに持っていくか

をご覧ください。 

何かご質問などありましたら。

下のフォームからお気軽にお問い合わせくださいね！