first commit

sn-infographic/references/layouts/f-pattern.md

@@ -0,0 +1,36 @@
+# f-pattern
+
+Eye scans the top and left side, forming an F shape.
+
+## Structure
+
+- Most important content in the top horizontal band
+- Second most important in a secondary horizontal band
+- Left-aligned content for the vertical scan
+- Right side less prominent, used for supporting details
+
+## Best For
+
+- Text-heavy infographics
+- Report or article-style layouts
+- Content where hierarchy matters most
+- Designs optimized for quick scanning
+
+## Visual Elements
+
+- Strong top banner with headline and key visual
+- Left-aligned content column
+- Secondary horizontal accent below the top band
+- Right column for supplementary info
+
+## Text Placement
+
+- Primary headline in top band
+- Key points left-aligned in the vertical column
+- Supporting details in the right column
+
+## Recommended Pairings
+
+- `aged-academia`: Editorial report layouts
+- `ui-wireframe`: Content-heavy wireframes
+- `corporate-memphis`: Structured business reports