Ingrid allows users to visually develop complex and flexible layouts. Similar to a spreadsheet program where you could select and colour cells in a table, Ingrid invites you to make a master grid and then populate it with child elements by selecting individual cells. When elements are added their grid coordinates are “recorded” at the current browser width like keyframes in an animation.
My aim was to build a tool which could generate a starting point when tackling a flexible, grid based layout. CSS grid allows complete freedom of movement for all child elements, and with those elements requiring an adaptive grid for varying screen sizes there’s scope for some incredibly complex and dynamic layouts.