Design That Using A Modular Grid
The modular grid is a basis for all areas of graphic design but is especially important in editorial design. The use of a modular grid is connected with alignment, one of the most fundamental design principles. Periodicals created on the basis of a modular grid, easily perceived by a reader, as their design is based on a law of proportion. The
How to Use the Modular Grid. The modular grid is an instrument, not a design method. Thus, before using the grid, you need the concept of a future site. When the concept is ready, describe all blocks of the website pages and block elements. Open or create the modular grid in the image redactor.
For example, in our free Figma 101 email course, you can create an app design using a 3-column grid for mobile, and then translate that design to a wider 12-column grid for desktop. This way of working is fundamental to the efficient creation of app designs today. Even a simple modular grid can hold thousands of layout options.
Don't let the big ideas behind a modular design outline scare you. Getting started with modular design is just like using any other grid or framework. Sketch it out, develop a plan and start designing. The benefits of modular design are clear space and organization, a grid that works in almost any style and ease of use for digital projects.
A modular grid is a system of arranging objects in space based on rows and columns of a specified size. Boxes are where units of contents, such as text blocks, headlines, inserts, and images, can be placed. in an interpretation of Bauhaus design, Bill made use of a 6-module grid in his famous Negerkunst poster that he had created for a 1931
The site's design uses a modular grid to create a pleasant browsing experience. At desktop size, rows are made up of 4 consistently sized modules. Horizontal gutters are slightly thicker than vertical gutters and the margins are consistently sized on the left and right of the design. Like in previous example, the gutters visually separate
The background of the design makes use of a subtle texture for a tactile feel, but the main feature is the strict grid-based layout. The design makes use of a 24px baseline and 6 column grid, which becomes a design feature itself as it remains visible as part of the design. View the demo. The design concept. The design of grid started in
A modular grid is a design structure that divides a layout into proportional columns and rows, creating a framework where elements can be systematically arranged. Unlike traditional grids, modular grids allow for a more flexible and dynamic approach to design. Designers can easily adapt and experiment with various layouts while maintaining a
For a typical design, you can use margins of around 10-20 mm and a bleed of 3-5 mm. Step 2 Determine the Number of Modules. Benefits of Using a Modular Grid. Improves Consistency A modular grid ensures that every element in your design is aligned and organized,
Modular Grid. A modular grid has consistent horizontal divisions from top to bottom in addition to vertical divisions from left to right. These modules govern the placement and cropping of pictures as well as text. In the 1950s and 1960s, Swiss graphic designers including Gerstner, Ruder and Mller-Brockmann devised modular grid systems like