Show HN: A clean alternative Hacker News interface | Hacker News Reader

Show HN: A clean alternative Hacker News interface

lipu-flax.vercel.app

11 pointsmemorable21 comments

This is a clean Hacker News interface that I called `Lipu`.

Repo: https://github.com/HoangTuan110/lipu

I find it really hard to read. The white background for starters, but also the lack of indentation which makes it hard to pick one post from the others. Colors too look wrong to me, plus alternating between them makes things even less readable; look at how the HN page makes it so easy to look at the post title by placing it just right of the post number (with the lower line indented for more convenience) and uses black to make it immediately recognizable.

Hacker News may not be very pretty, but it gets a lot of things right typographically, by not trying very hard. I think this might be a good opportunity to play around with learning to improve your layout and type skills a bit.

In particular, I don't think that slab serif typeface with dangling descenders is a good choice for what is a list of a few closely grouped lines of text, as opposed to something like the paragraph typeface HN uses for the body of comments. Likewise, those grouped lines of text need much more room to breath. It's amazing how much work or experience it can take to make a even a link list readable and usable.

Thank you for your comments!

I actually borrow the Zilla Slab[0] font from Mozilla Foundation website[1] just because I thought it looks pretty good. I don't realized how much it is a problem to everyone (It seems like typography and links are common problems of my interface). I will need to find a more appropriate font to use for this case then.

[0]https://fonts.google.com/specimen/Zilla+Slab [1]: https://foundation.mozilla.org/en/

Slab Serifs can be really nice, but they can also be too decorative for a lot of dense text. Slabs, much like Didot, really need to use negative space effectively, along with a great body text pairing, to work well imo

Nice job, Tuan! Having written an HN interface myself, my hat off to you for seeing it through and sharing it.

Building on Minor49er's comment about requests, a nice feature in your next iteration of Lipu might be to cache some or all of the details of the submission on your server side. Three benefits from doing that are: (1) you can choose how often you query firebaseio for fresh data to avoid hammering their server, (2) your UX latency isn't so dependent on network traffic, and (3) you can reuse the submission details (i.e., provide a speedy response to user) when the user switches from one category (e.g., top, new, ask, show) to another and the same story happens to be present in both categories.

For other HN readers, Tuan has a brief dev blog of sorts about developing Lipu: https://tsk.bearblog.dev/journal-lipu/ . (Not too bad for a 14-year-old!)

Nice find. This is a great devlog (and I like the theme on this).

Bright future ahead

This sucks to say, but I don't like it very much.

It lacks contrast and lacks space between lines.

Additionally, clicking on the comments just brings me back to HN.

Good job putting something out there.

yeah I'm not a fan of that over the normal one either.

but having said that I normally only ever access HN articles via RSS anyway, So I never would see either.

I don't think so.... my first thought was "this is too cluttered"

Just a blank page when Javascript is disabled. Which is fine (though a small noscript message would make things clearer), just letting you know in case it's a use case you just didn't consider, rather than decide not to support.

Nope, not even close. Lipu takes 3 seconds to load all threads, while HN original is instant. Plus that white it burns. I like light themes instead of dark, but not pure white. HN's light grey is perfect.

And Lipu doesn't work without JS...

Hmm. I always considered HN to be one of the cleanest sites that displays dense info. Props for going through with the project though! I'm sure you learned a lot of useful things.

If you want some feedback: I'm hvaing a hard time distinguishing one post from another. Maybe changing the color of the author & comments links could change that? Maybe add some spacing, so that the title & metadata is grouped together? This id already starting to approach native HN though. :)

Each page makes a request that returns a list of IDs which appears to then be used to make individual requests for each news story. So each pageload makes dozens of requests. Couldn't that information just be provided in the first request?

Also, the layout is a little too minimal. It's harder to scan headlines than it is on Hacker News. Even just a small amount of spacing between the items would work wonders here.

Overall, I'm not totally sold on this being a clean alternative to Hacker News (which is tough to beat since you really can't get much cleaner than HN to begin with), but I think you could significantly improve the experience without having to change too much.

I have been trying to do the same thing. You can see my try at https://hn.hsblhsn.me/

Very cool! I like the teaser of each link's textual content that you offer from the digest view. And pulling in the og:image is also a nice touch, IMO. And all in Go!

I dont know much front end, but does it really make sense that a style wrapper is only 5% CSS code?

Is CSS mostly deprecated now in favor of js libs?

I can see the inspiration here but the execution could be more refined i think. Great job putting something into the wild though!

The interface is a little hard to look at and things feel squished together, and it also doesn't offer anything beyond the default page.

I've been browsing HN using hckr news for years now, it sorts submissions by time and has a really great UI/UX.

https://hckrnews.com/

A decent attempt but like others have said it's a bit cramped so just giving the text some breathing room would be a big improvement to your current copy.

For anyone else by far the cleanest, functional hn implementation is https://hckrnews.com

Strongly prefer the original HN.

Reply on news.ycombinator.com