I'm hoping that this makes HN's front page just to see the fun recursion of the site displaying a screenshot of itself. (And I do appreciate the experiment in user experience design, too.)
The visual memories of childhood can be powerful. For some reason -- I know it's a stretch! -- this reminds me of the Froebel blocks that Frank Lloyd Wright played with as a kid:
Wright, who died in 1959, often spoke and wrote eloquently about the influence of the blocks in his understanding of design. In his 1957 book, ''A Testament,'' he wrote: ''I sat at the little kindergarten table top and played with the cube, the sphere and the triangle. I soon became susceptible to constructive pattern evolving in everything I saw. I learned to see this way, and when I did, I did not care to draw casual incidentals of nature. I wanted to design.''
Some architecture observers have noted the similarities between the block structures Froebel designed and the eminent architect's buildings.
This is awesome, but I would really appreciate if it would use all of my screen estate (i am using a 1920x1200 screen) instead of using only three columns.
What browser are you using? The site seems to be responsive in Chrome (1440 width shows four columns, 1920 shows five, not sure where the breakpoints are exactly).
EDIT: It's using a flexbox grid layout so it shouldn't actually need any breakpoints. Maybe the layout changed since you checked it or your browser is triggering a fallback?
and the URL domain, I thought "Shop Walmart and more of your favorite stores, faster" was an inserted ad till I noticed it was on blog.google on the real front page.
Several people here are asking how you automatically screenshot websites. Look up PhantomJS -- you don't need to use someone else's API when you can make your own! =)
PhantomJS is kind of deprecated (and the maintainer said he's stepping down [1]) since Chrome finally got a headless mode several weeks ago. There's even a tool from Chrome team [2] that allows making screenshots from nodejs:
I definitely clicked a couple more just by looking at the screenshots than reading the plain text index. I wonder if there's psychological lure in graphics. Thank you!
We have done something similar for the hn search at Algolia but flagged it under style -> experimental in the settings panel. It's not a grid layout, but more a refresher to the current design. https://hn.algolia.com
4chan style makes it easier to see which comments are new. However it does so at the cost of separation of subtopics. IMO 4chan style is not a good fit for HN because we often have many different conversations going on at the same time within the discussion of a story. If HN switched to 4chan style comments I believe that it would dramatically change the nature of the discourse for the worse.
I wouldn't like 0 threading, but I strongly dislike the depth of threading on HN for some reason, I find it hard to follow as it gets progressively narrower.
The 4chan post referencing (>>>/g/565645674567/) which allows you to reference any post from any board and it embeds itself on hover is a very underused useful feature I believe.
A huge part of the appeal of the standard HN page for me is the simple, straightforward, sensible headline without the discration of images. The title guidelines and the insistence on adhering to them are a big plus in this regard.
I really like that HN is so low bandwidth. I often check the fp on shitty mobile connection and while I can't read most stories until my rss reader catches up, at least I know what people are talking about.
I enjoy this as well. Plus the raw site is faster than any app reader I've tried before and while I have somewhat fat fingers I typically don't have too much of a problem clicking links on the mobile site.
Thanks for posting this - I quite enjoy browsing hacker news using thumbnails from mobile after trying it. On my laptop, I think I prefer the original homepage. I like to check the news once a day, but some days I'm short of time and use an alternative that cuts down results shown [1].
Overall I'm very happy to have now three good options for checking out what I consider to be a very good source of fuss free tech news and discourse.
[1] hckrnews.com - hopefully it isn't a faux pas to mention a potential competitor to your site in this thread.
I use hckrnews too. You can set it to show everything, but its more of a nice CSS skin for the main site.
This one seems to do a bit more, and changes things more dramatically. I don't think the subgroups of HN that like hckrnews would overlap much with the one that would like this site. Its much more visual.
Whenever I see something like this, I sigh and wonder, "Why should it be so hard for the average internet user to create a live 'grid of thumbnails' for 'a list of links to webpages'? Why should it take a whole developer to code and deploy an entire website, just for this one use-case?"
Software today is not as "soft" as one would've hoped, fifty years ago. It's not malleable. It's not composable. It's barely reactive.
Every time someone says "Why should it be so hard to.." with software it's because they've not thought about the requirements. If you break down "a live grid of thumbnails" it's actually a relatively complex app even if you're just making an MVP. Even if you're prescriptive about things like the number of links in the list, the size of thumbnails, the layout of the thumbnails, the way the user manages what links they see, the regularity of updates, you're still left with an application that needs a basic list CRUD UI, a grid of thumbnails, something to render a screenshot of the website to a thumbnail, code to handle the site being unavailable or un-rendererable, a backend to store the list data and thumbnail images, maybe something to check to see if the site has actually changed (which can be tricky if it loads content with JS). And that's before the user's ask for features like drag and drop grid reordering, update scheduling, etc.
That's not to suggest it'd take more than half a day to knock something together, but that's more down to the awesome ecosystem of software libraries than it being a simple project. To write an app from scratch in, say, C++ would be a huge project.
I would disagree. All of the problems that you mentioned, such as "the layout of the thumbnails", "the regularity of updates" and "something to render a screenshot of the website to a thumbnail" can already be solved and parameterized to such genericness to be sufficiently usable for this use-case and, I'd surmise, most others.
I don't think it's that difficult if it's rendered live. You could have a similar site with a series of iframe. Could spoof it as an image by overlaying a div that captures and discards all clicks.
I bet the whole thing could be done with a couple lines of JS.
What does require real dev work and infrastructure is prerendering the web page screen shots and serving them up.
Given that the word 'software' only really started appearing around 50 years ago [1], that might be a stretch, but nonetheless, I think you do our current set of technologies a disservice.
I'm sure it would be relatively incidental for the majority of HN readers to cobble something together that fulfils this sort of functionality without much work. If your complaint is that languages don't form higher abstractions of things like 'thumbnails', I think that is just due to us collectively preferring the flexibility of lower level code - it's certainly not because it would be difficult to create a language with such abstractions.
I dread the day when the average Internet user can do such things. Or even _want_ to do such things. Please hire a good developer to do this and pay good money :)
I recollect a conversation I had with a recruiter around 12 years back. He was predicting that a day will come when a "manager" can drag and drop objects and create any kind of software application. That day has not come and it will not come.
Before I try to address the idea that "software" should just be fully adaptable to the needs and wants of the average internet user, let's stick to this more specific use case.
If you want a web site that allows you to create your own personal grid of thumbnails for a list of links (from a URL), that is something that can be built with software (with relative ease). If this particular developer created that tool, the considerations would certainly elevate rapidly - now it's useful to a lot more people, so you need to provide hosting for your larger audience. Instead of a novelty, you've created a burden on your resources. Particularly if they want a "live" grid of thumbnails, and thus it updates "constantly", the resource costs could quickly become staggering.
What are reasonable expectations for software, and if they are not being met, what is the roadblock? What exactly were the predictions and hopes for software in the late 60s?
A relatively average user can use WYSIWYG editors (including word processors, web editors, and apps that provide text, photo and video editing at your fingertips.) What else should they be able to do?
Are we merely discontent with the rate of progress? People who are not in the line of work of home automation are able to purchase hardware and configure it in their homes. People can buy inexpensive, versatile computer chips off the shelf and program them to be unique devices, meeting specific needs. We can already imagine, predict and hope for a future where the functionality of a web site or device is wildly configurable to the individual. What metrics do we have to reach before we're satisfied?
Thank you for mentioning this. There are couple of similar patterns between the projects, but feels that hnews.xyz it's faster and has more features.
Congratulations to the creator for having fun building this and please share the code!
Interesting experiment. My observation: With the thumbnails, the title of each post becomes a less-important-caption. In the case of HN, I think the text-only approach is far better. Product Hunt used to be text only, and frankly, it was a better experience. The moment you introduce images to these types of communities, people will start using that real estate to create flashy-attention-grabbing visuals. Over time, it'll be more about how good a thumbnail looks, rather than the curiosity of a title that lures you into the content.
Good point. I wonder if this might be measurably worse. A click-bait image might have the power to grab your attention from your peripheral vision in a way that pure text, however click-baity, can't.
Perhaps visuals would work for a community of graphics designers. But outside of that, it's just not useful. Especially if half of the thumbnail is filled by ads or logos.
(Not actually) shower thought: maybe if google showed thumbnails beside results, that'd drive websites to avoid using them popups that appear on page load?
What was stopping people from taking the same click-bait approach to the text titles? Titles on reddit are still pretty damn nondescript, and rarely have actual relevant information in them.
Honestly it was a difference in the userbase and how they interacted. There's some unknown threshold of users where once a platform becomes too popular it begins to degrade. I'd say pre-2010 reddit is a vastly different beast than today.
Reddit appears to only show images to posts about the image, not to a website. Most of reddit content are just posts to images and the discussion about the image, so IMHO that improves reddit's usability for their target audience.
HN is more about interesting content/discussion instead of posting memes and it is much harder to scan and determine interesting content from images than it is from titles. As a note: when HN has the same target audience as reddit is when i stop using HN.
I agree. There are two (mildly related) parts to this: grid layout and using an image.
Image instead of text does not work for me. I prefer to read things. Grid layout makes curated content less clearly ranked: does your eye wander horizontally first, vertically, or some random pattern? does screen size affect this?
What could be interesting is to supply 3-5 main points from the article. Doing this automatically is, I suspect, very hard, but if done would give me significantly more information on whether to click the link, go to comments or ignore. Just my 2c.
But at least most of us here have by now trained ourselves to be mostly immune to click bait. Don't want to go through the same process again but with misleading thumbnails this time.
I don't know, I would want to see titles put above the thumbnail before I conclude that the title becomes less important. Right now I think that this effect may be exaggerated because the thumbnail is the first thing you see.
In general I am inclined to agree, but I would want to see titles be first before I write it off completely.
That's nice. I thought about using thumbnails to linked sites before, but I wonder about the legal dimension.
What if someone puts something illegal, or copyrighted on one of the linked pages? Does anybody have advice (internationally / US / Germany)?
I'm based in Germany, and here there is strong legal protection for "quoting" excerpts. However, it is often debatable what counts as a quote. German news sites often take a photograph of a screen, instead of a screenshot. There seems to be protection for search engines (e.g. Google Photo Search), but the situation is not clear. There is also no "fair use" or safe harbor like in the US.
I'm especially afraid of cease and desist letters (Abmahnungen) - there is an entire industry of people who crawl the web and find copyrighted images with image recognition. The mean thing is that they don't let you use their tool to check for compliance - I would gladly buy a license for images I accidentially use, or remove them - but it is more profitable for them to send you a letter.
(Rant: I once had a case where someone accidentially printed a copyrighted image on a document and put a scaled down picture of that document on a domain managed by me. The copyrighted image was about 50x50 pixels, mirrored, and black and white, but they had me pay ~800 Euros for it. Funny thing is that they never ever contacted us via the contact email. They didn't care about their client's rights or about selling an image, they wanted to milk us. They sent physical letters to people they thought related to the site, until they grabbed me (the Admin-C of the domain).
Now I heard they are going after people rewteeting or liking copyrighted images - IMHO that is ridiculous, there should be a difference between "including" and "linking to" an image.)
117 comments
[ 3.1 ms ] story [ 191 ms ] threadhttps://www.google.com/search?q=cartoon+department+of+redund...:
http://hackernewsgrid.com/screenshots-compressed/52bbadf90a3...
The person that made the site could manually trigger a series of new screenshots though.
https://en.wikipedia.org/wiki/Droste_effect
Wright, who died in 1959, often spoke and wrote eloquently about the influence of the blocks in his understanding of design. In his 1957 book, ''A Testament,'' he wrote: ''I sat at the little kindergarten table top and played with the cube, the sphere and the triangle. I soon became susceptible to constructive pattern evolving in everything I saw. I learned to see this way, and when I did, I did not care to draw casual incidentals of nature. I wanted to design.''
Some architecture observers have noted the similarities between the block structures Froebel designed and the eminent architect's buildings.
http://www.nytimes.com/1985/10/13/style/the-froebel-gift-tak...
https://github.com/GoogleChrome/puppeteer
EDIT: It's using a flexbox grid layout so it shouldn't actually need any breakpoints. Maybe the layout changed since you checked it or your browser is triggering a fallback?
[1] https://groups.google.com/forum/#!msg/phantomjs/9aI5d-LDuNE/...
[2] https://github.com/GoogleChrome/puppeteer#usage
My main UX issue with HN is the comment nesting. Would much prefer less nesting and something akin to 4chan's backlink post referencing.
The 4chan post referencing (>>>/g/565645674567/) which allows you to reference any post from any board and it embeds itself on hover is a very underused useful feature I believe.
Overall I'm very happy to have now three good options for checking out what I consider to be a very good source of fuss free tech news and discourse.
[1] hckrnews.com - hopefully it isn't a faux pas to mention a potential competitor to your site in this thread.
This one seems to do a bit more, and changes things more dramatically. I don't think the subgroups of HN that like hckrnews would overlap much with the one that would like this site. Its much more visual.
Software today is not as "soft" as one would've hoped, fifty years ago. It's not malleable. It's not composable. It's barely reactive.
This is not how it was meant to be.
That's not to suggest it'd take more than half a day to knock something together, but that's more down to the awesome ecosystem of software libraries than it being a simple project. To write an app from scratch in, say, C++ would be a huge project.
That would seem to be the point the OP is making.
I bet the whole thing could be done with a couple lines of JS.
What does require real dev work and infrastructure is prerendering the web page screen shots and serving them up.
I'm sure it would be relatively incidental for the majority of HN readers to cobble something together that fulfils this sort of functionality without much work. If your complaint is that languages don't form higher abstractions of things like 'thumbnails', I think that is just due to us collectively preferring the flexibility of lower level code - it's certainly not because it would be difficult to create a language with such abstractions.
[1] https://books.google.com/ngrams/graph?content=software&year_...
I recollect a conversation I had with a recruiter around 12 years back. He was predicting that a day will come when a "manager" can drag and drop objects and create any kind of software application. That day has not come and it will not come.
If you want a web site that allows you to create your own personal grid of thumbnails for a list of links (from a URL), that is something that can be built with software (with relative ease). If this particular developer created that tool, the considerations would certainly elevate rapidly - now it's useful to a lot more people, so you need to provide hosting for your larger audience. Instead of a novelty, you've created a burden on your resources. Particularly if they want a "live" grid of thumbnails, and thus it updates "constantly", the resource costs could quickly become staggering.
What are reasonable expectations for software, and if they are not being met, what is the roadblock? What exactly were the predictions and hopes for software in the late 60s?
A relatively average user can use WYSIWYG editors (including word processors, web editors, and apps that provide text, photo and video editing at your fingertips.) What else should they be able to do?
Are we merely discontent with the rate of progress? People who are not in the line of work of home automation are able to purchase hardware and configure it in their homes. People can buy inexpensive, versatile computer chips off the shelf and program them to be unique devices, meeting specific needs. We can already imagine, predict and hope for a future where the functionality of a web site or device is wildly configurable to the individual. What metrics do we have to reach before we're satisfied?
If Puppeteer[1] is used to screenshot the site, probably need to use the page.click API to close it.
But, one problem with that is you need to know the exact selector name which maybe is not a generic one.
[1] https://github.com/GoogleChrome/puppeteer
Is it easier to read, or just otherwise better, if the picture came after the link/heading?
I find it hard to visually read/parse the way they have it now with picture first then title.
Perhaps visuals would work for a community of graphics designers. But outside of that, it's just not useful. Especially if half of the thumbnail is filled by ads or logos.
http://i.imgur.com/0k4fbc5.png
I think people here are just romanticizing text titles like they're some objective description of the material.
HN is more about interesting content/discussion instead of posting memes and it is much harder to scan and determine interesting content from images than it is from titles. As a note: when HN has the same target audience as reddit is when i stop using HN.
Image instead of text does not work for me. I prefer to read things. Grid layout makes curated content less clearly ranked: does your eye wander horizontally first, vertically, or some random pattern? does screen size affect this?
What could be interesting is to supply 3-5 main points from the article. Doing this automatically is, I suspect, very hard, but if done would give me significantly more information on whether to click the link, go to comments or ignore. Just my 2c.
This makes it sound like clickbait is a better option than flashy thumbnails, but it's essentially the same bullshit.
In general I am inclined to agree, but I would want to see titles be first before I write it off completely.
Edit: And perhaps boldface as well...
I think a better thumbnail system would be to use an actual image of the article (for example, the thumbnail for the page https://www.gobankingrates.com/retirement/1-3-americans-0-sa... would be a crop of https://cdn.gobankingrates.com/wp-content/uploads/2016/03/sh...), or simply a favicon in case there's no image available. Hell, you're experimenting so why not even a carousel of all the images in the article? (moving on mouse hover ideally)
Also the title should not be secondary, below the thumbnail. Maybe it should be over the image in some way?
What if someone puts something illegal, or copyrighted on one of the linked pages? Does anybody have advice (internationally / US / Germany)?
I'm based in Germany, and here there is strong legal protection for "quoting" excerpts. However, it is often debatable what counts as a quote. German news sites often take a photograph of a screen, instead of a screenshot. There seems to be protection for search engines (e.g. Google Photo Search), but the situation is not clear. There is also no "fair use" or safe harbor like in the US.
I'm especially afraid of cease and desist letters (Abmahnungen) - there is an entire industry of people who crawl the web and find copyrighted images with image recognition. The mean thing is that they don't let you use their tool to check for compliance - I would gladly buy a license for images I accidentially use, or remove them - but it is more profitable for them to send you a letter.
(Rant: I once had a case where someone accidentially printed a copyrighted image on a document and put a scaled down picture of that document on a domain managed by me. The copyrighted image was about 50x50 pixels, mirrored, and black and white, but they had me pay ~800 Euros for it. Funny thing is that they never ever contacted us via the contact email. They didn't care about their client's rights or about selling an image, they wanted to milk us. They sent physical letters to people they thought related to the site, until they grabbed me (the Admin-C of the domain).
Now I heard they are going after people rewteeting or liking copyrighted images - IMHO that is ridiculous, there should be a difference between "including" and "linking to" an image.)