Hacker News new | ask | show | jobs
by coldtea 4659 days ago
This is quite bad -- only a small percentage are genuine examples of sloppu UI.

It seems to be put together by one guy (instead of user submissions like similar sites) and not quite design savvy at that.

Case in point:

1) http://sloppyui.tumblr.com/image/61441688489 (this is supposed to show "poor alignment")

2) http://sloppyui.tumblr.com/image/61439801745 (this is supposed to show "stray dropshadows" -- didn't they guy get the memo that the iOS 7 UI uses them to show a 3D layer hierarchy?)

3) http://sloppyui.tumblr.com/image/61439835569 (this is supposed to show "poor contrast". Isn't it obvious that the top bar should not be visually striking and distracting?)

4) http://sloppyui.tumblr.com/image/61440586435 (... this is considered "sloppy").

5) http://sloppyui.tumblr.com/image/61440527405 (flat information hierarchy -- one of the few genuine sloppy UI examples).

5 comments

Poster here: Indeed it's just me submitting. But it's open to submissions.

I'm not answering every single case you mention. The examples I posted show how inconsistent the UI is.

Taste is in the eye of the beholder and I didn't mention what I find ugly but what shows a lack of afterthought.

Just one example here to answer, "Poor Contrast" (http://sloppyui.tumblr.com/image/61439835569) On an iOS device, this is not "Subtle" but unreadable.

For what it's worth, I think nearly all your examples are spot on. These are sloppy jobs that I would've personally been ashamed of releasing to the public.

That said, noticing alignment issues and font inconsistencies is not given and a lot of people won't give a damn about them.

Steve Jobs would have. And then unconsciously everyone that ever bought or buy Apple products for that perfectionism that has been inbreed in their spirit.

Jobs is definitely gone. Had he be around, you would've seen tons of cartoon boxes and pink slips delivered to One Infinite Loop. If he would've ever let update like that released into cyberspace (he wouldn't've).

IOS7 clearly shows that John Ive is lost without Jobs.

I'm with you. I think most of the entries are spot on. They're simple details, but when they add up, consciously or not, they leave a bad taste. I just can't use iOS 7.
iOS7 hurts, simply hurts my eyes. After many years I'm forced out of the platform by this UI revamp.
I don't see the same inconsistency on "case". iOS7 seems to use Capitalization for verbs, "actions," whereas it uses lowercase for nouns. "Send" or "Edit" but "return".
There are a few cases of genuine sloppy UI in iOS 7, but this site does a horrible job of pointing it out.

http://sloppyui.tumblr.com/post/61658685474 This is the most outrageous. Apparently this mid-transistion screenshot demonstrates something poor. What? I have no idea. Is it sloppy in the same way this http://i.imgur.com/e5Vyv5z.jpg is sloppy?

Why is the textbox transparent? I haven't seen the actual transition in action, but it certainly looks sloppy this way.
I hadn't sent a message with my updated phone, just did to test this out. When you send a message it gets a colored talk bubble and then shifts up into position. During the shift the keyboard/text entry field stay on top. It doesn't last long, it would probably look cleaner if they'd made the talk bubble stay above the entry field (so that it doesn't get cut in half).
No, they keyboard and message box are clearly on a layer above the speech bubbles. There is nothing wrong with this behaviour.
See, I'm inclined to call it sloppy, this would look nicer if it wasn't sloppy, the screenshot shows a state that makes no sense to a normal user.

However, if this is actually happening in some transition, then leave it. We all know that there are only so many hours. Bring some polish to this transition with a future update. I can't see dinging them on design for a slightly sloppy transition.

Here's a video of the animation http://www.youtube.com/watch?v=5zNvFR7Mgxk&t=30s

IMHO, this is the opposite of sloppy.

Theres nothing sloppy about this transition it makes sense.

They did have a nicer one in beta 1 though where the message came up under the keyboard blurred

I agree that not all examples are good, but how can you defend the blue text/red caret?

There are also quite a few genuine design errors (Z index of updates available, alignment in the timer, ...) on the site.

The blue text with red caret solves a real problem.

It might appear odd in the context in which it appears, that is with the caret at the end of the line, but consider cases where the caret is between letters in a word.

When editing a section of text where you are looking to make a mid-word modification, being able to quickly and easily identify the caret position is important.

If the caret looks even remotely like any of the text being edited you may confuse it for the text or you may find it hard to see where the caret is.

The high text to caret contrast is only one solution to the problem of making the caret easy to find and easy to tell apart from the text itself.

On my stock Android 4.2 device the caret is a mid-grey within black text. On a small screen it is not clear to me with my inadequate eyesight where the caret is from just a glance. When editing mid-word a blue tab-style arrow is applied below the caret as a visual pointer. This sometimes obscures relevant text or controls.

As far as stock Android 4.2 vs iOS is concerned, I'd say that iOS has the superior solution in this case.

I would think flashing the caret is sufficient, but I may be biased by experience and good eyesight (for now). Given the number of people responding with how they used to lose the caret before, it seems that my experience is not universal.

Thanks for enlightening me.

> but how can you defend the blue text/red caret?

As someone with slightly less than perfect eyesight it's an absolute godsend.

>how can you defend the blue text/red caret?

Great contrast?

Nice bold color pair?

Not losing the caret because it looks like I or 1 or l?

I may be in the minority, but I really like the red/blue difference. I think it looks pretty good, and would be useful to quickly see where the cursor is.
Regarding the alignment one, I guess it's about the many seemingly random baselines and horizontal alignment points: http://imgur.com/pDEuLb6
The only one you listed that I agree with is stray dropshadows. Everything else is lambastable -- most especially the poor contrast one.