Hacker News Reader

> At the same time, I'd also love to learn more about more "down to earth" tutorials/examples/exercises/courses to build practical UI skills. Something above "react tutorials", but something below Victor's "Magic Ink"

I have no recommendations for UI in general but for practical UI skills I really like Every Layout [1] which covers common page layouts and how to make them responsive beyond just media queries.

[1] https://every-layout.dev/

View on HN

I found Every Layout incredibly useful and, even when I’m not using their components I rarely find myself writing a piece of CSS that just won’t do what I want (an all to common occurrence before the book).

Strong recommendation for Every Layout, and any other project from creators Andy Bell and Heydon Pickering.

What I find particularly compelling about that resource is its structure. It's not just a list of recipes (despite what the landing page suggests). They build it all up from a foundation of general principles which provide guidance in visual design far beyond the enumerated examples [0]. Then by showing their work developing each example, they show how to apply the system of design thinking. It's really quite elegant!

Reply on news.ycombinator.com