メインコンテンツにスキップ

デザインの基本/簡易板と整列板

Watanabe avatar
対応者:Watanabe
今週アップデートされました

dpdpでは、デザインの構成要素として「簡易板」と「整列板」の2種類のレイヤーを使用します。

どちらも複数のレイヤーを格納できるため、グループ化や整理整頓に便利です。

例えば、ランディングページ(LP)を作成する際、全体を整列板で構成し、その中に簡易板を上から下へと並べていくことで、スムーズにページを構築できます。

ただし、簡易板と整列板には、それぞれ異なる特性と用途があります。

ここでは、その違いについて簡単にご紹介します。

➊ 簡易板

簡易板は、内部に複数のレイヤを入れて、自由に配置することができます。

以下の図のように、親となる簡易板(グレー)の中に、さらに複数の簡易板が自由に配置されるイメージです。

* 格納されたレイヤー同士は干渉し合い、重なり合うことが可能です。

➋ 整列板

整列板も、内部に複数のレイヤーを格納できますが、簡易板とは異なり、各レイヤーはプロパティパネルで指定されたルールに従って整列します。

以下の図では、グレーのエリアが整列板で、中の3つのレイヤーは、右側のプロパティパネルで指定された通りに、上から順に左寄せで整列しています。

* 格納されたレイヤー同士は等間隔で整列され、互いに干渉することはありません。

非対称レイアウトも簡単に

最近、非対称レイアウトや意図的なズラしが再び注目されています。

dpdpなら、簡易板を使ってこれらのデザインを簡単に、直感的に実現できます。

デザインの自由度を高めるために、ぜひ活用してみてください。

※ 2025年5月現在の情報をもとに作成された記事です。

こちらの回答で解決しましたか?