サイトやアプリの画面遷移を分かりやすく見せる、ユーザーフローを作成する要素が揃ったプラグイン -UserFlows
Post on:2017年4月19日
sponsors
Webサイトやスマホアプリの画面遷移を伝えるフローチャートやユーザーフローを3つのショートカットで作成できるSketchのプラグインを紹介します。
ラインやアロー、条件付きロジック、フローダイアグラムなどが簡単に作成できます。
UserFlowsの使い方
UserFlowsの使い方はシンプルで、簡単です。
3つのショートカットを使用するだけで、フローを作成できます。
リンクの定義
2つのアートボード間のリンクを定義するにはレイヤーとリンク先のアートボードを選択し、「command+shift+K」を実行します。
条件付きロジック
条件付きロジックを追加するには、「command+shift+D」を実行します。編集するには、アートボードを選択して同じコマンドを実行します。
フローダイアグラムの生成
すべてのリンクを定義したら、「command+shift+F」を実行します。開始画面を選択し、フローの詳細を入力して、「Generate Diagram」をクリックします。
コネクションの表示・非表示
作成したコネクションは、「command+shift+9」で表示、「command+shift+0」で非表示にできます。
UserFlowsの設定パネル
コネクションのカラーやサイズ、リンクのサイズ、エクスポート時に加える名前などを個別に設定できます。
UserFlowsのダウンロード
ダウンロードは、下記ページから。
「Download Plugin」をクリックすると、すぐにダウンロードできます。
インストールは解凍したファイルの「UserFlows.sketchplugin」をダブルクリックするだけです。
sponsors
