Figmaのバージョン管理機能を使って、デザインの変更点を管理する

IllustratorやPhotoshopなどのバージョン管理機能が存在しないデザインツールの場合は、作業前にファイルを別名保存する必要がありました。
しかしデザインデータはそこそこの容量がありますし、細かい差分を別ファイルにしていくのも面倒です(ファイル名もごちゃごちゃになりがち)。
Figmaにはバージョン管理機能があるので、それを使えば簡単に過去のバージョンに戻したり確認できます。
無料プランは管理期間が30日間のみ
便利な機能ですが、無料プランの場合は管理期間が30日間だけなので注意が必要です。
バージョンを保存してから30日経つとアクセスできなくなってしまいます。
有料プランにすると制限なくアクセスできるようになります。
現在のバージョンを保存する
ツールバーのファイル名横の「下アイコン」をクリックして、「Show Version History」を開きます。

すると画面右にパネルが表示されます。
ここに履歴がタイムライン上になって表示されるのですが、「+」アイコンをクリックして現状を名前をつけて保存できます(自動で保存された分は「autosave versions」として保存される)。

「Add to version history」にタイトルを入力して保存します。
その下の説明文は必須ではありませんが、あとで振り返るときに分かりやすいように入力しておくのがオススメです。

ちなみにこの「現在のバージョンを保存」のショートカットキーはoption + command + Sなので、こちらを使った方がすぐに現在のバージョンを保存できます。
バージョンの復元
バージョンを復元したいときは、復元したいバージョンの右に表示される「・・・」アイコンから「Restore this version」をクリックすると、そのバージョンに戻ります。

非常に簡単に過去のデザインを復元したり、最新の状態に戻ってきたりできます。

FigmaでAdobe XDやSketchのデータを開く方法
Sketchの画像を図形でマスクしたり、グラデーションマスクをする方法
Sketchの整列をショートカットキーを使ってすばやく行えるようにする方法
Figmaで細かいアニメーションを作成できるプラグイン「Motion」
Figmaに独自のショートカットキーを割り当てる方法
個人ブログにコメント欄は必要なのかどうか
Figmaでロゴやアイコンなどのビットマップ画像をベクターデータにトレースするプラグイン「Image tracer」
FigmaのVariants機能でコンポーネントの状態を管理する方法
Figmaの画像周りの基本操作|画像の追加方法や色補正、切り抜き方法まで
Figmaのプロトタイプ機能の基本|作成したデザインに実際に画面遷移を設定する
iTerm2で「Use System Window Restoration Setting」を設定しているとアラートが表示されて機能しない
Google Chromeのサイト内検索(カスタム検索)機能を別のプロファイルに移行する方法
iPadで入力モードを切り替えずに数字や記号をすばやく入力する方法
iPhoneやiPadでYouTubeの再生速度を3倍速や4倍速にする方法
Keynoteで有効にしているはずのフォントが表示されない現象
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
AirPodsで片耳を外しても再生が止まらないようにする方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
GitHubの通知を見逃さない!通知に特化したアプリ「Gitify」
Keyboard Maestroの変数基礎
Neovimを使い始める最初の一歩として便利な「LazyVim」
ウェブサイトをmacOSアプリとしてラッピングする「Unite Pro」
Keyboard Maestroの「Macro Debugger」で複雑なマクロのデバッグを行う方法
無料版でも高機能なランチャーアプリ「Raycast」の基本機能と環境設定
OnyXでターミナルを使わずにmacOSの詳細設定を行う
軽量で高速なターミナルエミュレーター「Ghostty」の設定方法
Eagleで実現するクリエイティブ素材の簡単管理
かゆいところに手が届く「Supercharge」でMac環境を便利にカスタマイズする