[HN Gopher] Show HN: Hacker News client with a twist
___________________________________________________________________
Show HN: Hacker News client with a twist
Author : pabue
Score : 501 points
Date : 2021-09-30 10:42 UTC (12 hours ago)
(HTM) web link (haxplore.pabue.co)
(TXT) w3m dump (haxplore.pabue.co)
| KronisLV wrote:
| This feels like a nice way to navigate websites, but at the same
| time looks way better than most of the keyboard driven interfaces
| (since the apps that are optimized for that are typically TUI)!
|
| In my eyes, that just proves the feasibility of the input method,
| as opposed to having to click around - it can work for a variety
| of types of content!
| jaxx75 wrote:
| If anyone likes this interface, I highly recommend Vimium on
| Chrome and Firefox.
| a_c wrote:
| 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
| eigenrick wrote:
| Great design! Unfortunately it doesn't work on my setup.
|
| On Firefox on Linux with SwayWM
|
| None of the hotkeys work except the arrows and hjkl.
|
| Alt-h opens up mozilla's help menu.
|
| Enter opens up the site's help menu. (maybe because that was the
| last thing I clicked on?)
|
| And 'o' does nothing that I can tell.
| jamespwilliams wrote:
| 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.
| albert_e wrote:
| Kudos! This feels like something I have been sorely missing
| without knowing the words to express it. THANK YOU!
| stephencoyner wrote:
| Very cool! Nice work.
|
| One thing I noticed on mobile is that I try to tap on the up and
| down arrows quickly to search between comments, which is often
| misinterpreted as a double tap in the browser and it zooms in.
| qorrect wrote:
| I love it. Now put it in Emacs and we have a forever client.
| picardo wrote:
| Some of the comments in here don't show up on Haxplore until much
| later. It looks like the API response is being cached... which
| gives me a pause because navigating the comments is the best part
| of Haxplore interface.
| junon wrote:
| Nit: Alt+H should also close the overlay as well.
| pabue wrote:
| Makes sense, gonna add that. Thanks.
| pwdisswordfish8 wrote:
| Nice as a proof of concept, but it renders one's browser history
| useless, and Ctrl+F is mostly broken as well.
|
| Recommend taking an additive approach--to _enhance_ navigability
| with new methods, not throw out the stuff that already works (and
| works well) as a consequence of reasoning that this is A New
| Thing and New Things are supposed to _replace_ what already
| exists. Casualties here include stuff like clickable hot zones
| for navigation if in the given moment one 's hands can provide
| higher bandwidth that way for a desired action, operating on e.g.
| a link by context menu e.g. to copy it, mouse scrollability, etc.
| Unlike the poorly reasoned bickering below, it does not follow
| that these interaction concepts are at odds with one another.
| Keyboard and mouse accessibility are not mutually exclusive.
| message wrote:
| Love it! Great work <3
| k__ wrote:
| press delete to hide, and I'm sold.
| pabue wrote:
| That's a pretty cool idea. I'm gonna see what I can do. Thank
| you!
| rafaelturk wrote:
| I love this! Amazing..
| pabue wrote:
| Thank you so much!
| KrishnaAnaril wrote:
| 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.
| specialist wrote:
| Hot damn. Haxplore is cool.
|
| This is kinda how I imagine all my clients should work. HN,
| feedly & NetNewsWire, Overcast & Podcast.app, Music.app.
|
| It's like a synthesis of file explorers and media consumption.
|
| Bravo.
|
| (I've got a bunch of other UX notions for power users.)
| pabue wrote:
| Damn, thank you!
|
| Let's see if some of them get inspired. ;)
| fouric wrote:
| I would extend "file browser" to be the more general "tree
| navigation" - for instance, Miller Columns[1] (which I believe
| is an accurate characterization of Haxplore's interface) are
| used in the Pharo environment[2] to navigate objects.
|
| In general, though, I agree with you - I think that most of the
| media tools that we use today could benefit from Miller Columns
| and a keyboard-driven design....
|
| I'm interested in talking about UI affordances for power users
| - would you be interested? If so, drop me an email (you don't
| have your email in your HN profile, and in-thread discussion
| isn't a good use of HN space).
|
| [1] https://en.wikipedia.org/wiki/Miller_columns [2]
| https://pharo.org/features.html
| cyberjunkie wrote:
| I love this. Every feed and comment based service should use
| this.
| pabue wrote:
| Wow, thank you!
| jobsort wrote:
| Is there a specific library or package folks use to enable
| hotkeys on a page, or is it commonly done via vanilla JS?
| plibither8 wrote:
| This is really nice OP, love it!
|
| Reminds me of my own Chrome extension, Refined Hacker News [1],
| with almost identical keybindings built into the HN interface.
| Neat coincidence :)
|
| [1]: https://github.com/plibither8/refined-hacker-news#on-
| items-a...
| rcarmo wrote:
| Nice, but I would like to have a mix between this,
| https://hackerweb.app, and gmail. For instance, I keep hitting
| "?" for help and would love to have consistent navigation down to
| the content level.
| yyyk wrote:
| I get "Error: No available storage method found." in console on
| Firefox-esr in incognito mode.
| asow92 wrote:
| Like the keyboard shortcuts, and miss the old design. Would love
| these shortcuts with the old design; if it ain't broke, go fly a
| kite and be with your kids instead.
| hidden-spyder wrote:
| The Refined HackerNews browser extension gets you pretty close
| to those keyboard shortcuts without changing the design.
| throwoutway wrote:
| Bookmarked. I hope you continue working on it! The biggest hurdle
| for me would be to remember to go here instead of
| news.ycombinator.com though
| pwdisswordfish8 wrote:
| In your HN profile settings, change the top bar color (to
| something jarring/habit-breaking), as a reminder the next time
| you land here instead of there.
| pabue wrote:
| I will definitely continue working on this. It's great to hear
| that people actually enjoy using it.
|
| I actually moved it to a separate domain, because I don"t think
| people will remember haxplore.pabue.co when they think about
| HN.
|
| You can now find it here: https://haxplore.com
| cvs268 wrote:
| Nice App.
|
| I was trying to create some web-UI like this to read my own dump
| of bookmarks/notes on various devices.
|
| What language/frameworks did you use for the web UI?
|
| Is the source available somewhere gitlab/github?
| pabue wrote:
| Thank you.
|
| I'm using Vue 2 and Javascript, because I actually started this
| project a while ago. I will probably upgrade it to Vue 3 and
| Typescript soon. FOr the styling I'm using Tailwindcss.
|
| It's currently not open source but it will be as soon as I fix
| up some of the mess. It went though quite a lot of changes and
| that's very visible in the code ;)
| prohobo wrote:
| _This_ is design. It 's great, works well and does exactly what
| you'd want it to.
|
| The one issue I see (as others have mentioned) is that it's
| difficult to orient yourself because the app only allows focusing
| on one thing at a time.
| turtlebits wrote:
| Very cool! I think you should leave scrolling alone, the
| selection animation is too fast to read all the stories and
| comments as a list. Acting like a mobile OS picker is annoying.
|
| Also nitpick, Alt-H is not an easy key to hit on mac, why not
| just '?'
| shpongled wrote:
| I love it. I would kill for one for reddit too.
| asdff wrote:
| rtv is an old standard tool that behaves similarly imo. I don't
| think its under active development anymore but it still works
| (i'm sure theres a fork or a similar reddit cli under active
| development these days)
| Fraaaank wrote:
| Have you ever tried https://redditenhancementsuite.com/ ?
| TimMeade wrote:
| I like it. It's strangely refreshing! I do agree the colors are a
| little odd. Might be the strangely part! :-)
| pabue wrote:
| 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.
| nbzso wrote:
| Nice. I use vimium-firefox as a default and it is not working.
| Focusing on one comment at the time is changing the adequate
| contextual dynamic of relational scanning. All of this only
| highlights the problem with HN interface. It is time for slight
| update addressing some basics. - font size - monochromatic theme
| - dark mode * aside from this "Do not touch anything":)
|
| P.S. As a default workaround for HN design issues I use lynx with
| vim bindings. This gives me font clarity and minimalistic
| interface.
| NoGravitas wrote:
| With vimium, you probably need to use 'insert mode' with this
| site.
| nbzso wrote:
| Thanks. It is working.
| fouric wrote:
| This is a really interesting project.
|
| It's also incomplete - but, in fairness, building a HN client
| that most people would consider "complete" is a massive
| undertaking (HN login, themes, customizable keyboard shortcuts,
| mouse support, pre-fetching, "read" status markers).
|
| Instead, here's some feedback about the interesting/different
| parts of the design:
|
| 1. Having WASD, HJKL, _and_ arrow-key navigation is nice - most
| tools commit to exactly one of those three.
|
| 2. I believe that not blurring the leftward (parent) column would
| be better than giving a toggle-able parent comment in the current
| column.
|
| 3. The keyboard shortcut + "Help" button in the corner is great -
| I regularly forget what bindings are available for a new tool
| that I'm in the first few minutes of using, and then often get
| bored and leave.
|
| 4. Placing the comment content all the way at the top of the box
| slightly encourages focus on that content, which is good - HN
| puts the username and posting age at the top instead, which is a
| distraction, and makes it slightly easier to think about _users_
| instead of _content_.
|
| 5. Lack of pagination is great - no more artificial second-page
| barrier.
|
| 6. You could use more of the screen space - for me, about a third
| is just empty, even when I zoom.
|
| Less interesting stuff: there's some visual rendering bugs of
| italics and the "M" menu isn't keyboard-navigable (this isn't
| meant to be a feature request; I know you're focused on making
| the site keyboard-driven). Congrats on making a relatively
| resource-efficient _and_ visual-space-efficient web app!
| gus_massa wrote:
| 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_ ".
| pabue wrote:
| 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.
| gus_massa wrote:
| As I said, I like to use the mouse. Just make everything
| clickable :) .
| tartuffe78 wrote:
| It would be nice if there were a way for it to "remember" where I
| left off, or filter stories I've already scrolled past out of the
| list when I come back.
| pabue wrote:
| That's a pretty cool idea. I'm gonna look into that. Thanks!
| cheschire wrote:
| Might be tough to implement with the display order changing.
| You'd need to find some way to hide or subdue via ID. But
| even then you still can't leap down without looking for
| unread IDs. Seems like a tough one.
| mtmail wrote:
| Can you add the URL to https://github.com/cheeaun/awesome-hacker-
| news ?
| hidden-spyder wrote:
| Off topic, but where did you get the idea for the design? I love
| it! Not something I get to see regularly.
| umvi wrote:
| This was surprisingly pleasant to use. Such intuitive controls
| and sane default behaviors. Usually HN clones are a dime a dozen,
| but this one is a cut above for sure.
|
| The only thing keeping me from using this full time is the
| information density. On normal HN I see the top 30 links all at
| once. On this one I only see the top 11 links before I have to
| scroll. I think a "high info density mode" where I could see the
| top 30 links (or more) would be nice.
| pabue wrote:
| Wow, that's so nice to hear. Thank you!
|
| That's actually a great idea. If you say "high density", do you
| mean just less whitespace/spacing or should stuff like the
| upvotes, author and date be completely removed from the initial
| element?
| umvi wrote:
| On vanilla HN, a story is roughly 30 pixels in height with 5
| pixels of whitespace between stories:
| PostgreSQL 14 (postgresql.org) [20px tall] 399 points
| by jkatz05 2 hours ago [10px tall] [5px spacer]
|
| On Haxplore, a story is roughly 75 pixels tall with 32 pixels
| of spacing.
|
| If you decide to implement a high density mode (I would make
| sure other users beside me want this before doing that work),
| the primary concern IMO is just cramming more stories onto
| the page so users can scan down the page to read more story
| headlines without scrolling.
|
| That could be achieved many ways, but if it were me I would
| probably do a combo of reducing whitespace, reducing font
| size, and removing/consolidating story info (i.e. instead of
| URL having it's own line, move a truncated version of URL
| next to story title like vanilla HN does)
| laumars wrote:
| > _If you decide to implement a high density mode (I would
| make sure other users beside me want this before doing that
| work),_
|
| That's a refreshingly humble request. So often in FOSS I
| see people demanding features, even being downright
| critical at times. It's really nice seeing someone suggest
| their feature request might not be popular is rare.
|
| Thank you for restoring my faith in humanity :)
| sz4kerto wrote:
| 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?
| pabue wrote:
| 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.
| asdff wrote:
| I can't open comments on firefox. hitting O does nothing. Opening
| new links also opens them in a popup window rather than a new
| tab, so firefox blocks those by default too.
|
| Overall its nice to use a keyboard but the information density is
| so poor and the site isn't as performant as news.ycombinator.com
| so I won't be making a switch, and I can't comment on how it
| renders comments since it doesn't open comment sections in
| firefox at least.
|
| I've been on the hunt for a HN TUI client or some other way to
| make threads play nicely with a text based browser. That would
| really help with my newsboat based internet consumption if I
| didn't have to open a browser to read comment threads. I have
| gotten close, but with all the text based browsers I've tried,
| they all don't indent comments correctly in threads which makes
| it not very useful.
| muhammadusman wrote:
| I'm loving it, it's so fast!
| Invictus0 wrote:
| I'd love if:
|
| * the site marked when I had already clicked a link * the site
| respected URLs so I can easily share links * I can read older HN
| links in your interface
| flanbiscuit wrote:
| I love the keyboard navigation.
|
| Speaking of, on FF when I go to the Hacker News home page and I
| tab navigate, the only thing it can tab to is the search input at
| the bottom. Does anyone else have issues or is it just me?
| SubiculumCode wrote:
| Why a client when the native HN interface is close to perfection?
| ww520 wrote:
| This looks excellent especially for keyboard navigation. May I
| give a suggestion? Add support for PgUp & PgDown to skip couple
| items, both in the post list view and the comment list view.
| dkatz23238 wrote:
| Wow this is really cool and well designed. Sorry for this simple
| question but what did you use to get the nice sliding like
| animation? Is that intentional or just a result of updating the
| currently selected article?
| pabue wrote:
| Thank you very much!
|
| Good question. The content part is actually moved left and
| right using CSS transforms. The sliding animation is just a
| result of adding a transition for this property.
|
| Hope this helps. Otherwise just ask ;)
| BatteryMountain wrote:
| Well done, works perfectly on Firefox 92 on Fedora 34. The smooth
| animations & responsiveness to key-presses are spot on! Can we
| please have Dark Mode?
| blokeley wrote:
| Yes, install Dark Reader https://darkreader.org/
| BatteryMountain wrote:
| Can confirm, plays well with darkreader.
| bovermyer wrote:
| I adore this except for one thing - the infinite scroll.
|
| If you added paging, it'd be perfect.
| pabue wrote:
| Thank you.
|
| Paging is something I actually wanted to add at the beginning
| but then I tought it wouldn't be necessary for an experiment
| like that. I'm also not quite sure how it would look or work ui
| wise.
| [deleted]
| danschumann wrote:
| Why doesn't the konami code work?
| ktzar wrote:
| I'd just ask for a dark theme based on the browser's preferences.
| pabue wrote:
| Definitely gonna add an optional dark mode soon!
| sillysaurusx wrote:
| Wow, I just came from your interface to this comment. So I
| guess I'll reply here. What a trip.
|
| +1 for dark mode. But also, would you add a shortcut for the
| left hand for opening comments? I lost my right arm in a
| tractor accident, and pressing O is a bit annoying.
|
| Just kidding, but I do like the idea of R to reply.
| pabue wrote:
| 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
| Mooty wrote:
| 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.
| kimusan wrote:
| I like the design - too bad that HN does not allow for you to
| add comment support. That would make it perfect
| exikyut wrote:
| 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.
| vxNsr wrote:
| My understanding is it's an attempt at spam reduction. By
| not providing an API for commenting they make it harder for
| spammers.
| Shared404 wrote:
| 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.
| deaddodo wrote:
| I would use the new reddit interface specifically _if_
| they re-enabled the old comment experience. The current
| one is terrible.
| avaku wrote:
| Reading this post on Haxplore itself is even better :)
| joeframbach wrote:
| > 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...
| pabue wrote:
| 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.
| mrmattyboy wrote:
| 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
| benhurmarcel wrote:
| 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.
| IncRnd wrote:
| 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!
| pabue wrote:
| Thank you! That's totally fine.
| exikyut wrote:
| 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.
| ydant wrote:
| 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.
| ostenning wrote:
| Really nice, bravo
| pabue wrote:
| Thank you!
| dionian wrote:
| Cool UI. nice job
| albert_e wrote:
| 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
| pabue wrote:
| 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.
| gwbas1c wrote:
| 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?
| filoleg wrote:
| 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.
| behnamoh wrote:
| Reading the comments on Haxplore using Haxplore is so meta:
|
| https://imgur.com/a/v4tbfqP
| pabue wrote:
| 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.
| hoofedear wrote:
| Can't wait to try this when I get home!
| behnamoh wrote:
| It's very sleek, responsive, and friendly! Kudos! Please don't
| let it die like many other Show HNs:
|
| https://news.ycombinator.com/item?id=28682173
| davidcollantes wrote:
| How do I read the comments?
| pabue wrote:
| You have to use your arrow keys, WASD or HJKL to navigate
| through the comments.
| Noumenon72 wrote:
| 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.
| qorrect wrote:
| It's built for people who use the keyboard, your mouse
| will not help you here.
| bennyp101 wrote:
| 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
| pabue wrote:
| 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!
| kbenson wrote:
| > 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).
| mkl wrote:
| 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).
| bennyp101 wrote:
| 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
| ghengeveld wrote:
| If you switch to ? keep in mind that some keyboard layouts
| (e.g. Hungarian) require a modifier key to type this
| character.
| yurishimo wrote:
| It requires one for a US layout too (shift) if you match
| on the actual `?` character and not `/`
| egeozcan wrote:
| 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!
| pabue wrote:
| Thank you very much! Got great feedback so far, so I'm
| definitely gonna work on it and try to improve the
| experience.
| qorrect wrote:
| I love the keyboard interface please don't listen to anyone
| trying to change that part :).
| pabue wrote:
| Don't worry, I will definitely not change anything about
| the keyboard control part. You have my word! ;)
| user207 wrote:
| brilliant work, please do twitter next
|
| very addicting
| PKop wrote:
| Twitter already has keyboard navigation
| pabue wrote:
| 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.
| zabil wrote:
| Great work, especially the comment navigation. I find it much
| easier to view the comment threads and scan top level comments.
| snsr wrote:
| The web page doesn't scroll.
| pabue wrote:
| This is intentional. You have to use your arrow keys, WASD or
| HJKL to navigate.
| [deleted]
| john-doe wrote:
| Mixed with keyboard tabbing, it gets really confusing.
| andrewl-hn wrote:
| 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
| pabue wrote:
| You can actually press spacebar to open a comment inside
| a modal where you can scroll.
|
| Wow, thank you very much! :D
| dstroot wrote:
| Vue + Tailwindcss?
| crhutchins wrote:
| This looks great! The animations are smooth, and the details seem
| to load fast. How about you try a specific subreddit?
| pabue wrote:
| Thank you!
|
| I was actually thinking about adding support for reddit. Might
| add that in the future.
| thih9 wrote:
| I'm impressed that it works on mobile too. I guess best ux is
| with a keyboard but still it's nice to see what it's about.
| pabue wrote:
| In the beginning it was so bad on mobile that it was actually
| completely unusable. I think it's still not very good but at
| least it's somewhat usable. A keyboard is definitely the
| recommended input device. ;)
| eyelidlessness wrote:
| I immediately got that keyboard is the intended usage, but
| also was impressed it works on mobile at all. You obviously
| took care to consider it, and I wouldn't have blamed you if
| you hadn't. Good job!
| mlukaszek wrote:
| Like it! Some suggestions to consider:
|
| - I'm missing a "jump back up" shortcut, something I'd recommend
| using capital "G" for, like in Vim.
|
| - It seems it hits some hardcoded limit for paging? i.e. it does
| not allow me to open more stories once I reach the "bottom" one.
|
| - Two things I'm used to that exist in the Android app I'm using:
| * stories are numbered, so I see how far from the top I am. It's
| a dimmed down grey number, but it's there and I like it. *
| depending on the number of comments, an article can be marked as
| hot with a "fire" emoji. I got used to that to immediately spot
| things which are trending.
|
| Overall, well done! I am definitely subscribing, and I'll test if
| I can switch to it on Android.
|
| (edit: typos)
| C19is20 wrote:
| Agreed on android: materialistic?
| daveungerer wrote:
| It simply shows a loading animation for me. It raises "Error: No
| available storage method found" on line 2718 of localforage.js.
| This is Firefox 92 on Ubuntu 24.04.3. It works in Chrome, but I
| don't use it as my main browser. Spent a minute on it just to see
| the vim-style navigation, pretty cool. Hope the bug report helps!
| pabue wrote:
| Oh, that should not happen. Thanks for the report, I'm gonna
| look into it.
| alexvoda wrote:
| Is it possible to add quick way to add a bookmark for a story or
| comment and a read leater stack?
| soheil wrote:
| Why are you blurring the previous row? Why are you disabling
| scrolling? These are hostile to the user.
| capableweb wrote:
| 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.
| soheil wrote:
| 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.
| vonadz wrote:
| 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.
| pritambarhate wrote:
| 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.
| vonadz wrote:
| It appears the whole point of this site is the keyboard
| navigation. If you don't like it, just use Hacker News.
| pritambarhate wrote:
| 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.
| capableweb wrote:
| > 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?
| laumars wrote:
| 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
| soheil wrote:
| > 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?
| bennyp101 wrote:
| 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.
| drKarl wrote:
| Cool idea, but not very Mobile friendly
| pabue wrote:
| 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.
| stavros wrote:
| Deciding that it's not meant for mobile is a perfectly
| acceptable position to take, in my opinion.
| egeozcan wrote:
| 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.
| croddin wrote:
| Great site! On iPhone, if you are tapping a button on the bottom
| rapidly, (like if you just double tap the down button) it
| triggers the page to zoom in. It looks like there is an easy css
| fix for that. https://stackoverflow.com/questions/46167604/ios-
| html-disabl...
| pabue wrote:
| Thank you! For the compliment, the bug report and the fix. :D
| cacois wrote:
| Phenomenal idea! Really great approach to forum UX. I sincerely
| hope you keep working on this, I'd love to see how it evolves.
| pabue wrote:
| Wow, thanks!
|
| Don't worry, I will definitely keep working on it. With all
| that great feedback I don't think I have any other choice. ;)
| JohnL4 wrote:
| Content-free comment, but WOW this is really slick!
| qwertox wrote:
| 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).
| didip wrote:
| Nice. What's the tech stack?
| pabue wrote:
| Currently it's Vue 2, JS and Tailwindcss. However I will
| upgrade it to Vue 3 and Typescript soon.
| yoavm wrote:
| 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... :)
| Invictus0 wrote:
| I love this but alt + H doesn't work on Firefox
| pabue wrote:
| Noted, thank you!
| jack335 wrote:
| That is really cool!
| pabue wrote:
| Thank you so much!
| porterbeats wrote:
| This is fantastic! Thank you for making this.
| WithinReason wrote:
| I particularly like the response time (low latency). It's
| underappreciated in web design.
| pabue wrote:
| That was definitely an important aspect while building it. I'm
| also glad the HN api is so damn fast.
| OrvalWintermute wrote:
| Really love the interface and how high performance it is.
|
| Very well thought out!
|
| I've been browsing through HN using Haxplore and I can really
| navigate fast! This is kinda like vi
| gnull wrote:
| Being unable to see the whole (sub-)tree while reading the
| comments is a major disadvantage for me so far. If you read a
| thread that goes like a dialog with each new reply being nested
| under the previous one, this web app requires a key press to see
| each new reply -- you never see them simultaneously.
|
| But this app is an interesting take. I'm also not happy with
| unnecessarily mouse-driven interfaces
| smallerfish wrote:
| Can you please avoid blurring the prior column (or at least the
| comment you came from)? It's useful to see context that way.
|
| Otherwise I think it's really good. Reddit should have aspired to
| something this well thought out.
|
| (I'd also like page up / page down.)
| have_faith wrote:
| Seconding page up/down, first thing I tried.
|
| Probably not to everyone's taste but I'd prefer for the active
| news item to be in the center of the screen and not at the top.
| I keep scanning down the page with my eyes and then realising I
| need to press down 20 times to get to where I scanned, I
| probably wouldn't scan so far ahead if it was vertically
| centered but also the page up/down would alleviate some of
| this.
|
| Otherwise very refreshing and looking forward to see it
| iterated.
| pabue wrote:
| You can see the current parent comment on top in the white box
| as soon as you navigate 'into' a comment. It is truncated by
| default but you can toggle it with the P key.
|
| Thank you!
|
| Oh and page up / down is noted and will be added soon.
| goodpoint wrote:
| Good point. On a large screen most of the space is wasted: a
| blurred column on the left and empty space on the right.
|
| This accounts for 2/3 of the of the space. Please use all of it
| :)
| pabue wrote:
| At some point during development you could actually see all
| the columns clearly and most of the screen space was used but
| it was very disorienting, at least for me. That's why I
| removed it. But I guess some people think differently, so
| maybe I'm gonna add an option for that.
| gota wrote:
| Seconding the ask to reduce the space dedicated to the
| previous focus level (left of screen)
| salamander014 wrote:
| I agree. I like the idea of visualizing previous item in some
| way, maybe faded instead? Should give the same effect.
| pabue wrote:
| The previous item (or parent comment) is always visible in
| the white box on top/above the current comment. But it's
| quite easy overlooked because the change from the
| article/link to the comment is not very noticable.
| FailMore wrote:
| Front end bug on mobile. As you down arrow the faded part at the
| top gets smaller and smaller. Chrome on Pixel
| pabue wrote:
| Oh, good catch. Mobile is not really a priority right now, but
| I'm gonna take a look at it later.
| bilekas wrote:
| I absolutely love this. Super smooth, can it be applied to other
| feeds also ?
| itsbits wrote:
| This is really really cool. I am gonna use it more.
|
| Couple of suggestions thgh. 1) Blurring can be avoided. 3) jump
| to parent story of any level comment via keyboard 2) Is there
| possibility of logging in? so that we can do
| comment/upvote/downvote as well via keyboard.
| agumonkey wrote:
| I love these ergonomics. Thanks for keyboard lovers like me.
| jb1991 wrote:
| Cool, but I find just scrolling the page with the MBP trackpad to
| be much easier for getting a feel for the discussion.
| kvathupo wrote:
| This is everything I wish the web would move towards: quick,
| minimalistic design that doesn't hinder the user. I think Reddit
| is the worst offender in this regard with its slow, bloated
| redesign that stops my viewing experience.
|
| There is also something to be said of the inherent, tactile
| satisfaction derived from a button-press, as opposed to a mouse-
| click.
| picardo wrote:
| Nice work. Minor issue, but when I open the Menu with M, the
| focus should be in the dropdown menu, so I can navigate it with
| the arrow up and down. Otherwise, works great!
| pabue wrote:
| Thanks! You're right, that part is a bit weird. I added that in
| the last moment and didn't really spend much time on making in
| good.
| picardo wrote:
| A couple of more ideas:
|
| * Some way to go to the top of the page without refreshing
| the page.
|
| * Some way to load new posts asynchronously without
| refreshing the page.
| jack_riminton wrote:
| Really nice, fancy doing a dark mode version?
|
| Also I didn't quite get how I was supposed to see comments
| pabue wrote:
| 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?
| jack_riminton wrote:
| Well, I 'thought' I'd read the the "How to"!
|
| Maybe it needs a small guided tour thing
| pabue wrote:
| 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.
| kuu wrote:
| 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 :)
| pabue wrote:
| 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!
| whage wrote:
| Fantastic job. I love that I can easily read breadth-first.
| dbbljack wrote:
| this seems really great for people who want vim in the...
| actually wait we all have browser extensions already.
| jccalhoun wrote:
| "We're sorry but Haxplore doesn't work properly without
| JavaScript enabled. Please enable it to continue." well that
| certainly is a twist...
| lopis wrote:
| It's a HN client with keyboard navigation. Not sure what you
| expect.
| Arnavion wrote:
| How would they have expected anything when that's all the
| page and the title of the submission say?
| NomadicDaggy wrote:
| Now do Reddit! Please!
| pramodbiligiri wrote:
| 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.
| pabue wrote:
| 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!
| pramodbiligiri wrote:
| 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.
| dicytea wrote:
| `wsad` and `hkjl` navigation doesn't seem to work in the
| modal popout which kind of defeats its purpose.
| Aissen wrote:
| Re: Alt+H ; it's the same for Alt+O on Firefox.
| pabue wrote:
| Thank you! Gonna fix that later.
___________________________________________________________________
(page generated 2021-09-30 23:00 UTC)