To me this redesign is another case of making it prettier rather than more usable.
I think it could use another fine-grained pass over each UI element to evaluate how important it might be to the user and whether the contrast/size/color/prominence of the element matches your expected prioritization.
For example, the numbers along the side are large and high-contrast, but are pretty trivial for people browsing articles (ordering is meaningful, but specific numbering isn't). On the other hand, commenting is a big part of HN, but is a very small and low-contrast part of the mockup, with no visual indication of how to access the comments.
I'd also have another pass at the color choices - white on orange and mid-gray on mid-gray can be pretty difficult to scan.
Great thinking on the filtering and top-level organization, though. There's some good stuff in there
Beyond that, the larger text for titles is nice if only as it makes scanning through them easier. Simply darkening them to a black or near-black would make for a large improvement alone.
That #FFF-on-#F60 Y is their brand. It's what they have all over their offices, on their business cards, on their main website... Unless the client is looking to rebrand (for which I can see no reason), you need to use their existing trademarks. Branding is as important to the client as UX is to the user.
(And on a UX tack, there's a severe lack of contrast in various places. You appear to have faded out the most important text on the entire page (the content) with no explanation why. Telling me "Because I want it to fade in on mouseover" is a fireable offence.)
How about, *because it creates incentive to try out the highlight effect and subsequently click, until the novelty wears of, at least.
having said that, it's not working for me.
1. the article list is now 100px or so lower on the page because the top bar is so large. the top bar is more readable and usable, but i can't remember the last time i clicked it, so i'd prefer to get to the articles more. 2. the numbers for each article (1,2,3,4) are the most prominent element, followed by the upvote. the article title is demoted. 3. the create account button is a tab. that doesn't seem right to me. 4. the bottom orange footer now is a heavy-weight element that draws my eyes from the articles.
overall i feel like the articles ought to be the most important element and this takes away from the articles.
but, keep it up.
Scrolling is cheap.
A fat top-bar is not a negative, because you can't read 20 article titles at once and scrolling costs you nothing. I'd love to see a study on this but I suspect the number of article headlines we can cope with in one 'scan'(?) and get something useful from is around 5-10 max? Twitter on my phone shows me about 5 tweets at a time. Does it feel like a bad user experience to me? Hell no.
>> 4. the bottom orange footer now is a heavy-weight element that draws my eyes from the articles. [...] overall i feel like the articles ought to be the most important element and this takes away from the articles.
Sorry that is nonsense, we humans are not that easily distracted and know to look for content in the 'content area' between the header and footer area particularly when they're so clearly differentianted (content = white bit, header/footer = orange bit). My eyes go straight for the articles on every website with a coloured header/footer ever.
I have other issues with this redesign but namely that it still feels significantly inferior to the Georgify Chrome extension [1] that has been around for years now and just by virtue of good typography and minimal design is still kicking everyone of these redesign's respective asses.
That said good job and great post, it's definitely a big step up from the original and I love your header :)
[1] https://chrome.google.com/webstore/detail/georgify/ofjfdfale...
I am sorry, but it appears you might have some confusion about the demographics and the target demographics. The name, for instance, might give you a promising hint, provided you do little digging about the word 'hacker'. At times it means something that it does not appear to mean.
My biggest complaint is the relatively massive header. I disagree that Search needs to be prioritized...in a news site, even the New York Times, I am hardly ever using the site search...if a news site is doing its primary job well (providing fresh links), then I almost never have the time or desire to search the archives. I'd say 50 to 80 percent of my search bar usage is mainly to complain about how many times a currently-trending story has been posted in the past. The search bar should stay at the bottom of the site, allowing the header to be a little more compact than it is in the OP's proposal.
Sure, the focus of HN is still on the new content that people want to see, but it could also be a place to learn more. Or even find old posts that maybe you didn't bookmark at the time, but suddenly want to see now.
EDIT: Apologies for the triple post (if anyone saw that). I tried to submit the post three times, and two of the times went to a HN error message. I deleted the other two posts.
The reason I like this one is because it doesn't break the structure or functionality, but by adjusting the size/prominence of elements it becomes slightly easier to use. I'm not in love with all of it, but it holds true to the core of HN, which is disregarded by most redesigns.
That being said, using HN as it is feels like I'm in a terminal window. Designers would be reluctant to admit this, but the very functional text-heavy interface is very "hacker-like," and I adore the lack of design.
- article text readability (this bothered many people) - header height - colors: #FFF-on-#F60 (thanks Oliwarner)
ZEM also brings up a really interesting point about user-specific vs site-wide entries.
Aiming to do a redesign with your suggestions and do more user tests. Thanks again y'all!
In your design, the focus is on the up vote arrow. I use HN for content discovery. So I think content is taking a second seat against up-voting in your design.
[ frontpage | new | show | ask | jobs || new comments || my threads | my submissions | submit ]
or maybe even move the "my" stuff to the right alongside the [ username (karma) | logout ] section.
heuristic: (adjective) using experience to learn and improve
