Visual Design
Part III covered the functional anatomy of interface components. This Part covers the design-craft layer underneath them — the typography, color, spacing, imagery, and motion decisions that determine whether a technically correct interface actually feels considered. These chapters return to full depth (definition, purpose, architecture, mistakes, best practices, example) after Part III's intentionally compact lookup format.
Start Part IV — 4.1Typography Systems
The single element present on every screen a product will ever show — and the one most often left to default settings.
4.2Color Theory & Palettes
Color is doing more communicative work than any other visual element — status, hierarchy, brand — often simultaneously.
4.3Spacing, Grids & Layout
The invisible structure that makes a page feel organized rather than merely arranged.
4.4Iconography
A visual shorthand that only works if every icon in a set speaks the same visual language.
4.5Illustration & Photography
The imagery style a product chooses says as much about its personality as any words on the page.
4.6Branding & Logo Design
The identity layer that has to work at the size of a favicon and the size of a billboard.
4.7Image Optimization & SVG
The single most common, most fixable cause of a slow-feeling product.
4.8Motion Graphics, Lottie & 3D
Richer visual tools than a CSS transition — with a correspondingly higher cost if used carelessly.
4.9Hero Imagery & Background Video
The most performance-sensitive visual real estate on a page, precisely because it's the first thing that loads.
4.10Accessibility in Visual Design
Where the visual craft covered in this Part meets the non-negotiable requirement established in Chapter 3.33.