Show HN: I re-designed interface for HN | Hacker News Reader

Show HN: I re-designed interface for HN

hacked.unlace.app

20 pointsvednig33 comments

Any suggestions are appreciated, stack utilizes Gluestack UI ,Expo, React Native, and Cloudflare Pages.

There is a known bug via touch scroll ability on Android, external keyboard's spacebar or mouse works correctly though, currently. If you know about a solution, let me know.

Please note, this is just a prototype, it still has a lot of features to be included.

I'd like to learn more about how people use HN and how Hacked could help, where other HN clients failed.

Open articleView on HN

Hard to objectively evaluate with understanding your goals. Why the redesign? What parts of the existing UI weren’t working for you, and why? What decision process went into each part of the stack you’ve used?

Most importantly, what specifically are you trying to learn from this prototype?

My (subjective) feedback of the mobile experience:

- Scroll broken on mobile Safari (iOS 18.2.1).

- Information density is very low compared to vanilla HN, without a visible benefit.

- Force-opening links in new tabs breaks my workflow, as I prefer to use the back button to return to HN rather than find the tab among my hundreds of open ones.

- Touch target of top links (Show, etc) is very small and thus difficult to interact with.

The goals for redesign are simple.

Often, I find myself in situation when I've to interact with HN on multiple devices, the idea is to prevent zooming into each post to focus on the post, maybe information density thing works for me but only sometimes(such as when I'm working on a new idea research), I often view HN top page as stats of what people's opinions or sentiments are on the topics, which can often be wrong unless I've read the article and completed the flow of information. Decision process was:

- Readability of Title

- Ensuring all the posts can be least distracting and fair for upvotes(that's why no favicon or metadata)

- Removal of adrenaline rush factor

Thanks for your (subjective) feedback for this prototype,

- I didn't test on Safari touch (will be including that in CI)

- information density of HN is one of the things that could

become a compromise, I'm hoping to find a solution to that with resizability

- That's duly noted, I understand how navigating through tabs can be.

- I tried going with a button based approach but it only covered more screen real estate so I ditched it for links.

There isn't much to improve in HN UI except maybe two things: megathreads with 100s of comments and recent popular posts that's disappeared in the HN archive. In megathreads there is no way to see at a glance what comments are new. And in HN archive there is no way to show only posts with more than 100 upvotes.

It takes a very greedy approach to screen real estate for no benefit. I don’t like it for that reason. I also apparently can’t scroll on safari ios. (iPad mini using safari on iPadOS 16.1)

I can’t click on a username - it opens the post.

So you’ve added less utility taking more space, allowing me to see less information and perform fewer actions.

I don’t think this adds anything at all I’m afraid.

I would prefer something between this and current HN, simply because the number of mis-taps on HN is still annoyingly high with everything being so close on a mobile, but I agree the design here is a touch OTT for space

Yeah, I've been there too, I'm working on an approach for more readability. I went through other HN clients and found that they were expecting multi-tap upvotes which makes things, again, same as difficult as og hn interface, it's a little bit of historic but less has less usability at the sane time.

If you'd like to include features from current HN what would they be?

I like much of it currently but I would ideally put "hide" and "flag" somewhere less accessible.

In the main view pretty much all the details are useful but I'd be fine to drop the name of the poster of an article (this never guides my attention to an article in the slightest, unlike the other details).

It would be fine to play around with layouts for points, time since post and source site, possibly even using abbreviations to save space, especially if they were positioned differently.

For instance:

  19p | 7hrs | 20c

Instead of:

  19 points by hadat 7 hours ago flag | hide | 20 comments

This seems a better approach thanks, it just popped another feature I was hoping I had on HN telling me how long the article is.

Something like a reading hourglass figure, so I spend less time when necessary and more when I have available.

Also, btw does domain info count? in your experience for the ability of clicking on a link?

Thanks a lot, if it's not working on safari then it definitely is a touch issue of sorts, I've followed the approach to reduce unnecessary information such as numbering and upvotes, but text resizing is something I'm working on, by the time of first release I think it'll be ready to concentrate or expand info on screen.

And,uh usernames that's a good catch, thank you for the feedback.

> There is a known bug via touch scroll ability on Android, external keyboard's spacebar or mouse works correctly though, currently. If you know about a solution, let me know.

While I always appreciate the effort, bugs like these show how most Hackernews readers are antithetical to its design — when all you're serving is paginated HTML documents with form submissions, few things can possibly break in the first place.

Won’t let me scroll down on iPhone

In my case I am using Firefox mobile iOS.

Same problem on Firefox Nightly on Android

i think I've fixed it

can you check now? it should be working

Maybe it's a feature and not a bug. The end of doom scrolling is removing the scrolling.

if you can't fix it, "It's a feature not a bug"

--insert butterfly meme here--

I'm getting that touch is kind of a sensitive issue, I'll have to find a solution to it

i think i've fixed it, tested on android though

The comments are a huge downgrade. Far less clear in my opinion.

Few things have changed since posting here, I've implemented markdown support on comments and in each item, but comments are currently only on the first level of comment tree.

Comment's where people are quoting in MD,like here https://hacked.unlace.app/item?id=42899932

It doesn't work under Netsurf, Dillo, Links, Lynx and who knows more. Congrats.

That's a really unfair take on op's effort

I'll try porting on them, TUI Browsers are amazing, but React Native is very restrictive in the platform and architecture it utilizes. That's why it has not been my first choice, there are dependencies just stacked over each other like jenga blocks, waiting to crash. It's really not a way to build a future proof software. But who cares? as long as it's fast right? Technically anything with a webview should load the site, so maybe some polyfills could do the job.

IDK why everything has to have JS, when HN (save for search, and DDG/GG can do it just it fine) perfectly works without it.

honestly i like the HN UI as-is, the thing i would want would be some form of email / notification update when someone comments on a post i either submitted or commented on etc.

not sure if something like that already exists :shrug:

i think it was a feature on the modernHN extension, it was behind the paywall though

A lot of HN extension have stopped being available since their launch

There's http://www.hnreplies.com at least

this is exactly what i wanted thank you thank you

can you check now it should be working

that's something I'm working on, but as a notification on client apps, not as emails cause emails only will increase clutter in my mailbox.

I built https://hackernewsalerts.com just for that.

Reply on news.ycombinator.com