
Another Unsolicited HN Redesign - uxisnotui
http://www.uxbeginner.com/hacker-news-uxui-redesign-process/
======
ajmurmann
My main issue with HN is that the comments link is a pain on touch devices.
This redesign seems to make that link even smaller. Much of the value of HN
lies in the amazing comments, so I would prefer that link to get almost equal
prominence to the actual article. I also don't understand how almost
unreadably pale article titles make the page more usable.

To me this redesign is another case of making it prettier rather than more
usable.

~~~
jacquesm
You could probably cook up a userscript that swaps the comments url and the
article url, and changes the 'comments' link text to 'article'. (This also
takes care of the opening sentence of many comments ('did you read the
article?').

------
CognitiveLens
I like that you've been relatively conservative with the redesign and have
clearly relied on established convention so that existing users can carry over
their existing experience into the new UI.

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

------
comrh
The article titles are way too light imo.

~~~
me_bx
+1. LC;DR >
[http://www.contrastrebellion.com/](http://www.contrastrebellion.com/)

------
oliwarner
I've dealt with more than a few designers handling solicited corporate website
redesigns and one of the most critical issues I see back are "That looks
really great, but where is our logo?" Yours looks like a fine example of a
pretty design but you've trampled all over their brand in favour of your own
palette and taste. Different Y, different spacing, different colours. You've
designed something for a different company.

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.)

~~~
vegedor
>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.

------
davmar
kudos to you and great job being brave and sharing your work. takes courage to
be that vulnerable.

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.

~~~
nilliams
On point 1. I hope you appreciate your angle is pretty oldschool and would beg
to strongly disagree. I have read a lot of HN commenters over the past few
years commenting on similar designs/redesigns that seem to share your
viewpoint and desire for 'information density' and not needing to scroll, but
I do suspect your opinion is basically that of a nerdish minority that is
going the way of the dinosaur.

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...](https://chrome.google.com/webstore/detail/georgify/ofjfdfaleomlfanfehgblppafkijjhmi)

~~~
srean
> I do suspect your opinion is basically that of a nerdish minority

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.

~~~
nilliams
Well of course, I didn't mean it quite that literally and am a bit sad to see
I got downvoted but I guess I did make the point poorly (and mildy
aggressively now I read it back).

I should probably just have linked to somewhere the argument has been made
before [1].

I'm a nerd and I vastly prefer large type & generous amounts of whitespace
over cramming lots of titles on one screen so it saddens me whenever I hear
someone authoritatively state the 'information density' argument.

[1] [http://uxmyths.com/post/654047943/myth-people-dont-
scroll](http://uxmyths.com/post/654047943/myth-people-dont-scroll)

~~~
davmar
you put an awful lot of words in my mouth. i didn't mention scrolling. re-
read.

the top bar is too large vertically without enough value. readability improves
a bit, but the sheer prominence takes away from the discoverability of the
first article title.

i didn't mention type size or whitespace. i also like large type and generous
amounts of whitespace.

i think you're just looking to argue for the sake of argument.

~~~
nilliams
Sorry, I'm not looking for an argument and I didn't mean to put words in your
mouth. My original post was badly written and overly argumentative, I think I
was in a bad mood and a couple of your points just set off my usual UX'y
triggers, I apologise.

You're right that I made the leap from your dislike of the top nav/footer to a
dislike of scrolling/desire for 'information density'. Those things are often
associated but I was wrong to make that leap. Again, my bad.

I disagree with your points that the header and footer are distracting and
detract from the articles, that's it and that's all my original post should
have said.

~~~
davmar
no worries at all. we all get grumpy sometimes, myself definitely included.
enjoy your weekend :)

~~~
nilliams
Cool, same to you!

------
goldenchrome
Things being ugly doesn't mean bad design. There is no such thing as
objectively good design because all designed objects live in a certain
context. Hacker news is purposefully unattractive and the register forms are
outdated because the site wants to attract a certain type of person. If you're
perturbed by the visual design then the community would probably benefit from
not having you since the entire focus of the site is on the discussion that
ideas generate. In that vein, it's ridiculous that legibility was not a key
focus of the redesign since the singular mode of interaction with the site is
through text. Why is the text contrast so poor?

------
danso
This is one of the more pleasant unsolicited redesigns of HN, because it keeps
a lot of the subtlety that makes HN an easy site to return to constantly: a
prioritization of the headlines and a deemphasis on username and points (the
position of a story is more than enough of an indicator of the story's current
popularity). The bigger upvote arrows are nice, though I guess one could argue
that ease-of-upvoting is not a priority.

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.

~~~
FreezerburnV
I'd actually disagree on the search not needing to be prioritized point. I
think search could actually be a very powerful feature of HN allowing for
readers to gain a deeper insight into various topics. Imagine if someone was
reading about Rust for the first time (hey, there's even a "Rust vs Go" kind
of post on the front page right now!) and wanted to learn a bit more about it
by seeing what people have said about it in the past on HN. Said user could
easily see the search bar at the top of the page, and use the (hypothetically
good) search engine to discover articles about lifetimes, green vs native
threads, etc. with little effort. Doing so otherwise might involve spending a
decent amount of time exercising Google-fu to find the same information.

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.

------
austenallred
The hard part of redesigning HN is that we're all so used to the current HN.
Changing anything major becomes confusing, defeating the purpose of the
redesign.

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.

~~~
film42
I think this is so true. Not to mention that a lot of the hackers on the site
loathe sites that require javascript and will often prevent any script from
executing, so the login modal might be useless to a large percentage of the HN
community. The current HN design is really awesome because it only uses the
most primitive of elements. It's as if, like Austen said, there's no design at
all.

------
timdellinger
My biggest gripe is that you can't collapse threads a la Reddit.

~~~
jacquesm
[https://alexander.kirk.at/2011/12/06/new-feature-for-hn-
coll...](https://alexander.kirk.at/2011/12/06/new-feature-for-hn-collapsible-
threads/)

------
chrissnell
The header buttons are too big for my taste. I prefer economy of screen space
and that space should be going to articles, not buttons.

------
uxisnotui
Thanks for all the suggestions. I consider this a user test, of sorts. The
main changes I'm considering are:

\- 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!

------
salimmadjd
I like the modern look, but I actually think the UX suffers.

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.

------
zem
the "frontpage" label was an excellent idea. however, the redesign didn't fix
what i feel is the primary flaw with the top bar - user-specific and site-wide
entries are not distinguished. i'd redesign it as

[ 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.

------
franciscop
I _freely_ implemented it in HTML + CSS!

[http://francisco.io/demo/hn/](http://francisco.io/demo/hn/)

------
shangxiao
_Heuristics basically means “best practices,”_

heuristic: (adjective) using experience to learn and improve

------
giancarlostoro
Why not make a Stylish theme out of it? If you haven't already done so that
is.

------
AtTheLast
How will this design look on a mobile device and other screen sizes?

------
bulius
What would visited and upvoted links look like?

