focaccia
【Figma】区切り線を使って、ページ一覧を見やすく整理する

【Figma】区切り線を使って、ページ一覧を見やすく整理する

渡邊陽平
渡邊陽平

他の人が作ったFigmaデザインファイルを見ているとたまに出てくる、「ページの区切り線」。これがあると、ページが整理されている印象になり、分かりやすいですよね。

この記事では、この区切り線を表示する方法を紹介します。

区切り線を追加する

まず、Pages の右側にある + ボタンを押します。

01

-(ハイフン)を入力します。

02

ちなみに、ハイフンの代わりに、*(アスタリスク)や半角スペースを使うこともできます。また、--- のように、いくつか並べても大丈夫です。

区切り線が表示されました。

03

もし、区切り線を削除したい場合は、区切り線を右クリックして、Delete page を押すと削除できます。

補足

ページをもっと分かりやすく整理するには、従来通りに --- EXAMPLE --- などの空ページを作ってしまうのも良いかもしれません。ただし、この方法では空のページが作成されてしまうため、なんとなく気持ち悪さは残りますね。

04

参考サイト

Figma Forum - Organize your pages with dividers & multiple page moves! https://forum.figma.com/product-updates-3/organize-your-pages-with-dividers-multiple-page-moves-36045