Figmaで画面遷移図やフローチャートをつくるときに線を自動で引いてくれるプラグイン「Autoflow」

Figmaで画面遷移図をつくりたいときは、「Autoflow」というプラグインを使うと、すばやく遷移の線を追加できて便利です。
Autoflow

Autoflowは図形やフレーム間を、簡単に矢印で接続できるプラグインです。
1度接続すると、フレームを動かしても矢印が追尾してくるので、非常に便利です(Autoflowを起動している必要があります)。
基本的な使い方
Figmaのメニューバーで[Plugins]→[Autoflow]を選択して、「Autoflow」パネルを表示します。
このパネルで線の色や太さ、開始位置と終了位置のあしらいを設定します。

あとはこのパネルを表示した状態で、開始位置のフレームを選択し、その後終了位置のフレームをshiftを押しながら選択します。
すると選択したタイミングで自動で線が引かれます。

この手軽さが非常に気持ちよくて、フレームをどんどん選択していくだけであっという間に線が引き終わります。
パスの細かい調整も必要なくなるのでかなりラクになります。
フレームの移動
「Autoflow」パネルを表示した状態であれば、フレームを移動させても線は自動で追従してくれます。

パネルを閉じてしまっていると追従しなくなりますが、再度「Autoflow」パネルを開いてフレームを移動させると、現在のフレーム位置に更新されます。

Figmaで作ったスマホデザインを「Mirror」機能を使ってリアルタイムに実機確認をする
Sketchの整列をショートカットキーを使ってすばやく行えるようにする方法
Sketchのパス周りの基本操作|基本的な描画方法からベクターツールと直線ツールの違いまで
FigmaのSearch Menuを使用して必要なメニュー・コマンドをすばやく実行する
Figmaに独自のショートカットキーを割り当てる方法
Figmaのバージョン管理機能を使って、デザインの変更点を管理する
Figmaで図形の分割をして簡単にレイアウトを作成する拡張機能「Split shape」
記事内の画像にマウスホバーした時に画像が半透明になる意味はあるのか?
Figmaで簡単に波の素材を生成するプラグイン「Get Waves」
Sketchでデザインを作成するときの基本的な操作方法
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
高速なzshのプラグインマネージャー「Zplugin」の導入方法
macOSのシステム環境設定「ユーザとグループ」の設定見直し
ショートカットキーの一覧をSketchを使って作成する方法とそのメリット
Alfred 4のファイル検索機能を使って、ファイルの操作を高速で行う方法
.DS_Storeなどの不要なメタデータファイルを自動で削除する「BlueHarvest」
iOS Safariでinputタグにフォーカスを合わせると、自動で画面が拡大してしまう原因と解決方法
Path Finder 8で動作がおかしいと思ったときにチェックすること
1Passwordでウェブサイトの入力フォームを一瞬で入力する方法
Vue CLIをインストールしたのに「command not found: vue」と表示されてしまう場合の対処法
Keyboard Maestroでウインドウのリサイズや移動をするときに使う「SCREENVISIBLE」についてのまとめ