Member preview

Hacker News UX Review — July 2018

If you’ve written a line of code in the last decade, it’s pretty likely that you’ve heard of Hacker News. It’s tempting to call it a certainty but there are a lot of outliers in the hacker community so I’ll settle for pretty likely.

The thing that draws me to Hacker News is the raw function and defiant nature of the community as a whole. Few designers would call Hacker News beautiful. Few UXers would say the interface is an intuitive marvel. But hackers and engineers don’t seem to care. They’ve been coming back to the watering hole since 2007.

Here are a few improvements I believe Hacker News could make without losing their identity in a complete redesign.


Full-width comments aren’t very readable

I’m not going to invest the time to read comments with small text on lines 1200px wide. The perceived work required to gather that information just doesn’t seem worth it. Drop the line width to ~700px and suddenly it doesn’t feel so daunting.

Fixing this is literally 1 line of CSS:
.comment-tree { max-width: 700px; }

700px max-width comments

Add a little padding

Padding is an easy way to add a visual delineation between elements on a screen. This allows the user to isolate and think about each piece independently rather than taking it all in at once which can be overwhelming.

Many modern web apps go crazy with padding which is usually a good thing. But I feel like Hacker News should maintain high information density which is part of their identity.

Here is an example of what the navigation would look like with an added 5px of padding.

No padding
Extra 5px

Remove show/ask HN from link titles

Prepending Show HN or Ask HN is a nice hack to categorize links. But reading a whole list of titles with the same prefix just adds a bit of unnecessary cognitive overhead. Once a link gets categorized into a section, just prune the prefix from the title to make links more scannable.

Links without the prefix

Categorization?

The randomness of finding an article about a new programming language next to a rant about AI next to an IoT hack is part of the appeal of HN. But even a modest level of categorization would make HN so much more valuable to me personally.

Maybe when you submit an article you have the option to add 1 tag. Then each tag could have its own stream of links if you navigate to news/vuejs. Even better would be favicon notifications of new submissions for a tag. Maybe if you navigate to a tag, the favicon is initially grey. If a new submission comes in, it automatically gets added to the stream and the favicon turns orange.

If favicon notifications were available, I’d constantly reserve 1–2 browser tabs for HN tags I’m currently interested in.

As an alternative, Algolia has a simple app to search HN.


Organize jobs by city

It’s a lot of work to scan through a huge list of jobs, especially if you’re interested in a city other than SF. Having a job page per city would be a nice starting point. It would also be great if you could subscribe to a city and receive a weekly email of openings in your city.


Sort source screen by vote popularity

If you click on a url next to a link it takes you to a screen where you can see all submissions sorted by latest to oldest. Here is an example using Medium.com as the source. The list of submissions is flooded with 1 vote links. It would be much more interesting to see the top Medium stories.


API improvements

The API isn’t bad. The endpoints are straight forward and you don’t have to jump through crazy authentication hoops. But there are a few improvements I’d love to see:

  1. Webhook to subscribe to a batch of users
    To keep auth simple, requests could include 2 parameters 1) a comma separated list of handles and 2) a url for HN to ping if anyone in the group posts anything. Subscriptions could expire after 1 month to conserve resources.
  2. Webhook to subscribe to submissions containing a keyword
    Very similar to #1 but it would allow API consumers to watch topics instead of users.

Expand favorites functionality

The current favorites screen allows you to see stories any given user has favorited. Here is an example showing stories the current top ranked user has favorited. To make this better, the id param could allow for a comma separated list of users and an additional min_votes param could filter out stories below a threshold.

To make this functionality discoverable, there could be a link on the leaderboard titled Top 10 favorites.


Hide replies to comments by default

When reading a submission’s comments, threads add a ton of noise. I believe only the top level comments should be shown by default. This makes discussions much more scannable. If something jumps out, expand the thread and contribute.

Shows comments with threads hidden by default

Recycled submissions screen

A lot of quality submissions cycle through the new screen so fast they never get a chance to earn a vote. A recycle screen could just show random submissions with no votes. If a user upvotes a submission on the recycle screen, it gets promoted to the new screen with a refreshed timestamp.


That’s it for now. Check out my Twitter UX Review or follow me and stay tuned for more reviews. 🙌