Hacker News Reader

Comment by whoisjuan | Hacker News Reader

I’m not saying this is ugly but the visual execution of some of these components is poor. No good usage of padding in some examples, poor ratios between the typography and the containers, inconsistent use of different line widths and border radius, weird and incosistent design choices in spacing and proportions…

I mean. This looks alright and it will certainly make any UI look pretty decent, but the execution is not superb like the actual TailwindUI library which is incredibly well thought from a visual design perspective. Those components are perhaps less shiny than these but they are incredibly functional and way more intentional.

This is a good effort though and I hope to see it improving.

View on HN

I think it is not a fair comparison with the Tailwind UI where there's probably more than one person doing the work plus the whole expertise of the actual Tailwind authors in the mix.

If you are able to observe what is severely lacking in this implementation, I am pretty sure that the Github author would welcome your suggestions / comments / PRs and any contribution to make this better.

For a start, this is actually good (enough).

In the same vein that TailwindUI is still continuing to evolve as the maintainers are finding optimization to make it better.

Totally agree and I mean it with no animosity. As an adopter of Tailwind, I really want to see more of these components kits and for the exisiting ones to keep improving.

Fair points but TailwindUI bundle is €258, this is free.

https://tailwindui.com/pricing

Back when Bootstrap 2 was the most popular UI library one of the biggest problems with it was that the defaults were good enough that no one changed them, and consequently every SaaS startup's product looked the same for about 5 years. Pushing people to tweak things while still giving them a solid foundation is a good thing.

I'm not saying that's necessarily the case here, but there is a strong argument in favor of not making the default theme for a UI library look perfect.

This argument makes perfect sense. The easy adoption that never gets updated in future sounds bland.

> the defaults were good enough that no one changed them, and consequently every SaaS startup's product looked the same for about 5 years

Sounds like native GUI experience on Mac or Windows for quite some time, then? I'm certainly not offended when all buttons look the same. At least I immediately know that they're buttons.

I still think about the quote I once heard around that era... "Made with Bootstrap" is the "ft. Pitbull" of web design.

I take it you dislike native software then...

I'd do 100% of my job in a browser if I had the option.

This sort of stuff was difficult to figure out when I was learning HTML/CSS, do you know of any guides which list similar rules and how to make "proper" use of properties like borders, padding, typography etc?

Refactoring UI [1] is a good place (from the guys behind Tailwind) - admittedly I've drunk the Tailwind koolaid, but there are some useful tips on there from a designer POV

[1] https://www.refactoringui.com/

I dislike Tailwind's choice of inlined styles in html, but I agree that the advice in the book is very good.

Unrelated tangent: I'm always frustrated when I see a recommendation for a book only to go and look it up and find that it's actually an "ebook" (in this case PDF).

Not to make a value judgement on ebooks, but I just really like physical books sometimes - if it was on Amazon I likely would have bought it.

Again, not a value judgement on the content - I'm sure it's great (I'm a paid and happy user of TailwindUI)

Yeah I agree, there's something about holding a book in your hands. I also think it helps hold my focus and lets me retain what I read better.

The Non-Designer's Design Book is the best resource I know of for learning general design guidelines, which apply to what you're asking. I've bought this book for many developers and they've all loved it.

I have made notes about these things you're asking. But no idea how to share them.

You could refine them, group the points and put up a blog post (or a GitHub page) and share that here (as its own submission). If it’s with visual examples, all the more better. I’m sure somebody will find it useful.

This stuff all falls under the umbrella of “design”. One thing that helped me a ton was the articles at https://learnui.design - especially the 2-part “Rules for Designing Gorgeous UI”. The course itself is also excellent.

https://every-layout.dev

Graphic design

I agree that there is room for improvement - though I think it's not a bad V1 at all.

A lot of the products I see turning up on Show HN would look infinitely better if they used this library. (The ones where UI design is clearly not the solo-developer's strength).

A few pull requests could fix most of what you mentioned, if the maintainer approved it.

Agreed. Not to sound too critical, but it looks off.

Reply on news.ycombinator.com