ページのディレクトリ管理が可能に。新機能が目白押しのアップデート「Editor 2021」をご紹介

STUDIOでのデザイン体験を変える「Editor 2021」が、ついに本日リリースとなりました。
追加・変更点の全貌をご紹介します！

作業をスマートにする4つの新機能

1. ページのディレクトリ管理機能が登場

ついにSTUDIOに、ページのディレクトリ管理機能が登場！

ページのパスを「/」で階層に区切って設定するだけで自動的にディレクトリに格納されるので、大きなプロジェクトのページ管理がグッと簡単になります。

2. 「ブレンドモード」など、３種の描画スタイルが指定可能に

スタイルバーに、新たに３つのツールが登場し、STUDIOサイトで可能なグラフィック表現の幅が一気に広がりました。

ブレンドモード
ボックスの背面デザインに対する描画方法を、「ノーマル」だけでなく「乗算」「スクリーン」など16種類から選択できます。

フィルター
ボックス単位（子要素も含む）で、「明るさ」「コントラスト」などの視覚効果をかけることができます。

背面フィルター
ボックスが背面のデザインと重なったときに背面デザイン側にかかる視覚効果を設定できます。例えば「ぼかし」をかければ、グラスモーフィズムのような表現が可能に！
※ 背面フィルターの効果は、ボックス塗りを透明度1未満に設定したときに見た目に現れます。

3. ナビゲーションが多機能に進化

エディタ左上のナビゲーションがパワーアップ！

「CMS」「フォーム」等の任意のダッシュボードや最近開いた他のプロジェクトと直接行き来しながら、より大きな目線で効率的に作業できるようになりました。

またナビゲーションのページ名からは、プロジェクト内の最近開いたページへショートカットが可能。このリストは、ドラッグ＆ドロップで好きな順序に並び替えることもできます。

※ 今回のアップデートで、キャンバスのすぐ上に表示されていたページタブ機能はナビゲーションに統合されました。

4. OGPカードプレビューエリアを搭載

SNSでURLをシェアした際の見え方が、キャンバス右上「OGP Preview」エリアで常にプレビューできるようになりました！

設定は、これまで通りボックス未選択状態でエディタ右上の「ページ設定」ボタンより変更できます。

新しい機能に伴うエディタの変更箇所

新しいEditor 2021では、使用頻度の高いものも含むいくつかのツール・パネルの場所が移動しています。代表的なものをご紹介します。

ページリストとレイヤーパネルを左パネル内に格納

それぞれキャンバス左上・右パネル内にあったページリストとレイヤーパネルを、アドパネルと同じ左パネル内に移動しました。

詳細パネルで管理できる設定を拡張

これまで選択枠の右上にあったリンク設定パネルを、右パネルの「設定」エリアに移動し、タグやIDの設定と同じエリアでリンクが管理できるようになりました。

ページ追加・削除・複製ボタンがキャンバス右上に

ページの追加・複製・削除ボタンを、ボックス未選択時のスタイルバーからキャンバス右上に移動。デザイン編集中も常に表示されるようになりました。

はみ出し設定ボタンがスタイルバー内に移動

選択枠の周囲にあったはみ出し設定（オーバーフロー）ボタンを、上部スタイルバーの左側エリアに移動しました。

Editor 2021では、新機能の追加にとどまらず、より素晴らしいデザイン体験を提供していくため、今後の拡張性も加味したレイアウト変更を行いました。

新しいエディターを土台とし、ユーザーの皆様とともに更に進化していくSTUDIOを、引き続きよろしくお願いします！

ご意見・ご要望は、いつでもツール内お問い合わせチャットやSlackコミュティにてお寄せください。