Layout grid là gì?
Còn gọi: lưới bố cục trong Figma, layout guide, layout guide figma
Layout grid là lưới cột, hàng hoặc ô vuông gắn vào frame trong Figma để căn chỉnh nội dung, với các thông số số cột, độ rộng cột, gutter và lề; bản Figma mới gọi là layout guide.
Hiểu kỹ hơn
Thêm lưới bằng cách chọn frame rồi bấm dấu cộng ở mục lưới trong bảng thuộc tính. Có ba loại: Grid (ô vuông đều, như 8px để căn chi tiết), Columns và Rows. Với cột, chọn Type là Stretch để cột giãn theo frame với Margin hai bên, hoặc Left, Right, Center để cột có độ rộng cố định, khi đó ô lề đổi tên thành Offset. Lưới phổ biến: 4 cột cho điện thoại với lề 16, 8 cột cho máy tính bảng, 12 cột cho máy tính với gutter 24. Nhấn Ctrl+G trên Mac hoặc Ctrl+Shift+4 trên Windows để ẩn hiện lưới. Lưu lưới thành style để mọi màn hình dùng chung. Lưới chỉ hiển thị khi thiết kế, không xuất ra ảnh. Ví dụ: trang chủ web 1440px dùng 12 cột, nội dung rộng 1200px căn giữa. Lỗi thường gặp là bật lưới nhưng không bám theo, hoặc mỗi màn hình dùng một lưới khác nhau.
