2017年1月24日火曜日

クラウド型ワークフローでも現行システムや紙の帳票をここまで再現できる

普段、社内のワークフローで何気なく利用している申請書や稟議書といった帳票フォーマットは、その会社に根付いた文化のひとつと言っても過言ではありません。そのため、G SuiteやOffice365と連携するクラウドワークフローへの移行を検討するにあたり、申請・承認画面の「見た目」がそのまま維持できるのか?という観点が重要な要素となる会社も多いのではないでしょうか。実際に、過去ご相談頂いたお客様の中にも「紙帳票や既存のオンプレミス型ワークフローの入力フォームと同じレイアウトで運用できるようにしたい!」と強く望まれている方が多くいらっしゃいました。
弊社のワークフローサービスGluegent Flowでは、このニーズに対応するため、HTMLエディタやGoogleドキュメントを用いた豊富なレイアウト設計機能を提供させて頂いております。 今回は、このGluegent Flow帳票レイアウト機能について説明していきたいと思います。


HTMLエディタを用いたレイアウトデザイン (対象:G Suite, Office 365)

1つ目は、帳票レイアウトをHTMLエディタでデザインする方法です。
このエディタはWYSIWIGエディタにもなっており、HTML・CSSの知識がない一般の方でも簡単にデザインすることが可能です。編集項目は、文字の大きさ・色・書体、表、箇条書き、リンク、図、線等となっています。HTML・CSSの知識があり、かつ、位置等の指定を細かくカスタマイズしたい方は、ソースコードビューに切替えて、直接タグ編集による指定も可能です。
以下は複数の入力行を持つ「経費精算申請書」のレイアウトをHTMLエディタ上で作成し、Gluegent Flowに適用した入力フォームのサンプルです。文字の大きさ・書体、表の段組み等、全てHTMLエディタ上で指定したもので、リッチな帳票レイアウトが実現できていることが確認できると思います。

HTMLエディタ上でのレイアウト例

上記レイアウトを適用した入力フォーム画面


Googleドキュメントを用いたレイアウトデザイン (対象:G Suite)

2つ目は、帳票レイアウトをGoogle ドキュメントでデザインする方法です。
Gluegent FlowはG Suite連携機能の一つとして、Googleドキュメントによりフォームテンプレートを作成し、適用する機能を提供しております。HTMLエディタほど細かい設定はできませんが、Wordライクな操作性でレイアウトをデザインすることができます。
以下は、Googleドキュメントでデザインした帳票レイアウトのサンプルです。HTMLエディタと同様、Googleドキュメントで定義したレイアウト通りに入力フォームが表示できていることが確認できます。

  Googleドキュメントによるレイアウト例

上記レイアウトを適用した入力フォーム画面



以上の通り、Gluegent FlowではHTMLエディタやGoogleドキュメントを用いて、柔軟にレイアウトがデザインできることがお分かりいただけたかと思います。
ご利用のユーザの中には複雑な紙帳票レイアウトをGluegent Flowでほぼそのままの形で再現されているケースもあり、我々も時々驚かされる一方で、十分な可能性を感じております。 もしご興味をお持ちいただけましたら、是非お問い合わせください。