Show HN: UI Foundations, explaining UI design in an interactive platform (opens in new tab)

Hey,

As I've worked in design and development, I've found resources that have been most helpful at teaching principles are the ones that can present content in multiple formats, especially ones that are interactive.

I worked on Egghead courses focused on building animations in React that resonated really well with users because what is being taught is so visual. Before that, I worked on the docs for Gatsby.js and designed a lot of tutorials and content, including illustrations and interactive components we embedded in our docs that were also very well received by our community.

I decided to combine some of those things that I love and put them together in a course platform where I could organize and store tips and strategies for good UI design, alongside fundamental principles and theories.

I'm having fun with the project and interested to hear feedback! Thanks!

Why is floating heart icon that overlaps with image considered better than being under the image? The so called «importance» you add makes it so that it's harder to see the image and I'd say it's more important.

Why would a heart icon need to be important? Image is important, it's part of the content, and each image is different. Hearts, well, are generated elements, there's a heart on each item, and they are all the same. Do you really want your heart buttons be more important than item images? Looks like you are making image the least important element.