Framerに新機能「Masonry Grids」が追加されました。グリッドプロパティのトグルを切り替えるだけで、コンテンツの高さに合わせた隙間のないレンガ状のレイアウトを簡単に作成できます。CMSやFit Image機能との連携も可能です。
Framerに、コンテンツの高さに応じて要素を隙間なく敷き詰めることができる「Masonry Grids（メイソンリーグリッド）」機能が追加されました。従来のグリッドレイアウトから、プロパティ内のトグルを1クリックするだけで、簡単にPinterestのようなレンガ状のレイアウトへと変換できます。
この機能は、固定された列幅を維持しながら、各レイヤーのコンテンツ量や画像の高さに合わせて行の高さが柔軟に変化します。最近リリースされた「Fit Image」機能と組み合わせることで、画像の比率を崩さずに美しいギャラリーを構築することが可能です。
さらに、ツールバーのレイアウトメニューから直接新規のメイソンリーグリッドを作成することもできます。CMSデータともシームレスに連携し、Stagger（スタッガー）やLightbox（ライトボックス）などのエフェクトを組み合わせることで、魅力的なアニメーションやインタラクションを実装できます。
グリッドプロパティのトグルを1クリックするだけでメイソンリーレイアウトに変換可能
固定の列幅とコンテンツに応じた柔軟な行高さで、隙間のない配置を実現
「Fit Image」機能との組み合わせにより、Pinterest風のギャラリーが簡単に作成可能
CMSと連携し、StaggerやLightboxなどのエフェクトを用いた高度な演出に対応
FramerのMasonry Gridsを活用することで、デザインの自由度がさらに広がり、ポートフォリオやギャラリーサイトの構築がより直感的になります。CMSや各種エフェクトと組み合わせて、動きのある魅力的なWebサイトを制作してみましょう。
📌 Framer Updatesの日本語要約・解説｜参照元（英語）：Framer Updates — Masonry Grids｜情報提供：Framer B.V.
