From the course: UXPin for UX Design

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Using the UXPin Smart Grid

Using the UXPin Smart Grid - UXPin Tutorial

From the course: UXPin for UX Design

Start my 1-month free trial

Using the UXPin Smart Grid

“

- [Instructor] The core intention of a design system is to impose consistency upon the elements on the screen. As well, the placement of those elements must also be consistent, which is why design systems are grid-based. In UXPin, the grid is established using the properties panel. In this example, I have a blank Android page. And to add a grid to the page, you simply click the plus sign for the grid section of the properties panel. From here, you can set the number of columns. So if I want eight columns, I can just change the four to an eight. You can set their width, their gutter spacing and even the margins. Now, the neat thing about this is once it is set every subsequent page added to the project will show the grid. To turn the grid on or off, you can press the option or alt key and press G. And it's on, option-G, option-G, alt-G, alt-G. Now, one grid feature that I just adore is called smart grid. Basically…

Contents