Web Anatomy

Design patterns (generic UI idioms like an accordion) and components (styled and coded instances of patterns) are familiar tools for rapidly building interfaces. Web Anatomy details a third tool, interaction design frameworks.

Frameworks are essentially macro design patterns: they describe collections of patterns typically focused on goal achievement (e.g. buying a book), as opposed to task completion (e.g. pagination controls to see more results). Most are generic enough to apply to many kinds of sites (e.g. the “catalog” framework found on ecommerce and library sites; “sign-up” found on social media and banking sites.) These patterns are used across sites, but typically not multiple times on a single site (you only need one sign-in!).

I recognize that the terminology around design systems and patterns is a bit loose, but the distinction made between patterns and frameworks felt forced. Overall, this book was OK, but I didn’t find it particularly eye-opening.