Layout Grid (Columns, Rows, Margins, Gutter)
Have an ability to display a grid/guides mainly for web design use cases.
As you’ve probably noticed, we’ve delivered Layout Grids in the November release of XD. We’d love specific feedback on Layout Grids as we continue to grow, so I’m closing this feature request. If you have specific additional functionality you’d like to see in the Layout Grid feature, please do file it as a new feature request in the Design feature area!
Cris Lindner commented
presets guides for bootstrap 3, 4... and other frameworks...
Jonas J. commented
It should be similar to InDesign, there is the best grid/column system.
it would be great to have Guideline-Options – like in InDesign – to create a consistent Grid-System
Kevin Neal commented
This is crying out for column grids! :)
Bruno Monte commented
Grid please!!! :)
When I opened up the example file I thought the page content of the last screen "conquering el capitan" felt off-center so I tried to find the grid feature to double check. There isn't one, and it is off-center. Designing page layouts w/o a grid would make me crazy.
Chun Tung commented
Columns, gutter width, column width.
Rows, baseline row, row gutter
Device aspect ratios (16:10, 21:9, etc.) (should ideally adjust rows, baseline, and type to account for true responsive coverage across all screen types)
Chun Tung commented
Please make this the absolute top priority - grids is where I start my workflow :(
Give me columns, gutters, rows, and a snappable baseline grid, and I will renounce Sketch forever.
Awesome, can't wait to see this feature. I personally can't work unless I have grid to do layouts on top of.
Keith Rondinelli commented
Guides will be fairly useless unless: 1) Multiple sets can be created, saved and recalled, similar to the Photoshop extension GuideGuide, which is an indispensable tool for me. 2) A guide set can be rippled throughout art boards for consistency. 3) Some way to implement responsive guide sets, so that a desktop column layout can be automatically scaled down from art board to art board.
Awesome, can't wait to see this feature. I personally can't work unless I have grid to do layouts on top of. Columns and Gutters plz :)
Erick Brian commented
It should just be responsive. I see the current build as a great tool for prototyping or designing adaptive and static pages, not responsive though.
Something similar to what Axure, Macaw or Muse can do with Responsive sites, would be excellent. Something like a responsive artboard, because multiple artboards for a responsive site would be ridiculously complex!
So yes, RESPONSIVE PLZ! (And a grid option. Select grids, gutters, padding, margin, etc.)
Zack Keys commented
Yeah we need to ability to lay in guides. Kinda breaks the program for me when I can't lay one in to create common snap point.
Sketch has a great approach to document grids for layout. Would definitely love to see a version of that here. Without it it will be very difficult to scale up to designing an entire website with this.
A layout grid similar to Sketch. Photoshop grids are useless.
James Bellofiore commented
Should be like Sketch's layout settings, but it should warn when the given input does not add up (like www.gridcalculator.dk)
SERIOUSLY! Can't use the app if it doesn't support guides, and baseline grid. This is one of the top requests we have as web/app designers. Guides suck in photoshop - they suck in Sketch - where's the innovation. We are working with columns and baselines. There must be some way to innovate in this area...
Grid system support like "Adobe Muse" or Photoshop's guideguide extension would be nice. A measurement tool like marquee would be nice both designers and front-end developers.
Zach Bruce commented
Honestly I use the ruler and manual guides very rarely. The ruler itself really doesn't provide much in function other than pointing out what size you're viewing the doc in. I think everyone agrees that we have them on just to drag out new guides.
Smart guides are great enough in XD to make up for the lack of them IMO, but for creating consistent grids and margins between screens we need Guide Layouts. Use Photoshop CC as the guiding example here, Guide Layouts... on artboards work wonderfully.
Provide the ability to add a responsive grid/column layout. Include at least number of columns, gutter width, column width and total width.