247 comments

[ 3.2 ms ] story [ 273 ms ] thread
Haxplore is a little web app I created because I didn't like to click around the HN interface to read submission and discussions. I also wanted to experiment with different ways of implementing keyboard control in web apps and HN seemed like the perfect test subject. So maybe it's useful for some of you too. The most important features are:

- Intuitive keyboard control

- Link detection in comments with hotkeys to open them directly

- Better readbility and formatting of comments

- Hotkeys for the most common actions

- Ability to open stories or comments in an overlay for reading long texts

How do I read the comments?
You have to use your arrow keys, WASD or HJKL to navigate through the comments.
I could not figure this out even after using the help dialog repeatedly, since I assumed "navigate" meant "scrolling up and down the page", and there were three shortcuts that actually mentioned comments.
It's built for people who use the keyboard, your mouse will not help you here.
Please work on this more, this is just such a pleasant interface! On the other hand, the criticism here in HN is also mostly correct. It should be more accessible, but definitely a great start!
Thank you very much! Got great feedback so far, so I'm definitely gonna work on it and try to improve the experience.
I love the keyboard interface please don't listen to anyone trying to change that part :).
Don't worry, I will definitely not change anything about the keyboard control part. You have my word! ;)
brilliant work, please do twitter next

very addicting

Thank you! That's funny, when I started this project I actually wanted to build it for HN, Reddit and Twitter, but couldn"t find the time for it and scrapped that idea. Guess I should revisit that decision.
Twitter already has keyboard navigation
The web page doesn’t scroll.
This is intentional. You have to use your arrow keys, WASD or HJKL to navigate.
(comment deleted)
Mixed with keyboard tabbing, it gets really confusing.
This is true. I recommend to not use keyboard tabbing while navigating throught the comments. Makes it a lot less confusing and you still do everything.
However, it's impossible to read longer comments this way. This comment https://news.ycombinator.com/item?id=28705415 in this very thread is too long to fit in my browser window, which is maximized on my 16" laptop. So far I'm just pressing O, but it still takes time. A scroll for long comments would be really welcomed.

Other than that, it's a very cool UI! I can see using it full-time and press O only when I want to reply. Actually, I just did :D

You can actually press spacebar to open a comment inside a modal where you can scroll.

Wow, thank you very much! :D

I like the design - too bad that HN does not allow for you to add comment support. That would make it perfect
I was just thinking about this myself. It would be so awesome to add something like OAuth2!

But then I realized, this would break the subtle cohesion of the current model. Everyone has to specifically come back to news.yc to comment. Everyone has to use the HN design. I do wonder if this is intentional, or at least strategic - because the current approach enforces a certain perspective when commenting that *perhaps* might be broken, or at least made much much harder to maintain, by the fragmentation induced from being able to run off and build totally alternative interfaces.

It's just a thought. I'm not sure if this is just hot air.

I've thought the same thing.

Looking at reddit, whenever someone complains about degredation of discussion, somebody pops up and says "just use old.reddit.com". However, everyone else is still on new reddit, so even if you increase the quality of your submissions, the overall quality still drops.

I would use the new reddit interface specifically if they re-enabled the old comment experience. The current one is terrible.
My understanding is it’s an attempt at spam reduction. By not providing an API for commenting they make it harder for spammers.
I'm able to add comments using my current unofficial Android app. These apps just work around the requirement by issuing some sort of HTTP requests similar to the site itself.
Intitial impression: "oookay [click] let's have a look let's see how badly broken *this* HN frontend i--ooh. Oh, okay. Wow this is nice!"

And it truly is. There's something this honestly nails.

But after using it for few moments, I was able to crystallize what I perceived was "wrong" with the design: the mechanic of combining locality with spatiality means I completely lose sight of the bigger picture. I have a really bad memory and attention span, so I depend on constantly reading cues/senses of scale from my environment. As in, they need to be constantly there. (For example, the first thing I'd do if I ever used a Mac was make the scrollbars permanently visible.)

With this UI, the immediate and global focus (the only focus) is on the comment I'm reading right now. Paradoxically, the clear intuition is that this would reduce distraction and increase focus, but (at least for me) by only presenting individual details I cannot establish and maintain orientation about how big a thread is, the structure of it (a few large mega-subthreads, or subthread islands, or hundreds of upvotes but only like 15 total comments), etc.

I tend to take full advantage of scroooooling through and cherry-picking comments to read at random. I've long dreamed of solutions that provide a rigid framework that ensure I read every comment, but I've kind of accepted that such approaches just don't work in practice; they require a tremendous amount of discipline to use (almost like grammar-proofreading a book).

A UI that has me consider every single comment as globally important ("it's the only thing on the screen at this exact moment"), both a) maxes out my attention span very quickly and b) feeds me a non-representative, breadth-first view of the discussion, because I find there's a nontrivial effort associated with needing to hit the right arrow key to expand the comments: I Have No Idea How Many Subcomments Are Hiding In There nO I aM NoT GoInG iN ThErE ThAt iS ScArY. For whatever reason (???) it's physiologically easier to just keep hitting Down instead.

This is honestly novel and interesting - and because of how well-executed this is, I can say that if you were to ever to consider tackling global orientation (I'm imagining spotlight/expose type zooming here, but I strongly suspect that would be just as disorientating as not being able to vaguely internalize the bigger picture at all), I would be very interested to see.

Agreed with pretty much everything here. It's a nice UI, looks good, is smooth, well done overall.

However, it doesn't fit how I read HN or Reddit - I tend to scan and be drawn to keywords and visually interesting parts of the thread. This type of UI turns the comments into a TODO list of indeterminate length.

I like this!

I use a tiling WM, so I can have this open in a window (or scratchpad) that is shrunk to the width of your column, and just shoot over to it, and move around nice and easily!

Two things:

- alt + h doesn't open the Help for me, it opens the actual help menu in Firefox.

- It would be nice to mark the entries as 'read' and show if more comments have happened since reading

Edit: Wrapping it in a small Tauri app would be cool, then it gets rid of the bookmarks and stuff I have at the top :D

Thank you for liking it :D

1. The alt+h hotkey will be probably be replaced by "?". That should fix this.

2.1 That's a pretty cool idea. Would you want the "mark as read" part to happen automatically or manually?

2.2 Showing new/unread comments is also a cool idea but it will increase the amount of requests to the HN api. However I'm gonna look into it.

Wrapping it in a Tauri might be cool, because I actually wanted to try that. But I think the first step would be to make it a PWA, so you can install it without downloading anything.

Thank you for the feeback!

> Showing new/unread comments is also a cool idea but it will increase the amount of requests to the HN api. However I'm gonna look into it.

At the simplest level LocalStorage or equivalent keyed on the submission id with a prior comment count to be compared with the new comment count would be sufficient. If it had a time of hast check as well, highlighting new comments would also be easy.

I'm not sure about other people, but thise are really the two things I care about most when trying to keep up with a discussion (are there new comments, and which are they).

Storing view time would make things easy, but might break on subthreads. You can probably just store all the comment ids in LocalStorage, and highlight comments that aren't in that set before putting them in there (or maybe put them in there only when scrolled to/past).
It would be neat if there was an option (maybe for the future, a simple settings modal) to either mark as read once 'opened' or a hot key to mark as read (or toggle?). Kinda like email clients lists.

I use live bookmarks in Firefox, so I have a tick next to the items I have looked at, just something like that, or some sort of visual indication.

The comment count thing was more a thing I like on other sites, so like on ArsTech I can see if there are more comments from where I last read (which is handy to go and see if there are more cool discussions going on) but yea maybe would hammer the API a bit too much - unless limited to just 'new 'or 'ask' or something

If you switch to ? keep in mind that some keyboard layouts (e.g. Hungarian) require a modifier key to type this character.
It requires one for a US layout too (shift) if you match on the actual `?` character and not `/`
Can’t wait to try this when I get home!
Great work, especially the comment navigation. I find it much easier to view the comment threads and scan top level comments.
Reading this post on Haxplore itself is even better :)
Would love to see a PWA from this, as most I've found are basically ugly. Congrats for the work done.

PS : Please use another color scheme or put a dark mode somehow, my wife will kill me if I open the app at night.

Thank you. I will add some basic PWA functionality soon.

Oh, and I just addeda dark theme. Just to keep you alive. ;) It should be applied automatically, but you can also change it in the settings.

Really cool!

My $0.02:

I wish this looked more like hacker news: IE, same colors, same fonts, same text size. I've been using Hacker News for so long that its look and feel are part of its queues. Different colors / fonts just gives the same content a different feel.

I'm torn on how you display comments. One thing that I don't like in Hacker News is that a top-level comment with a lot of replies ends up pushing other top-level comments too far in the page. Your approach, though, is the polar opposite: Never show replies until I select a comment and push ->. Perhaps show a few of the replies with smaller text?

wow, I've never even thought of such a simple change until I've read your reply (all comments collapsed by default as opposed to expanded by default), but I want it really badly now.

Many HN apps and browser extension by now have an easy way to to collapse comments (usually by clicking an icon next to the comment or tapping on the comment on touchscreens), but I don't think I've seen one yet where collapsed by default is an option.

P.S. And now that I am thinking more about it, apps and extensions (at least the ones i've used so far) don't even have the true "collapsing" function (or maybe I just wasn't aware of where it is buried in the settings, so please let me know if I am wrong here).

When you try to collapse on Refined HN (ff/chrome extension) or HACK (iOS app), it doesn't hide all child comments and then keeps the root comment (just listed those two extensions/apps as an example, because those are the two I personally use). It hides the content of all comments including the root comment that you clicked, but it leaves a small indicator that there is a collapsed comment, basically just the username and the number of comments.

To this point, I have a question to everyone. If there is an HN app for iOS that anyone can genuinely recommend that has a feature when you collapse a comment, it still shows the one you clicked "collapse" on but hides all child comments (as opposed to the text content of the root comment you collapsed being hidden as well), please post them.

Thanks, good point. I'm thinking about adding a hacker news theme that mirrors the colors and fonts.

Showing a few replies would be possible, but I think it would clutter the interface and make the thing a bit more confusing. In my opinion showing the amount of replies should be enough, but I will keep this in mind.

This is awesome!! :)

One tiny thing (though everyone's tiny suggestions sure add up :D ) (aside from the alt-h not working in firefox)...

It would be awesome if hitting space or something on a selected post would open it in a iframe (or panel) in the middle of the screen.

Then be able to up-arrow/down-array (or PGUP/PGDOWN) through the page and escape out of it.

This would mean you can quickly skim an article without leaving the app!

But, well done, it's absolutely wicked :D

I completely agree on the iframe. After opening a link I keep trying to go back by pressing the left arrow. Pressing Ctrl+W is not to bad to close the tab though.
Indeed, not too bad and this is what I did, but certainly not immediately natural, as you have to rely on the browser's tab history

(i.e. you closed this tab, redirect user to previous tab), so wouldn't work if I starting viewing a HN post, then continued work (that I should have been originally doing) then go back to the post, close it and then browser redirects me back to the 'work' tab that I came back from..... if you see what I mean.

Tab history: * Expected: HN client -> website from post -(ctrl+w)-> HN client vs: * HN Client -> HN post website -(switch tab)-> real work work tab -(switch back)-> HN post website -(ctrl+w)-> real work tab :(

)*

*Think I opened a bracket somewhere in the comment and haven't closed it

Thank you! I'm definitely not complaining about the amount of feedback. It's really amazing.

That really is a great idea. One issue might be that not every site allows being shown in an iframe because they block that functionality. But I'm gonna look into it!

yeh, I can imagine that feature spiralling in complexity (up to pre-checking server-side if they provide CSP/Frame headers, then outright download and proxy the page :P )

Yeh, I could maybe image a 'p' button that would show a preview, that would just be hit-and-miss... I wonder what percentage of submissions on hacker news actively disallow iframes... like actual blog posts and not things like 'new apple product' from Apple's website :wondering:

idea: can you pre-fetch just the top comment for each post?

Currently ..clicking on right arrow always shows the "loading" animation for 0.5-1 sec.

Instead, if we readily show the top comment instantly and then lazy-load the rest, it will drastically improve the UX. User will perceive near zero wait time that way. My 2 cents

Thanks, that's a pretty good idea. I will probably add this in the future, but so far everyone seems to be okay with the performance/speed.
This is amazing, thanks!

Personally I am a fan of scanning over threads on https://hckrnews.com/ , filtering by "Top 20" or "50%", and opening interesting ones in a new tab. It especially helps to only go through the titles I haven't seen yet.

> Intuitive keyboard control

Can you expand on that? What were your references when choosing these key commands? Everything else I use chose `?` as the help key. My macbook doesn't even _have_ an `ALT` key...

With that I mean the navigation through the submissions and comments via the arrow keys not the actual hotkeys or key combinations. The alt+h was a bad choice and will be switched to '?' in the next update.
It looks good! Thank you for creating this. Just one thing - I visit hn.com with js disabled, but your website requires js to function. For that reason alone I will stay with hn. I don't mean to come across as ungrateful, because I do not mean for my comment to appear that way. Thank you for sharing!
Thank you! That's totally fine.
I miss a tiny thing: seeing when each comment was created.
Good catch, this will be added in the next update.
I really like it! I'll use it as my default HN client for a while, see how it goes. This app makes me focus more on the content than regular scrolling HN.
I'm really glad to hear that. Heads up, there will a big update in the next few days.
I really prefer that it shows only the top level comments by default, which can be expanded with a simple key. Overall fantastic experience.

I just have two suggestions. Add a dark theme and options to show only top 10/top 20/all just like hckrnews.com which helps to keep track of things and not miss important stories on busy days.

Love this, and hope you continue the development.

Feature request: Ability to open an HN URL in Haxplore.

Cool idea, but not very Mobile friendly
Thank you. And yeah it does not really work on mobile, but to be fair it's not supposed to. I only spend a few minutes on it to make it somewhat useable. As far as I know here are many other HN clones that improve the mobile experience, so I focused solely on building something cool for desktop/keyboard users.
Deciding that it's not meant for mobile is a perfectly acceptable position to take, in my opinion.
Yes! To the UI developers: Please don't let optimizing for a single platform become a lost art. Not saying cross-platform should not be done or anything like that, but using an application that's 100% tailored to my device is nice to experience, from time to time.
It looks nice.

I like to use the mouse anyway. Each post has the number of comments, something like "123 comments ->" Can you make the number of comments and the arrow clickable? Also, the "<- Back" inside each post.

It I'm reading a comment, the author and "open" should be clickable too. I didn't understand what "open" means, perhaps change it to "open in HN".

Thanks. I'll think about making some elements clickable. But if some are clickable and some are not it might be even more confusing if non of the elements are clickable. So I'm not sure if it's a good idea.

I'll consider changing it to "Open in HN". It is more clear about what it does but it's also longer and maybe a bit redundant.

As I said, I like to use the mouse. Just make everything clickable :) .
Why are you blurring the previous row? Why are you disabling scrolling? These are hostile to the user.
Scrolling is disabled because this is not a website for mouse control, it's explicitly made for keyboards. You can notice this by the application not having any mouse controls at all, no links and so on. It's not user hostile if the goal is keyboard controls.
There is no reason to disable scrolling even if the primary interactions are supposed to happen with keyboard. I don’t want to remember which websites allow scrolling and which don’t.
I'd say there is a point. With disabled scrolling you can guarantee that the "cursor" will always be on the screen. With scrolling enabled, you could out scroll the selection, making for worse UI experience. I'm also not a fan of blurring the previous article, but I guess they chose to do it to put focus on your current selection.
It's an informative website. This is bad UX for an informative site. Sure it can support keyboard shortcuts for additional fast access. It will be better for power users. But disabling scrolling with mouse and touchpad is hostile and counter productive to the casual users who might be interested in the content.
It appears the whole point of this site is the keyboard navigation. If you don't like it, just use Hacker News.
Yes, but "enabling keyboard navigation" shouldn't mean disabling mouse based navigation. There are multiple people on this thread who are confused because of disabled scrolling which shows that it's bad UX.

> If you don't like it, just use Hacker News.

Yes, I will not be using this site. Just giving my feedback and opinion on the UX just like you.

> Yes, but "enabling keyboard navigation" shouldn't mean disabling mouse based navigation

If someone shows me a project for keyboard navigation, I won't complain that there is no mouse navigation, as that would go against the very nature of the project.

> Yes, I will not be using this site. Just giving my feedback and opinion on the UX just like you.

But you're not actually giving any useful feedback on the UX the person has implemented, you're giving feedback towards some UX that doesn't exist and won't exist as it's outside the scope of the project.

It's like someone showing you that they built a car for themselves, and your first comment is "but does it float in the sea?". No, of course it doesn't float, it's not a boat.

How is that useful feedback to this project?

> some UX that doesn't exist and won't exist as it's outside the scope of the project

It seems to me removing scrolling is actually work as opposed to just letting the default behavior of the browser to prevail. I'm not saying there is no point in having a site with keyboard navigation as the primary mode of interaction. It's just that when you go out of your way to remove something that should be supported natively you're scope creeping.

If losing selection highlight is a problem just disable that feature only why mess with scrolling?

I think you’re being a little defensive. People might like the graphical design but not the control scheme. In that case I think it’s fair to say that. Sure it might intended as a keyboard site but that doesn’t mean the author couldn’t enhance in that, even pivot, if he wanted to.

To use your boat example: there is no point trying to sell kit cars if people are only interested in buying boats.

Ok, this is a pet project so the author might have no intention of taking his design and trying to monetise it. But as long as feedback is civil I can’t see why opposing opinions can’t be shared (and ignored if the author so chooses).

I know on my personal projects, comments that seem to miss the point often then inspire me to create new things. So I’m always interest in any feedback. Just as long as it’s not people moaning about the name lol

It is an implementation of HN that is for keyboard use - how is that hostile to people who want to use a mouse?

Use HN, or any of the 100's of clones/implementations that exist.

This whole "user hostile" thing is getting boring, not everything has to cater for everyone and their desires. This is a pet project being shown off for keyboard navigation - there is nothing "hostile" about that. At all.

I loved the keyboard navigation. Alt+H opens Firefox's Help menu for me however. I wanted to try using it for a while, but then I wanted to comment here, and well, it seems like commenting still has to be done from the normal interface... :)
I particularly like the response time (low latency). It's underappreciated in web design.
That was definitely an important aspect while building it. I'm also glad the HN api is so damn fast.
I love these ergonomics. Thanks for keyboard lovers like me.
Cool, but I find just scrolling the page with the MBP trackpad to be much easier for getting a feel for the discussion.
First of all, congratulations on shipping it! It's pretty cool.

Some feelings I had while using it, just in case it's useful to you:

- To me is a bit strange than when I'm focused on comments, by pressing Enter it opens the URL of the article (that it's not my focus right now).

- Also I would like to add comments, but I think in this version is still not possible.

- As others mention, it wouldn't hurt that those actions can be both done by mouse and keys (or maybe the title of the submission should be "HN with keyboard")

I like the colors and the blur effect, nice touch :)

Thank you very much!

1. In get why that might be a bit confusing. The problem is, you can't focus the article/post after opening the comments, so you would have to go back in order to open the link. I didn't find a better solution at the time, so I just left it like this. Maybe I just have to think a bit harder ;)

2. I mostly just read discussions that's why I didn't even consider a comment feature. But I'm definitely gonna look into that and see if it's possible.

3. Might be a good idea. I actually had a mouse/keyboard switch at some point but removed it because it was a bit buggy and confusing. Maybe I should rethink that.

Thanks for your feedback!

"We're sorry but Haxplore doesn't work properly without JavaScript enabled. Please enable it to continue." well that certainly is a twist...
It's a HN client with keyboard navigation. Not sure what you expect.
How would they have expected anything when that's all the page and the title of the submission say?
As someone who browses the internet by default without any JavaScript enabled, I also find it jarring when websites do this.

I understand that some webapps absolutely need JavaScript to function, but I wish it was handled with a bit more tact than a completely blank page displaying a single sentence asking me to enable it. I'm not calling out op, twitter and quora do this too.

This is great! For stories with 100s of comments it's nice to start browsing from a collapsed view of top-level comments.

- Why is the Comments count shown only for the highlighted story?

- On Firefox Windows, pressing the Enter key on an item triggers a popup warning at the top of the page. Took me a few tries to notice what was going on.

- Alt + H triggers the Firefox Help menu for me :| Can you change that shortcut key to "?" instead? GMail, Github etc use "?".

- The green background for the comment text is a bit too dark.

- Is it just me or is the comment text not showing paragraph breaks?

- The zoom in transition when the comment text modal shows up just slows things down. If I'm going to load many comments in that view I'd rather it load instantly. Also, what's the purpose of this modal? There's a "Space -> Read" for the comment that I'm already reading. I don't get it.

Re: Alt+H ; it's the same for Alt+O on Firefox.
Thank you! Gonna fix that later.
1. I initially wanted to display as little information as possbile to keep it clean and prevent clutter, but I guess it wouldn't hurt to show at least the comments count.

2. Oh, I didn't notice that. Might be caused by the way the new tab is opened. Gonna look into that, thanks.

3. Good catch, gonna change that.

4. Do mean contrast wise?

5. You're right, the spacing between paragraphs is missing. That will get fixed.

6. Yea, I will probably increase the speed of the transition to match the rest of the UI. The modal exists for reading longer comments. It's unnecessary for most, but during testing I found quite a lot of very long comments (especially in Ask HN) that didn't fit on the screen. Scrolling directly inside the comment felt weird, so I added the modal. It also increases the text size and makes it easier to read long paragraphs.

Thank you very much for your feedback!

You’re welcome!

Regarding 4, yep the contrast is less. Hard to make black text stand out against shades of green. An even lighter shade might work.

`wsad` and `hkjl` navigation doesn't seem to work in the modal popout which kind of defeats its purpose.
If anyone likes this interface, I highly recommend Vimium on Chrome and Firefox.
Looks good and works well. Browsing with Vimium is good enough for me though, and means I can reuse muscle memory to/from other sites.
I like it. It's strangely refreshing! I do agree the colors are a little odd. Might be the strangely part! :-)
Thanks! What about the colors do you find odd? I didn't put that much thought into the color choices, so I'm really curious.
It's great. But. Can you please give me an option to just select the entry as if it was a 'normal' menu instead of scrolling the whole page and keeping the 'cursor' steady at the top?
Thanks! This is something I initially tested during development but didn"t feel right for me, so I scrapped. But having an option to switch the mode might be a good idea.
This looks great! The animations are smooth, and the details seem to load fast. How about you try a specific subreddit?
Thank you!

I was actually thinking about adding support for reddit. Might add that in the future.

I'm surprised at how smooth this is and am really considering this as a replacement of the HN page for me.

The only thing I'd love to have added would be an inline mode, where replies to comments are also shown on the top level of the comment section, but indented, just like it's on YC's HN.

More things:

- Always show comments count

- Reloading a comment section should not bring you back to the front page (clear entire state).

Thank you, that is really nice to hear.

I'm not sure about an inline mode because that would kind of defeat the initial purpose of this app. But, I did write it down and will see if there are others who would like this.

There is now an option to always show the comments count.

I'm currently working on exactly that issue. One of the next updates will add support for changes to the browser history and URL so you will be able to reload or share the URL at any point.

You can check the changelog if you are interested: https://haxplore.sleekplan.app/changelog

Front end bug on mobile. As you down arrow the faded part at the top gets smaller and smaller. Chrome on Pixel
Oh, good catch. Mobile is not really a priority right now, but I'm gonna take a look at it later.
Really nice, fancy doing a dark mode version?

Also I didn't quite get how I was supposed to see comments

Thanks, definitely gonna add dark mode soon! I was hoping the arrow would convey enough meaning but I guess it's too subtle. I'm curious, did you read the "How to..." at the start?
Well, I 'thought' I'd read the the "How to"!

Maybe it needs a small guided tour thing

A guided tour is a good idea. I thought about that too but figured it would be too much for an experiment like that. Maybe I was wrong.
Love having more sites enabled with deterministic navigation!

Unrelated, I love keeping my hands on home row, regardless the website I'm visiting with the help of browser plugin vimium.

It allows you to navigate with hjkl, label links and opening them with t, quickly jumps to opened tab with o, etc

press delete to hide, and I'm sold.
That's a pretty cool idea. I'm gonna see what I can do. Thank you!
Loved it. But I'm facing a couple of issues. 1. It's difficult to change menu without mouse. 2.Space for read not working in ask hn page.