UI FlowsというのはRuby on Railsの開発元で知られるBasecampが考えたツールで、画面遷移を画面とアクションをシンプルに記述します。それらを矢印でつなぐことで、全体の画面遷移を分かりやすく管理できます。 そんなUI FlowsをGUIで手軽に書けるようにしてくれるのがguiflowです。

guiflowの使い方

メイン画面です。左側がエディタ、右側がプレビューになります。

ブラケットで囲むと画面の名前、その下にアクションを書きます。さらに矢印をつけて別な画面名を指定することで遷移が表現できます。

画面遷移は複数段階に付けられます。

guiflowでの記述はシンプルなのでテキストエディタでも十分に簡単に書けます。記法はuiflowを使っています。メンテナンスも楽ですし、プレビューを通して全体像を把握するのも容易でしょう。システム開発時に用意しておくと役立ちそうです。

guiflowはElectron/JavaScript製のオープンソース・ソフトウェア(MIT License)です。

hirokidaichi/guiflow: a text editor for ui flow