Figma

Figma:グリッドレイアウトにHugと分数単位を追加

2025.12.09編集部
Figma:グリッドレイアウトにHugと分数単位を追加

Figmaがグリッドレイアウト機能を強化し、「Hug」と「分数単位(Fractional Units)」のサポートを追加した。これにより、デザイナーはより柔軟で直感的なレイアウト設計が可能になる。

Hug機能は、グリッドの行や列がコンテンツのサイズに自動的に合わせて調整される機能である。従来の固定サイズ指定に加え、コンテンツ量に応じて動的にサイズが変化するため、テキストや画像の量が異なる複数のバリエーションを効率的に管理できる。特にカード型UIやリストレイアウトなど、コンテンツサイズが可変のデザインで威力を発揮する。

分数単位は、CSS Gridで使用される「fr」単位に相当する概念である。利用可能なスペースを比率で分割することで、レスポンシブなレイアウトをより簡潔に表現できる。例えば「1fr 2fr」と指定すれば、2つの列が1:2の比率でスペースを分け合う。ピクセル値やパーセンテージによる指定と組み合わせることも可能で、固定幅のサイドバーと可変幅のメインコンテンツエリアといった複雑なレイアウトも容易に実現できる。

これらの機能追加により、FigmaのAuto LayoutとGridの表現力が大幅に向上し、より実装に近いプロトタイプの作成が可能になった。開発者への引き継ぎもスムーズになることが期待される。

出典: Hug and fractional units for grid

最新のニュース

Latest News

  • 「MarkeZine」と「DIME」、ヒットの理由に迫る共同YouTube「@HitZine」開設
    「MarkeZine」と「DIME」、ヒットの理由に迫る共同YouTube「@HitZine」開設
  • 「装飾画像」なんて存在しない。アクセシビリティから考える画像とalt
    「装飾画像」なんて存在しない。アクセシビリティから考える画像とalt
  • 「ポートフォリオの死」。AIが磨きをコモディティ化した時代に問われる見せ方
    キャリア・2026.10.14
    「ポートフォリオの死」。AIが磨きをコモディティ化した時代に問われる見せ方
  • Microsoft、ミケランジェロに着想した新セリフ書体「Michelangelus」を公開
    Microsoft、ミケランジェロに着想した新セリフ書体「Michelangelus」を公開

デジタルデザインの最新情報をお届け!

unprintedのメールマガジンにご登録いただくと、デジタルデザインの最新情報をメールで受け取ることができます。今までに配信したバックナンバーも公開中!

※登録ボタンを押すと利用規約に同意されたものとします。