This doesn't look like a print newspaper. Print newspapers are much denser (in general) and have different headline sizes to emphasize the editor's choice of stories. This looks like a corporate blog home page or something. Some people will like this presentation; I'm pretty happy with HN as it is. But congratulations on shipping!
Thanks for the feedback! Print newspaper's have curation, which this lacks. I guess the main thing it takes from newspapers is the image and blurb that help give you a preview of the story.
There is a form of curation on HN and "editorial judgment" on HN and that's in the points a post has. A closer approximation of a newspaper would be possible by looking at the points of a post and maybe comparing that to other posts and then sizing headlines appropriately based on how "important" the HN community sees a given story.
I kept it running for 5 or 10 years but eventually let it die.
edit: I'm not hating on OP btw. their version has pics, which mine doesn't. just agreeing that I believe the visual hierarchy inherent to newspaper title design is an important benefit of the format.
> the visual hierarchy inherent to newspaper title design is an important benefit of the format
Agreed. This is also why old-school print design product catalogs often had superior presentation compared to today's web UIs for browsing hierarchically organized products. Everything is given the same visual weight and is formatted the same way.
Anyway, improving on what you did with the tooling that's easily available in 2024 but wasn't in 2009 seems like a fun challenge.
yeah, digging up that screenshot (and the repo) really made me realize how primitive this solution was. it was also a very basic implementation of the whole headline sizes concept.
there was an app called Flipboard at the time which did something similar, but for different news sources, although its model of interactivity was a bit more gimmicky than the endless scroll. (which, for all its faults, is really simple and easy to use.)
Papers only work because they know exactly what the view portal is and can design the layout relative to that. Unless you have an a3 sized screen this will not work very well online.
You can achieve some of the proportions with vw and vh units inside the article and column containers. Much of the effect comes from nicely laid out columns more than how many columns wide is your digital broadsheet, so the aesthetic scales okay on smaller screens. On mobile screens it’s just nice-looking individual columns.
A few years ago, a similar project was posted on HN that I thought was really cool too - E Ink smart screen puts a newspaper on your wall (https://news.ycombinator.com/item?id=22831323).
I made this to experiment with embeddings and explore how different ways of displaying information affect your perception.
It gets the top 100 stories, sends their html to GPT-4 to extract the main content (this was not producing good enough results with html parsing) and then gets an embedding using the title and content.
Likes/dislikes are stored in local storage and compared against all stories using cosine similarity to find the most relevant stories.
It costs about $10/day to run. I was thinking of offering additional value for a small subscription. Maybe more pages of the newspaper, full story content/comments, a weekly digest or ePub export or something?
I think some of the highest value from HN comes from the comments, and it's much harder to find the "best" ones, since they might be in threads you might not have otherwise read.
Not sure if it's a "premium feature" so to speak, but would be very cool to extend this to comments generally.
Definitely, comments are usually better than the article. I thought of a 'Letters to the Editors' section that shows top comments (https://news.ycombinator.com/bestcomments) and references the parent story, but it might not be as useful without the context.
Maybe 'See Comments' here could load the comments on the same page? In a newspaper like style.
> Likes/dislikes are stored in local storage and compared against all stories using cosine similarity to find the most relevant stories.
You're referring to using the embeddings for cosine similarity?
I am doing something similar with stocks. Taking several decades worth of 10-Q statements for a majority of stocks and weighted ETF holdings and using an autoencoder to generate embeddings that I run cosine and euclidean algorithms on via Rust WASM.
Pretty cool. Like how the animated GIFs will play and the type and whitespace balance is pretty solid. Ever seen Paper-HN? A similar idea: https://www.wolfgangfaust.com/project/paper-hn/ - A fun detail that one has is when you mouseover their photos they go to colour.
I liked this for two seconds; then all the pictures loaded in the browser window, and its usefulness to me plummeted. Similar to other commenters, I actually prefer text-only in this context; in particular, the first picture displayed just now was animated, and incredibly distracting.
I would probably use this or at least play with it extensively if not for this "feature." I find that, unlike "real" newspapers, leading images in blog posts and even much larger sites are frequently a net negative (a trend greatly worsened with the advent of AI image generators).
This is pretty cool, it’s nice to have a clean interface that puts more focus on individual posts (as articles here) rather than tons of headlines where I feel I skim over posts a lot more (particularly the post about Jupiter only caught my attention on your site, not the front page).
I’d like if there was some support for customising it without liking and disliking so I could push topics I’m interested in first (e.g. those tagged with emacs). It would also be nice to hide the like and dislike buttons in general as it gives more of a social media feel that the newspaper style UI does well to shake.
Interesting, for me it's a bit the opposite. In the standard view I really read every headline and consider what might be through the click. In this version I skim more in mindless scrolling fashion.
This is excellent! I've been using it all day. I do wish it was a bit denser (similar to Drudge Report), but the product is neat enough as is. Congrats!
I'm getting the an error of "Failed to fetch stories"
The console error is:
(index):464 Error loading stories: TypeError: Failed to construct 'URL': Invalid URL
at (index):482:36
at Array.forEach (<anonymous>)
at NewspaperApp.displayStories ((index):471:25)
at NewspaperApp.loadStories ((index):461:26)
at async NewspaperApp.initialize ((index):418:17)
Can anyone help? I really want to use this product it seems great.
This is very nice! If you
- make it a pwa/web clip
- link to the discussions
- make the images colored again
I’d use it over the regular hacker news ui any day. I know your use case is printing it out, but it’s fantastic for usage on a tablet.
I guess you mean a digital newspaper with a layout inspired by print newspapers. It's definitely not a print newspaper, I know because I tried folding it in half to read on the train, and all that happened was my laptop screen broke.
There was an iOS app from practically a decade ago that did something very similar, but you could customize with RSS feeds, and it would turn it into a traditional looking newspaper.
Sadly, I can't remember the name of it but it was pretty great.
EDIT: Well maybe not, this one seems more like a replacement for ReadLater/GetPocket whereas the one I used was purely based off RSS feeds. I used it on the original iPad 1st gen so it's probably long gone. I give up.
A fun evolution would be to format it into a newspaper format, complete with headlines, front page, and "continue reading on page N", then print it out on large paper, fold it, and mail it to you.
There's probably no money in it, but a physical weekly customized RSS feed highlights newspaper would be neat.
The print stylesheets are also kind of broken. With my printer's default margins, the page becomes an overlapping mess: https://i.imgur.com/lTlFz4l.png
This doesn't look like a print newspaper. Print newspapers are much denser (in general) and have different headline sizes to emphasize the editor's choice of stories. This looks like a corporate blog home page or something. Some people will like this presentation; I'm pretty happy with HN as it is. But congratulations on shipping!
For the rest of the news in a more HN-like format (at least at the top level) you might like https://lite.cnn.com/
https://text.npr.org is also a text only version of npr
I remember using both this and cnn lite 8 years ago quite a bit right around this time, cool to see they’re still going strong.
Also this site works great in text browsers like Lynx.
Lynx wrapped in Docker:
https://github.com/jzombie/docker-lynx
That's a great observation actually! They should've made the design do that automatically based on story ranking
Thanks for the feedback! Print newspaper's have curation, which this lacks. I guess the main thing it takes from newspapers is the image and blurb that help give you a preview of the story.
There is a form of curation on HN and "editorial judgment" on HN and that's in the points a post has. A closer approximation of a newspaper would be possible by looking at the points of a post and maybe comparing that to other posts and then sizing headlines appropriately based on how "important" the HN community sees a given story.
The other form of curation is place on the front page.
That's probably closer to the editors choice in the context of HN.
Yes, I agree. I think I will change the design to have a hierarchy.
this is exactly how my 2009 version (in my previous comment) chose to size and space its headlines
I agree, but I'm biased. I built basically the same app as OP back in 2009 and it had different headline sizes like a newspaper:
https://github.com/gilesbowkett/hacker_newspaper/blob/master...
I kept it running for 5 or 10 years but eventually let it die.
edit: I'm not hating on OP btw. their version has pics, which mine doesn't. just agreeing that I believe the visual hierarchy inherent to newspaper title design is an important benefit of the format.
> the visual hierarchy inherent to newspaper title design is an important benefit of the format
Agreed. This is also why old-school print design product catalogs often had superior presentation compared to today's web UIs for browsing hierarchically organized products. Everything is given the same visual weight and is formatted the same way.
Anyway, improving on what you did with the tooling that's easily available in 2024 but wasn't in 2009 seems like a fun challenge.
yeah, digging up that screenshot (and the repo) really made me realize how primitive this solution was. it was also a very basic implementation of the whole headline sizes concept.
there was an app called Flipboard at the time which did something similar, but for different news sources, although its model of interactivity was a bit more gimmicky than the endless scroll. (which, for all its faults, is really simple and easy to use.)
Yours is much better, exactly how I envisioned it to be
are there any good online designs that actually look like a print newspaper, with the features you describe?
I've wanted to take a stab at it because I think it would be "neat" but haven't actually found any good reference implementations.
also seems like with almost everyone on mobile it's just not worth it.
Papers only work because they know exactly what the view portal is and can design the layout relative to that. Unless you have an a3 sized screen this will not work very well online.
You can achieve some of the proportions with vw and vh units inside the article and column containers. Much of the effect comes from nicely laid out columns more than how many columns wide is your digital broadsheet, so the aesthetic scales okay on smaller screens. On mobile screens it’s just nice-looking individual columns.
i think the nytimes landing page does a good job at looking and feeling like an analogue newspaper
Yeah… it’s really just not plausible at all…
Looks super neat! I've had a longtime dream of working on a similar project, but I want to make it "Daily Prophet" styled, inspired by the Harry Potter series - https://harrypotter.fandom.com/wiki/Daily_Prophet?file=Daily.... With gifs and effects :)
A few years ago, a similar project was posted on HN that I thought was really cool too - E Ink smart screen puts a newspaper on your wall (https://news.ycombinator.com/item?id=22831323).
All I get is "Failed to load stories," am I doing something wrong? Is there something I need to configure before things will load?
I just had the same problem and solved it. You have to switch off your adblocker.
Interesting, yup, looks like it was blocked by the network PiHole.
I made this to experiment with embeddings and explore how different ways of displaying information affect your perception.
It gets the top 100 stories, sends their html to GPT-4 to extract the main content (this was not producing good enough results with html parsing) and then gets an embedding using the title and content.
Likes/dislikes are stored in local storage and compared against all stories using cosine similarity to find the most relevant stories.
It costs about $10/day to run. I was thinking of offering additional value for a small subscription. Maybe more pages of the newspaper, full story content/comments, a weekly digest or ePub export or something?
Why would it cost $10 a day?
It should not cost more than a dollar a day.
Take AWS and azure credits and run it for free for years
I think some of the highest value from HN comes from the comments, and it's much harder to find the "best" ones, since they might be in threads you might not have otherwise read.
Not sure if it's a "premium feature" so to speak, but would be very cool to extend this to comments generally.
Definitely, comments are usually better than the article. I thought of a 'Letters to the Editors' section that shows top comments (https://news.ycombinator.com/bestcomments) and references the parent story, but it might not be as useful without the context.
Maybe 'See Comments' here could load the comments on the same page? In a newspaper like style.
> Likes/dislikes are stored in local storage and compared against all stories using cosine similarity to find the most relevant stories.
You're referring to using the embeddings for cosine similarity?
I am doing something similar with stocks. Taking several decades worth of 10-Q statements for a majority of stocks and weighted ETF holdings and using an autoencoder to generate embeddings that I run cosine and euclidean algorithms on via Rust WASM.
Pretty cool. Like how the animated GIFs will play and the type and whitespace balance is pretty solid. Ever seen Paper-HN? A similar idea: https://www.wolfgangfaust.com/project/paper-hn/ - A fun detail that one has is when you mouseover their photos they go to colour.
I liked this for two seconds; then all the pictures loaded in the browser window, and its usefulness to me plummeted. Similar to other commenters, I actually prefer text-only in this context; in particular, the first picture displayed just now was animated, and incredibly distracting.
I would probably use this or at least play with it extensively if not for this "feature." I find that, unlike "real" newspapers, leading images in blog posts and even much larger sites are frequently a net negative (a trend greatly worsened with the advent of AI image generators).
That's fair. How about a toggle to not show images?
I would pay money, $1+ postage to maybe $5 + postage to physically print out tweet streams and other articles and mail them to some old people I know.
I'm thinking specifically of DieWorkwear on twitter, but others too.
This is pretty cool, it’s nice to have a clean interface that puts more focus on individual posts (as articles here) rather than tons of headlines where I feel I skim over posts a lot more (particularly the post about Jupiter only caught my attention on your site, not the front page).
I’d like if there was some support for customising it without liking and disliking so I could push topics I’m interested in first (e.g. those tagged with emacs). It would also be nice to hide the like and dislike buttons in general as it gives more of a social media feel that the newspaper style UI does well to shake.
Interesting, for me it's a bit the opposite. In the standard view I really read every headline and consider what might be through the click. In this version I skim more in mindless scrolling fashion.
Anyone remember "Hacker Monthly"? Years ago it was a monthly PDF with nicely laid out copies of popular articles that had been highly voted on here.
They also printed physical magazines and shipped them out. It was the first time I received a professionally printed copy of something I had authored.
Looks really great, did you document the process or background of the project somewhere? I would love to read the journey!
This is excellent! I've been using it all day. I do wish it was a bit denser (similar to Drudge Report), but the product is neat enough as is. Congrats!
Nice! I recently worked on a chrome extension that personalizes the frontpage based on embeddings.
https://chromewebstore.google.com/detail/hn-explorer/amiaaon...
I'm getting the an error of "Failed to fetch stories"
The console error is: (index):464 Error loading stories: TypeError: Failed to construct 'URL': Invalid URL at (index):482:36 at Array.forEach (<anonymous>) at NewspaperApp.displayStories ((index):471:25) at NewspaperApp.loadStories ((index):461:26) at async NewspaperApp.initialize ((index):418:17)
Can anyone help? I really want to use this product it seems great.
Just fixed my own problem! You have to switch off your adblocker.
This is very nice! If you - make it a pwa/web clip - link to the discussions - make the images colored again I’d use it over the regular hacker news ui any day. I know your use case is printing it out, but it’s fantastic for usage on a tablet.
Good attempt but from the title I thought it would look like an actual print news paper
I guess you mean a digital newspaper with a layout inspired by print newspapers. It's definitely not a print newspaper, I know because I tried folding it in half to read on the train, and all that happened was my laptop screen broke.
For those who prefer scrolling to reading I guess.
Is there a reason you chose not to display the comment count?
It’s funny how frequently people try to reinvent the wheel re: how this site is laid out. It’s the best part about it!
There was an iOS app from practically a decade ago that did something very similar, but you could customize with RSS feeds, and it would turn it into a traditional looking newspaper.
Sadly, I can't remember the name of it but it was pretty great.
I remember this app as well; “Flipreader” comes to mind but yields no Google results.
It was the peak of RSS for me, beautiful UX, customizable, all the posts in sequential order if I wanted instead of algorithms…
I remember it because useless when web publishers realized they were losing ad views to apps like these and all the posts became previews with links.
I believe you are thinking of Flipboard (still around, but a bit different nowadays).
I think you are referring to Flipboard, it is still in the AppStore
Can't edit my post but it wasn't Flipboard.
Found it - it was Instapaper!
https://imgur.com/a/iFBme4f
EDIT: Well maybe not, this one seems more like a replacement for ReadLater/GetPocket whereas the one I used was purely based off RSS feeds. I used it on the original iPad 1st gen so it's probably long gone. I give up.
A fun evolution would be to format it into a newspaper format, complete with headlines, front page, and "continue reading on page N", then print it out on large paper, fold it, and mail it to you.
There's probably no money in it, but a physical weekly customized RSS feed highlights newspaper would be neat.
Flipboard. https://about.flipboard.com/
[dead]
Very cool! Looks like it has an XSS vector though :P
https://i.imgur.com/5bbKiFc.png
The print stylesheets are also kind of broken. With my printer's default margins, the page becomes an overlapping mess: https://i.imgur.com/lTlFz4l.png
And even with margins turned off, stories are split "across" pages in a way that makes them useless for printing: https://i.imgur.com/SvmTGa8.png Need to pay more attention to your "break-inside" properties: https://developer.mozilla.org/en-US/docs/Web/CSS/break-insid... (and switch from using JS-generated absolute styles to using a CSS column layout or masonry grid)
Thank you! I missed that in my sleepiness. Should be fixed now.
This is super cool
Amazing..and you're telling me you made this with less than 600 programmers?
Sadly the media="print" view does not provide usable output.
Very cool, seems like it updates on a delay though, which will probably kill usability.
This post is not even on it.
It updates every hour. This post is on it now!
On brand with newspapers.
The images in the website are in grayscale.
I thought it would fit the grayscale of newspapers. I can add an option to show them in color.
Looks like the NYT
Love this project! I would love to collab, please consider open-sourcing this project, or let me know if I can contribute in some way
Yeah would love to play with a couple PRs on this
This is nice, but I prefer the simpler style of hckrnews.com