How to fix a bad user interface | Hacker News Reader

How to fix a bad user interface

scotthurff.com

127 pointskindachris23 comments

Some of this advice is really good, but some of it is terrible. The section on gamifying user interaction is absolute garbage. I'm not "80% done filling in my LinkedIn Profile." I'm 100% done, but LinkedIn just wants me to give it more for its benefit. I will never give it the remaining information. It isn't encouraging me to do the remaining 20%, it's just annoying me that LinkedIn can't take "No" for an answer.

Also, I object to breaking the interface down into "screens". It encourages creating modal apps. Thinking about working in Photoshop, for example, while there are modes that depend on the tool you're using, you aren't in a different screen for every thing you're doing. (In fact, Lightroom does sort of have that problem, and it's why I don't use Lightroom.)

I guess you could call that nudging, but nudging people to give away their personal information doesn't bring up the same warm fuzzy feelings as "gamification"

On your second point: all of these examples were mobile apps, where it is hard to get around designing in "screens". I don't know what Adobe's mobile Photoshop is like, but I'd hope it's more modal and screen-based than their desktop application, considering it's used on a phone.

I disagree with his objection to using tags and other tertiary UI for onboarding, I nearly always find that helpful. Indeed he appears to disagree with it himself:

>"Instead, telling your customer the exact button to press and why they should press it is a much more helpful prospect." //

I think I also disagree on the false-feedback he suggests is good. If you give immediate UI change on a like showing that it has been registered and then you can't register it you find that user experience can break trust - next time I go to that page/post/comment I see my "like" is missing yet the UI showed it had been registered. Surely this is a place for an intermediate state?

Similarly with the skeleton screens, it can lead to a situation like the one he has with his videos being missing. The page changes but it's not got content, but there's no loading indicator as there is elsewhere on the site/in the app - so is it loading, did it break? We're left guessing about what is happening.

Petty complaints follow:

>"Awkward UI is a missing a loading indicator." //

Oops. There are always errata!

Surprised to see the segment on loading indicators avoid using the word "feedback".

>"Even if you're creating weather apps (cue Dribbble joke), one state won't cut it." //

Will the targeted readership understand this reference, I don't. I even went to Dribbble.com for illumination but none came.

I see a lot of missing [obj] which appear to be mostly/all "" being used as a section marker. It appears not to exist in the chosen font on my system though? [latest FF on WinXP]

Recently relevant, for those who missed it:

https://blog.intercom.io/the-dribbblisation-of-design/

I'd love to see more advice regarding optimistic state and when it should be used. For Instagram or Facebook, it seems worth it to give them satisfaction even while the request is processing - if they're lied to, it's not a big deal. In a financial app, this isn't the case.

Anyone have any articles or resources about this? Is there ever a place for optimistic interfaces in financial or otherwise-serious apps?

> For a second, I get scared. [...] Where are my movies?

I have a similar situation in Win8.1. I have an external hard drive that sometimes go to sleep. When I wake it up by trying to view its contents in Explorer, Windows shows a friendly "No files in this folder" message while the disk spins up.

It should know that it doesn't know that.

Win7 shows a green progress bar in the address bar.

Oh yes! The hard drive spin up delay always scares the shit out of me. I always think the drive crashed.

Lol, that's probably where in the past explorer would just lock up. They probably just converted a spinlock into "return null".

I remember sometimes XP would do a full, multi-minute lockup (including keyboard) when the C drive was trying to recover a bad block.

This is so important. Many people create async requests and overlook the state indicators. This seems harmless until the user doesn't know they need to wait for something to load, messing up their whole understanding of the widget.

Related article on how working with React (UI from data) can help you consider all your states:

Pure UI http://rauchg.com/2015/pure-ui/

Alternately, the UI is awkward because it's been micromanaged and bikeshedded to the point where it duplicates a worrying amount of domain ... Unreliably.

Not going to take any UI advice from somebody with pop-ups to sign up for a newsletter.

Yeah really, those pop-ups were obtrusive as hell on mobile, and forced horizontal scrolling.

This is stuff that gets left out a lot by hurried programmers (like me). A simple unceremonious <p>Loading...</p> at the top of the page is better than nothing.

At a bare minimum this is all I need. Your loading animation may be aesthetically pleasing but in the end all I really want is feedback.

This is a must read for product managers and designers.

And programmers. You know, the people who often have a lot of control over the final product in many companies.

Looks like a rehash of Luke W's previous articles http://www.lukew.com/ff/ He even took Luke W's pics of Luke W's Polar app...

Really looking forward to this book! I'm constantly blown away by bad UI, and I'm wondering to see what I can learn, and what I might be able to teach others.

Anyone have ideas for additional learning/connecting with others in this area? I am about to start reading "The Design of Everyday Things".

Joel Spolsky's "User Interface Design for Programmers" is phenomenal, and available freely online (!): http://www.joelonsoftware.com/uibook/fog0000000249.html

If you build websites, also check out Steve Krug's "Don't Make Me Think": http://www.sensible.com/dmmt.html

Thanks for the links to great books.

I got an error for the examples telling me than no video with a managed format has been found.

Reply on news.ycombinator.com