Summary
- Assess and improve layout spacing, visual hierarchy, and rhythm to transform generic arrangements into intentional compositions.
- Analyzes current spacing consistency, visual hierarchy, grid structure, and rhythm through systematic assessment including the squint test for identifying primary and secondary content Establishes a semantic spacing system using consistent scales (framework tokens, rem-based, or custom) and applies gap for sibling spacing instead of margins Recommends layout tools by use case: Flexbox for 1D layouts and components, Grid for 2D page-level structures, with guidance on responsive patterns like repeat(auto-fit, minmax()) Breaks monotonous card grid patterns by varying sizes, mixing card and non-card content, and using spacing and alignment for natural visual grouping Requires the frontend-design skill and its Context Gathering Protocol as prerequisite; includes optical adjustment guidance and a semantic z-index scale for depth management