Hacker News new | comments | show | ask | jobs | submit login
Laws of UX (lawsofux.com)
535 points by saketmehta 8 months ago | hide | past | web | favorite | 207 comments



After all the criticism here I took a shot of paraphrasing the website in a page length post: https://yozy.net/2018/01/10-laws-of-ux-digested/

A kind of an opinionated tl;dr


Honestly, just make it into a bullet point list: your reformulation of the ideas is WAY clearer and requires no additional explanations. Maybe add graphical examples if you must, but referring back to the text of the original site actually makes yours worse.


Thank you. I wanted to keep parts of the original mainly because I have merely interpreted the rules, however the work of compiling them, finding the links and so on was done by the original author(s).


I love that. It could be simplified further, true, but IMO this is good enough.

I particularly love what you did with the titles - practical advice, each backed by the appropriate "law", reads nicely and forms a clear picture in my head.


That's how it should have been done with decent UX. Simple and easy to read.


I agree with all your interpretations except for #4, I think it's the opposite, if something is ambiguous then you need to add detail to clarify it, and you can present a lot of information at once as long as the representation is consistent.

Having lots of detail is not equivalent to being complex.


I would agree. I think the real rule #4 is "Take greater care when presenting detailed or complex information. The presentation will often speak louder than the information."


For this one I dig into the linked articles because I think that the “law” itself is not exactly actionable. As a matter of fact it actually concentrated on logo design. The way I interpreted it for interface design is that if you need to present a lot of detail, you need to give it appropriate space. For example if you have a graph with many curves on it, people will be able to see the general trend but they will not be able to make out individual differences.


Do put leading zeros on numbers that are sorted as text.


9. Removing features from your product may result in users not being able to achieve some goals

Ie removing the leading zero breaks some sorting (Eg .mp3 files on an album where you know the number of tracks and hence how many leading 0s you need)


My remark was a jab at the fact that the list on the original website had leading zeros for no reason. I am not talking about naming files but about displaying information to humans.

In the case of music, leading zeros on files are useful for sorting. But the music player should not use file names for sorting but track numbers, and display them without leading zeros in the interface.


This is a problem of the sorting algorithm


Far too many sorting algorithms would have 10 come after 1 but before 2. Those programmers need to be flogged until they see the error of their way.


How many?


Your interpretation helped me understand most of the laws.

I hope mods replaces yours with the original.

Thanks.


Excellent. Add some examples of good/bad use of each law and you’d have a fantastic resource.


Great digest, thank you! Respecting the original poster (and his/her previous not-so-fruitful-reposts the previous days), I like your wording more and I suggest anyone that finds this topic interesting to have a read to your digest.


For Hick's law, if there are many options and your user knows what they are looking for by name, sort!


> your user knows what they are looking for by name

There's also CTRL+F in the browser. For the love of all that is holy, don't break it.


And please, don't break / either. Github and docs.python.org for instance don't play nice for vim users.


You don't have the posters.


awesome, and nicely done on the "bonus law"!


68K. Down from 331.


"Make the most important thing stand out"

I'd be careful with this one and be sure you understand what you are doing on a case-by-case basis. I have noticed a thing which I'm not sure there's a name for, but I call it Emphasis Blindness.

Similar to Banner Blindness, I think users today are often trained by habit to ignore things that stand out as some kind of obvious promotional item.

For example, you have 5 items in your navigation: Process Company News Blog Shop, and Shop is the most important, right? So you put it in some kind of special placement, and give it a button-like appearance with a special color and an outline. That doesn't necessarily make it easier to see! In some cases your users might just be looking through the "normal" navigation and not see "Shop". They will skip right over your large colorful button because it looks like a promotion, which they are trained to ignore.

Something to consider anyway.


That doesn't really apply to enterprise software. There are no ads there.


It doesn't mean the training doesn't still kick in. I've missed things in email because someone has written the most important information in bold magenta on a line apart and my brain just scrolls right past it.


I actually get annoyed enough by mixed bold and normal text that I can barely look at an email written with it.


Did anyone else enjoy it for what it was? I get the criticisms, you want the web to be homogenised and free from any form of expression that doesn't present every piece of information in it's most human-machine digestible form, I get it. But it was pretty simple to use and the flair was minimal. I don't understand the pitchforks. There's a few minor annoyances like the back button not working as expected, but they are very minor for a site so small.


I quite enjoyed it. I liked that they didn't just give you a checklist of "things to do", but instead gave you broad "laws" that you can interpret how you see fit coupled with the reasoning behind that law. This keeps each one applicable to multiple scenarios and isn't prescriptive.

I think a lot of the hate comes from people seeing that it's about UX and want to immediately tear it down for not being how they personally prefer information (apparently, if it's not the most information dense way possible, they don't like it).

I actually think having a distinct picture and making you scroll a bit helped me. The distinct picture is a good mnemonic and makes each law stand out from the others (especially by using different colors). If you had them all squished together with no scrolling necessary and no colors, it would be hard to distinguish between them. Sure, it might be more efficient to scroll through, but that in itself might be the point: reading through something and actually grokking it does not happen by scrolling through it as fast as possible, so why optimize for that?

It looks fine on mobile to me. The only real complaint I had was losing my position on hitting back, but I wouldn't jump to the conclusion that they consciously made it do that. Probably just a bug/oversight.


> I get the criticisms, you want the web to be homogenised and free from any form of expression that doesn't present every piece of information in it's most human-machine digestible form, I get it.

You don't get it, you just minimized and dismissed everyone's objections to this site.

As a power point presentation, this site is great. As a line item on your resume, sure.

As a resource that someone can use and reference, it's awful.


Right, and it's clearly not a reference website, considering it's a random selection of a few UX guidelines.


It looks like an individual's side project to learn a few tools and make something sort of fun and informational. Maybe it's not the immediate perfect solution of all things but so what.


Agreed, I thought it was kind of cool. I work in UX, so some aspects bother me - but it probably serves it's purpose well.


As a truck, a car is also awful.


I think criticism is warranted if you make a website literally called “the laws of UX” and then break half of them with the site presenting them.


Breaking the back button is not a minor annoyance, it's a major design error. Site size is irrelevant.

Arguably, the rest of the site is also a major design error. Its style over substance approach doesn't look or work like most web sites.

In fact it looks like an excuse to design a set of virtual retro book covers that reference the stylings of the late 1960s and early 1970s.

I have nothing against vintage book covers, but it seems like an unusual choice for a site about modern web design.


Which browser are you using that this site breaks its back button? Works for me on chrome/android.


As an art installation, for its visuals and animations? It's nice, I like it. Its problem is that it's trying to peddle information, and doing so in a highly inefficient way.


Please don't draw a strawman about me and the arguments I made pretending you "get" what I want with such dismissive and patronizing attitude.

I was one of the critics and I gave very explicit, objective criticism on the points I considered awful. And it has nothing to do with what your arrogant intelect generalized.


> I get the criticisms, you want the web to be homogenised and free from any form of expression that doesn't present every piece of information in it's most human-machine digestible form, I get it.

That's some very thick and obvious rhetoric.

It's a few different fallacies rolled into one, most notably a Straw Man.

You are in essence defining your opponents terms by your own book to shape the argument in a way favorable to you, instead of approaching the criticism from an objective and open-minded perspective that respects the actual position of the critic.


The author forgot rule #0: the design should serve the content, not the other way around.


Holy butthurt criticized criticizers, Batman! Upvoted this comment, for all the catty self-important comments it inspired.


Is there a law of UX related to making a user scroll thousands of pixels to read 10 sentences?


I agree. And the laws are stated in complex sentences, so I really could use some more explanation. To learn more I have to click, go to another page, wait for a slow animation of the poster design and only then I could one paragraph explaining it further. And when I go back to the home page, it takes up to the top at the first law and I have to scroll it all over again to the point I was before.

Awful experience.

It looks like the author is a talented graphic designer that decided to compile the laws of UX without reading them (actually, I wouldn't know, as there was too much friction for me to read them all)


At first I did not like that the 3rd law spoke about 'sites' when it could be applied to applications as well (or any other usable thing). Then I realized that these are most probably citations.


I read them all. They have nothing to do with proper UX. They're just basics of perception.

The site is doing the equivalent of advertising as "rules of efficient chair design", and then listing laws of thermodynamics.


Maybe: “Respect users’ screen real estate.”

And the corollary: “Don’t fear information density. Remove decoration if it allows faster access to the information that matters.”


Sorry, was facetious. The site looks lovely but if it's purpose was really to inform rather than to advertise the creators graphic design skills different decisions might have been made with respect to how the content is presented.


And maybe a law that says things have to load in slowly so it's possible to scroll past them before they appear?


It's all about the experience, the exploration, the perdition of purpose as a tool of the establishment that conditions the individual to always be learning, for only then it can fruit him in his greedy machine of post-modern industry.

Also, frankly, this is nearly a dadaist instance of a web page.


Safari Reader mode compatibility should be mandated by law


Fitts law.


For a website all about UX, the site is almost impossible to use (at least on mobile), both from an intuitiveness perspective and from a technical one.

I am entirely unsure what I’m supposed to click on, if what I’m seeing is an animation or a loading progress bar, the back button gave me a blank, black page, and everything on the site would be better if it were simply static html without all this JavaScript garbage that serves exactly zero functional purpose.


I clicked on one of the book covers and ended up with an abstract full screen animation that ran for five seconds before I figured out it was a full screen page header.

I'm confident that web design is the way it is mostly as a means to keep the people that work with it employed. A simple, straight forward implementation with a little color and layout to make it stand out would have been much easier to navigate and digest, but making check boxes not look like check boxes, drawing cryptic metaphorical icons, random show-off CSS animations that serve no purpose etc. creates work opportunities.

I'm open to the idea that I belong to some sort of cynical minority, but I know for sure that it often happens to the detriment of things like ergonomics and usability. When I see a site like this I can't help but think that they never considered the experience they're supposedly designing.


>I'm confident that web design is the way it is mostly as a means to keep the people that work with it employed.

I work with web designers and can corroborate that.

Most of the time, their product is sold, negotiated and approved before anyone has actually used it. An unusable mess can be a "successful" project, while a usable product can be completely kiboshed and not even paid for or used. This pushes the emphasis towards beauty instead of functionality, often to the latter's extreme detriment.

This gets worse when the stakeholder has some pet attribute they believe is important, especially "cleanliness." These "clean" designs mindlessly strip away anything that can physically be stripped away, without regard to its importance. As long as the design still kind of reminds the client of their company, they don't see it as a problem.


It doesn’t help that the designers often do not code and model the experiences in animation software.

I am currently working on a redesign and just saw the agency’s suggestions for animation. Seem to be highly influenced by iOS apps’ transitions and motion. But this is a website, for browsers, to be displayed on a variety of screen sizes, on a variety of browser versions.

And the users of my website use mostly other websites so if I create something that behaves very differently, the training they have will be wasted and the experience — unintuitive.

So the agency will present this to high management, in an ideal layout, designed in animation software, moving perfectly smoothly and solving for only one case without a clue on how to approach corner cases. If management finds it sexy, we’ll be stuck with development and maintenance of ultra complicated code. And the pleasure of discovering and resolving all corner cases ourselves, on a deadline, with limited budget.


> It doesn’t help that the designers often do not code and model the experiences in animation software.

I don't think even that is a good enough reason. They simply don't approach the problem the way someone using their app would. It's the developers' problem to turn a difficult design into code, but the real problem is that even when that is done perfectly, the UX still sucks.

Every time we redesigned a major UX component of the dashboard of our (desktop) app, we would grab a random secretary, HR person, accountant, or anyone else we could find and borrow an hour of their time and just watch them try to use it without any prior preconceptions that come as a result of designing/coding the interface yourself.

It's been 10 years since we used that trick and I've moved on from that company, but I still think it's the best approach I've ever come across short of outsourcing some sort of panel testing.


User testing is a must have for digital design, otherwise the designers you work with are just graphic designers who pretend to know the tenets of UX through skimming some medium articles occasionally and do a great disservice to us folks who come from academia with degrees in HCI.


>So the agency will present this to high management, in an ideal layout, designed in animation software, moving perfectly smoothly and solving for only one case without a clue on how to approach corner cases.

Oh lord, I don't really have to deal with complex animations on websites. Even though I wouldn't be the one physically building it, I don't look forward to the day. That sounds like a 2d problem becoming 3d.


IMO, the problem is that the ones that approve the look-and-feel aren't exactly the users, but the hirers. And since they already live inside the company, some things might make sense to them, and not the wider public.


Yeah precisely. The CEO can connect the dots, so they don't stop to think if a customer could connect the dots, or if anyone would bother to think that hard (about their cryptic site, which is 7th website of 10, in a row of browser tabs).


Even on the desktop site it hides the navigation. It could use an index on the left -- not to mention that the entire law page is so brief that it does not need its own page.

Which one of those laws tackle UX bloat and ornament for ornaments sake?

The site is pretty, that's true, but it's not made to be a useful source of information, it's made to be pretty above all else. The entire site is a great example of what to do if you want to make information minimally accessible and create a vapid slideshow.


The irony is that they're perfectly demonstrating the importance of Jakob's law (03): "Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know."


  users prefer your site to work the same way as all the other sites
And yet, the last one contradictory reads: "[…]when multiple similar objects are present, the one that differs from the rest is most likely to be remembered." There are no such things as 'rules' in this field. People don't realize how wishy-washy this is and because of that, they throw around some arbitrary rules and then write about it on Medium in a desperate attempt to show authority and demonstrate expertize in their line of work. I could whip out ten other rules that are more applicable and closer to the digital sphere, starting with the notion of 'functionality' instead of some overly complicated and obtuse lingo. In fact, the very first slide has a very weird syntax to it.


And most other sites have dark text on a light background, not light text on a dark background.


User testing is a must have for digital design, otherwise the designers you work with are just graphic designers who pretend to know the tenets of UX through skimming some medium articles occasionally and do a great disservice to us folks who come from academia with degrees in HCI.


I share your opinion. I guess I'm in the minority too.

Maybe we need a flag or some banner, or something.


Some rare and unique symbol, like an unstyled form submit button.


It also creates differentiation in a competitive world.


Different doesn't equal better.


how are measuring "better"? If it wins you a contract, then the market has judged your fancy-checkboxes as "better"


Not necessarily. There's a good chance there was just someone who knows nothing about UX and is never going to actually use the software approved it for others to use. Or it might be that despite a poor UX, it's still the only product to do what you need. Despite a poor UX, it's better than the other guy's even worse UX, at least for now.

There's been loads of software that has been successful just by taking the idea from already existing software and making it more user friendly.


You seem to be confused about better in the objective sense. I am saying that designers make things fancy to get attention, especially from product managers. No claims about what is better need arise. From the perspective of the ux designer, they are doing what the market is selecting for and rewarding them for.

By analogy, You don't get to claim what is better in evoulution and natural selection. There is only what is selected for, which might not have any preference for what you consider good or not


That's IMO the root of the problem. Market works as it always does, it optimizes for profit. So things are designed to be sellable instead of useful.


can't even program a computer these days without becoming a marxist!


Haha, no :). I'm just advocating the same thing you seem to - understanding market incentives as an optimization system, and realizing that its goals are not always aligned with human goals.


I know I am just teasing


While dark patterns make money, I choose to not engage in them because I also value trust, convenience, long term relationship and this means that I create certain experiences for my client.

Just one example where profitability is unfit to be the only criterium.


I did not assume "dark patterns". I am explaining behavior from the viewpoint of the UX Designer, especially getting work. As a product owner, you are free to choose what you want to prioritize. You don't get to chose what other product owners prioritize. Some product owners really like fancy checkboxes. go to any apple page and tell me if you see standard, unstyled html text boxes, combo boxes, and check boxes.


I was undecided until middle-click opened in current tab.

That's not what I asked for. Let my browser do its job.

Edit: And right-click behaves like left-click! Non-standard and annoying. So much for "Jakob's Law".


That is an unforgivable sin of web design: do not highjack the open-in-new-tab/new-window keystrokes.


I've noticed some sites hijacking Alt-ArrowKeys now, too. Since backspace was deprecated, that means those websites prevent the user from using the keyboard to go Back. Very frustrating.


Even on a desktop I find its UX annoying.

It only feeds you a morsel of information at a time and you have to wait for stupid animation transitions in between. I read two panels then left.

This information could easily have been presented in a normal HTML document.


perhaps the author was going for the clockwork orange esc feel of discomfort so you should actively think about the ux you're experiencing


perhaps rename the website to lossofux.com


lawsux.com, maybe.


Laws 'o fux?


331K transferred. Less than 1K of actual readable text.

In the about section, the author brags about using Sketch, Gulp, SASS, Nunjucks, and a third-party font. Seriously? He couldn't have just envisioned that thing in his head and put it straight to code?


It's actually 1.3kB of text. Here's the entire contents of the page, for anyone else who can't read the original. Clicking on each entry brings you to a page with the same text and a Wikipedia quote on the origins of the law and a couple sources for further reading:

1. Fitts's Law: The time to acquire a target is a function of the distance to and size of the target.

2. Hick's Law: The time it takes to make a decision increases with the number and complexity of choices.

3. Jakob's Law: Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know.

4. Law of Prägnanz: People will perceive and interpret ambiguous or complex images as the simplest form possible, because it is the interpretation that requires the least cognitive effort of us.

5. Law of Proximity: Objects that are near, or proximate to each other, tend to be grouped together.

6. Miller's Law: The average person can only keep 7 (plus or minus 2) items in their working memory.

7. Parkinson's Law: Any task will inflate until all of the available time is spent.

8. Serial Position Effect: Users have a propensity to best remember the first and last items in a series.

9. Tesler's Law: Tesler's Law, also known as The Law of Conservation of Complexity, states that for any system there is a certain amount of complexity which cannot be reduced.

10. Von Restorff Effect: The Von Restorff effect, also known as The Isolation Effect, predicts that when multiple similar objects are present, the one that differs from the rest is most likely to be remembered.


Basically, the whole contents of this website fits in a average-sized HN comment.

This is what I mean when I say about "toys" vs. "tools", or "designing for sellability" vs. "designing for delivering value". Your version of that site delivers pure value. Anything more than that - like e.g. images vaguely related to content - is just wasting user's attention, bandwidth, compute and power bill.


Law/Effect:

1. Fitts: The distance to and size of a target dictate the time to acquire it.

2. Hick: The number and complexity of choices increase the time to make a decision.

3. Jakob: Users prefer your site to work similarly to sites they know.

4. Prägnanz: People exert the least cognitive effort to interpret complex images.

5. Proximity: Proximate objects are grouped.

6. Miller: The average person can only keep 7 +/- 2 items in their working memory.

7. Parkinson: A task's duration matches its allocated time.

8. Serial Position: Users best remember the first and last items in a series.

9. Tesler (aka "Conservation of Complexity"): A system has irreducible complexity.

10. Von Restorff (aka "Isolation"): What stands out is remembered best.


> He couldn't have just envisioned that thing in his head and put it straight to code?

That's a pretty snobby thing to say. So what they needed to design something in Sketch. So what they used Sass and Gulp.

If you're deriding someone for using a tool to help them with something, can you be derided for using a napkin to sketch an algorithm or something?


I believe the author is being derided for being inefficient to the tune of 33000% or so.

It's like buying 300-some-odd napkins and a similar number of pens so you can scribble a phone number on one.


I'm not so sure, unless it's a total misunderstanding from the person chiding them.

Sketch doesn't add to final size. Neither does Gulp. Sass and Nunjucks might, but it's a website. They tend to need HTML and CSS.


You're absolutely right! Sketch and Gulp don't add to the final size. And HTML and CSS are needed.

So let's be generous! I'll assume that 4x the core content size (1.3k) is needed for markup and presentation, for a total of 6.5k. Round a bit... that's still 5100% inefficient.

I can see why some might consider that a bit inefficient. Of course, I can also see why some might consider the design the most important part of the site.


The most annoying thing on that kind of scrolling UX for me is the fact that when you scroll down, navigate, and hit the back button, you end up at the top of the page and have to scroll down again.

(At least on my iPhone 6)


I actually liked some elements of the mobile experience:

* Hamburger menu upper right (90% of people are right handed) * Sticky top menu with breadcrumbs * Consistent back button behavior

Only nit was large graphics/icons and requirement to click on them to "reveal" the law. That content should have been front and center on home page with drill-links to details.


On desktop it's awful too. I scrolled for about 5 seconds and decided it wasn't readable.


> the site is almost impossible to use (at least on mobile)

> I am entirely unsure what I’m supposed to click on

As a tangent, I wonder if we'll be stuck with "click" being a very common word to use to refer to following links when it makes no sense when in the context of a touch screen. English is littered with words like that, so it's possible it's here to stay, but occasionally (rarely, I admit), it jumps out at me as oddly out of place as it did here, even through it's entirely obvious what was being communicated.


I've built sites before where the term "click" was automatically changed to "tap" on the mobile version.

It was just a function embedded in the multi-language routines.


4 or so years ago, I remember a frustrated Dev printed out signs on our floor at Zynga that was focused on the then early-mobile efforts that said “It’s a tap not a click!”


It is possible to click on a mobile device, although lots of software just treats it like a very precise touch, which makes no sense.


The site works fine without JavaScript.


I just tried. Actually, the site UX is so bad that it gracefully degrades without JavaScript enabled. The animations, the low information density, and all the other atrocities translate "perfectly" when browsing without JavaScript. smh


The desktop apps of the 90s was the heyday of UX. There are many positive things that could be said, but in the interest of brevity, I'll mention just two.

Customizability. Users could set up their own hot keys, and even their own tool bars.

Discoverability. Every UI widget (knob) had a tooltip, which explained its function. When a menu item was being browsed, there was a help line on the bottom that explained its function. Items that could be clicked were either visually distinct (such as buttons), or highlighted when hovering over them.


> The desktop apps of the 90s was the heyday of UX for power users.

Regular users didn't set up their own hotkeys or their toolbars. And they definitely didn't read the help or tool tips.

The best UX for regular users, not interested in computers, is somewhere between websites and mobile apps.


Every time i hear about "Regular users" being the reason why modern UIs suck so much i get the feeling that regular users tend to be the enemy of actual users.


Regular users are not interested in computers. They're interested in getting shit done, and getting on with their lives.

Which is precisely what modern UX makes harder. You see, regular users aren't "neanderthal users". They have a brain and some amount of focus, and if they have to use an application/website more than few times, they'll figure out and appreciate any feature that lets them do their work more efficiently. Unfortunately, modern UX trends are all about removing productivity, turning tools into toys.


This is just giving UX a bad name.

There cannot exist the best UX for regular users. There are things that are used once or very rarely and have to be designed to rely on people's prior experience with other things, like most websites. And there are other things that are used often and have to be designed to be learned. Every case is different and not simple.

As for trends, maybe you are thinking about UI trends. People do like to follow those and confuse UIs with UX and make things harder for everyone. But you can't really say there are UX trends.


> This is just giving UX a bad name.

It's a question if UX already isn't an orwellian term for "be cheap on UI" or "target lowest common denominator of users". I don't know, but you should ask that question yourself.

If you're more interested in name than substance, it might be an indicator.

> There cannot exist the best UX for regular users.

Categorical claims of non-existence require extraordinary amount of evidence.

> Every case is different and not simple.

That might be the thing. UIs (and usability) in the 90s focused on consistency. But then interactive websites ("applications") became a thing and the consistency (for example in the looks) was thrown out the window.

So everybody has to target the lowest common denominator (aka "regular users") now, because of the mess that this artistic explosion created. (There are other factors, too, such as that touch screens by definition lead to worse UIs.)

I don't entirely lament the mess (the artistic explosion is nice). But please, don't claim that we made progress in usability.

> But you can't really say there are UX trends.

I would say UX itself is a trend. As someone already noted, it had a name before - ergonomics. It's really similar to "data scientist", which is largely a modern trend of how to call a statistician.


I don't know how to explain this better, but there is no lowest common denominator among users. Regular users use different things differently, some things they use like tools, often, other things once and never again. This usage is what influences design decisions, not the regularity of users.


"UX" already has a bad name, and it's entirely justified. When several decades of solid usability research are thrown away largely due to aesthetics over functionality, resulting in poorly usable, inefficient and confusing interfaces, it's a net loss. Oh, but the experience is better! No, it really isn't. This lawsofux website is IMO an ironic parody of just how out of touch these "UX experts" are, though no doubt they find it wonderful, and it keeps them all in cushy jobs, which is no doubt the main reason for it even being "a thing".


That's because they don't get a chance anymore.

Many of us have graduated from users to superusers to sysadmins or devs but modern software feel quite dumbed down compared to the options we had.


That's only because you were interested in IT, either as a career or as a hobby. Most people aren't.


2-year-olds can use simple apps on tablet computers.

I don't recall any desktop app from the 90s whose features would be discoverable by even a 3-year-old.


Ironically the site itself breaks the 3rd listed law, Jakob's law that states "Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know." because it breaks the back button. When navigating to a law and then hitting back the site sends you to the top of the list again. -


My vote for law 11 is “don’t use JavaScript unless it’s absolutely necessary”. That way the browser actually behaves the way you expect.


Maybe more like “use JavaScript to enhance the experience, not define it”. At least unless you're prepared to actually get it right, which still in 2018, seems to be tricky given the amount of weird sites like this.

This site breaks so many conventions of the web and normal navigation I don't even want to start listing them.

Bad SPA sites are the full page Flash sites of today.


To me, JS is like salt: It can definitly make the experience better when used sparingly, but that doesnt mean I want my meal made out of it.


Seems a broad law considering

* Expectation is subjective and this forum are the minority

* History-jacking done badly is not a reason to throw out a technology

Random JavaScript hate is so last year


> Random JavaScript hate is so last year

It isn't random.

Firstly I think it is mostly directed at the abuse of JS that we see.

Secondly while there has always been good reasons to avoid running code in the browser unless there is a good reason.

This year added one more with the CPU level bugs that could be exploited through client side JS.


> there has always been good reasons to avoid running code in the browser unless there is a good reason

From what I hear from the junior devs, what they're teaching in school these days is that as much of the site as possible should be offloaded to the client device in order to free up server resources.

The mindset is that everyone in the world has unlimited massive bandwidth at all times, along with the latest gear; and if you don't, you're an "edge case" and should be ridiculed.


Honestly, I believe the exact opposite is true. Why should you make your users and their batteries work harder to get what they want? Somebody comes to our website with a task in their head, and fundamentally our goal is to help them complete that task as quickly as possible. "Offload as much work to the client as possible" does not help our users complete their tasks faster. It makes life easier for dev teams by having servers that focus on APIs, reusing js code to create native apps, etc. But in the vast majority of cases it does not help the user, even if done perfectly. No, it's not faster because "no whole page reload" and yes, it does break expected browser behaviour unless you are extremely, unreasonably careful. The only exception is if you're building Google Maps or something extremely "appy" and need to have an alternative to the app store, for some reason.


I'm saddened by the possibility that this is what they teach juniors these days. This approach is, IMO, borderline unethical.

Offloading to the client device in order to free up server resources quite often means taking the load your server could handle once and multiplying it millionfold, once per each of your million visitors. In other words, your product just started to burn a million time more electricity than necessary. We should call it by its true name - externalizing costs - with all the negative baggage associated with that phrase.


as much of the site as possible should be offloaded to the client device in order to ~~free up server resources~~ decrease latency.

Network is much slower than CPU. It's ironic you deride the assumption that everyone has unlimited bandwidth and then suggest that the solution is to send every user interaction through the network.


> Random JavaScript hate is so last year

It may well be, and with good reason. However, I still encounter people who think that JavaScript is only used for things like onMouseOver and find it difficult to accept that actually, their favourite app or site is entirely powered by JavaScript.


Part of that may result from the fact that, when it's done properly, the fact that it contravenes no expectations makes it easy to overlook. Like the first rule of systems administration - when you do your job right, nobody notices; it's only when you screw something up that anyone remembers you exist.


Using Noscript or an equivalent can be very enlightening. IME many major sites do work without JS. My guess is for accessibility.


That sounds like the vast majority of users expect more functionality from browsers than can be achieved without javascript. Do you think they would be willing to part with that functionality to achieve engineering perfection?


> Do you think they would be willing to part with that functionality to achieve engineering perfection?

I think that the question would be entirely lost on most users. Perhaps there needs to be a push to educate on the benefits.


Also why use “sites” in the wording if the laws are about UX in general and not web app UX in particular? Why not say “applications”?


As a portfolio piece, it's great. I don't really care that it's not the most usable thing in the world - the underlying concept is sound, it's easy to see a lot of effort went into the design and execution, and the site looks great! Buuuut that's about all it's good for in it's current form.

Unfortunately, the way something looks is but a tiny, tiny factor in the scope of the overall UX. This totally falls apart as a reference piece that I can bookmark and go back to from time to time. I think this is also compounded by the fact that the content of the site is centered around preaching good UX - but doesn't adhere to it's own advice. I can forgive lapses in UX thinking on software engineering blogs or the latest and greatest crypto forum...but if your site about UX has bad UX, you're in for a bad time - especially on HN.


Welcome to this website about UX that took all of 2 seconds to annoy the shit out of me by giving me the impression that I am in some sort of foreground mode that I possibly might want to get out of to access the site...


I don't have the references right in front of me but I'm pretty sure the 7 +/- 2 in Law six is now thought to be 5 +/- 2.

Wiki puts it at 4 +/- 1:

https://en.wikipedia.org/wiki/Short-term_memory


Plus the associated illustration (on Laws of UX) seems to agree with you.


Any of Nelson Cowan's recent papers on the topic are good references for this smaller working memory.


The reaction on Hacker News compared to the reaction on Designer News is great.

I think the problem people are struggling with is that it's a site created mostly for fun and delight, but the message is about "UX", which people generally think of as a way to maximize efficiency.

Products don't always need to be relentlessly efficient to be considered useful or "good". Some products are created for you to just enjoy.


[0] https://www.designernews.co/stories/90954-laws-of-ux

Super positive. We love it.

Blows my mind. But that's the point - it's really like two very, very different ways of thinking about, approaching/creating and evaluating projects (in this case, a web site.) On one side, they have "an eye for design" that really appreciates this novel UI design, but on this other side, we have that eye for efficiency and... ahem... user experience. (Rather than how a designer might experience something.)


Oh, thanks for the link, this gives it a lot more context. A website made just to show his designer friends who are also pressured by the market to not value UX. Makes sense they romanticize UX and don't actually bother with it themselves.


That's not really the point we were making and I'm not sure you have a correct understanding of UX, as you're conflating UX and visual design.

There's no pressure in the market to not value UX. Everyone wants and needs that. If anything there are pressures to only value efficiency rather than delight. Sometimes "fun" isn't efficient.


If it was created as a portfolio piece, I'd say it's successful. If it was created as useful and repeatable reference for the digital product/service/whatever industry, it falls short.


I don't think it's trying to be a definitive reference. It seems more like those posters you put around the office to remind you of things you value or you think are important.

Everyone is taking this fairly seriously. I doubt HN is the target demographic for this sort of thing though.


> Jacob's Law: Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know.

This should come with the footnote "unless you're Facebook". I wonder if they're fully aware of the power they wield in defining what normal/expected UX looks like to a so many people? (e.g. popularizing the mobile three lines 'hamburger' menu, then later moving away from it themselves)


Most people aren’t working on such a site. I think such a footnote would be dangerous since too many people would then assume that they are, in fact, Facebook.

I mean, even site of huge companies are not necessarily the Facebook of anything, since that’s just not the use case. I would, for example, argue that this law applies perfectly and without any qualifications to Apple’s website which might see a lot of traffic, but it’s not exactly a site users spend most of their times on. (I would also argue that the website people actually do spend most time on exists in a certain context where the outside world will have some influence on how and how efficiently it is perceived and used. Obviously the website people do spend the most time on has a role in forming that context, but so does the web as a whole and every single site.)

Oh, and I do think Facebook is very aware of that fact, but you still have to see that they are always wrestling with the status quo, i.e. for them the law takes the form of “Users spend most of their time on other sites or on the old variant of your site. This means that users prefer your site to work the same way as all the other sites they already know or your site as it was.“

It’s not exactly easy for them, even if they get to be expectation-defining and their power is not absolute. The stakes are high.


    Miller's Law - The average person can only keep 7 (plus or minus 2) items in their working memory.
I actually needed to research this claim for my dissertation, and found that some researchers believe it is more complex than as presented by Miller. The number can fluctuate depending on what is being stored, the individual, and a number of other factors. A worthwhile starting point is the Wikipedia Page [1]

[1] https://en.wikipedia.org/wiki/The_Magical_Number_Seven,_Plus...


Oh the irony, this site has terrible UX.


    <ul>
      {% for law in laws %}
      <li><strong>{{ law.name }}</strong>  - {{ law.summary }}
       <a href="{{ law.wikipedia_url }}">{{ law.name }} on Wikipedia</a>
      </li>
      {% endfor %}
    </ul>


Jinja2 or Django template language?


I think it's valid in both!


> Jinja2

If I would guess;


Tesler's law really rings true in non-UX environments too. I have worked with several people insisting that you can somehow remove complexity by wrapping it in more levels of abstraction, which is utterly infuriating. Sometimes you really just have to accept that certain things are complex, and deal with it.


Is there are place where you can simply download pages already "perfected" in its UX and you can simply add your own custom business logic to it?

Something in this direction would be Bootstrap's templates:

https://getbootstrap.com/docs/4.0/examples/

I dunno about you, but I'd rather not have to think about how to make project sites look like every time, but at the same time not necessarily use the same purchased template (because said template may not actually have a good UX).

The fact that there are no standards here is part of the problem, IMO. Novelty drives views and therefore revenue so some sites are incentivized to be overly complex, imo.


UX can't be a plug-and-play solution, because it depends on your business and the user's goals.

UX is figuring out what should be a main menu element and what shouldn't. Home and princing? Definitively. ToS and privacy policy? Not so much.

UX is making some elements stand out as they are. What's the best way to show links to users? Spoiler alert: blue color and underline. But then what happens when your brand color is blue and the design has a blue background? Then links won't stand out.

You could say that the UX plug-and-play solution is the way browsers handle the default CSS, add a few more styles and you got sites like CraigsList and Pinboard. And brutalism web design was born.

But that's the visual part about UX, you have to figure out what your users are feeling, and for most starting sites, feeling good is the selling point, so you have to understand their psyche and design towards it.


Here's my suggested addition, law 00, that this website really needs to follow: Please don't make your websites into huge Vogue ads on desktop. I have a 27" monitor, I can fit more than 4 lines of text on my screen.


The animation and no text displayed when a law is selected makes me think I'm waiting for loading to complete. It takes me couple of seconds to realize I need to scroll down to see the text.


What font is this using? That weird mark on all the "st" pairs is irritating!

Maybe we need a number 11, "don't use weird fonts"


Miller's law is outdated, there are newer studies that say working memory is around 4, very rarely 6. You can check your working memory with this little test mentioned in this tweet:

https://mobile.twitter.com/UXColumbo/status/5978387232633651...


The "next" button is extremely difficult to find. I wonder if this site was user-tested.

Nice, huge, Fitts' Law-optimized button though.


I call bullshit on all of these, with the possible exception of Fitt's Law and Tesler's Law.

It seems that a lot of things these days are being extremely simplified beyond their point of usefulness and that things are always too small and too cumbersome to click, and require extra clicks because "wow such empty-ness and whitespace-ness".


I happen to think this is freaking awesome


I find the layout of poster downloads on the detail pages of the individual laws, with the text of the law and lawofux.com tag on the right side, unfortunate. The layout of the posters on the top-level page are 100x more evocative and elegant. They are the posters I want.


Really surprised that Gestalt Laws are not listed. (Law of Proximity is one of them).

https://en.wikipedia.org/wiki/Gestalt_psychology


It would be better if, instead of a useless albeit pretty icon, there was a brief description of what the law is about.

Fitts's Law tells me nothing about what it is other than its a UX "law" coined by someone called Fitts.


Here's a good article about this law, with many examples: http://asktog.com/columns/022DesignedToGiveFitts.html


Wasn't really about the law itself. The same applies to all laws listed.

I want to know which ones are most relevant to me. I'd like to see a summary for each one so I can make that decision before loading another page. Otherwise, I needlessly have to click on them, make a decision and click back if not.

This is similar to how a blog typically shows an excerpt for each post on the blog index. See Jakob's law.


One HCI book I read had a point that relates to Tesler's law: If your change requires users to make more clicks to perform the same task or action, it is probably a bad change.


Not a fan of the website UI. Eg. For me, having to have a big down arrow telling the user further content is down, is a UI fail.


The site looks nice, but I had to do way to much clicking to see the information. I gave up after the thrid law.


Wish there were actual examples of each one instead of just an explanation. UI is cool but UX is poor.


A new "Law of UX" should be coined: "Visual design is not UX."


I know it's Laws of UX, but I first read the domain name as Law of Sux.


Very cool, but no law about not using dark grey fonts on black..?


i loved the fact that a site about UX doesn't allow me to open the links in new tabs... sooo annoying! damn it!


Complaints about the web site itself aside, I'd like to encourage designers to exercise more restraint when applying some of these laws. Most poignant for me is the misapplication and zealous over-application of Hick's Law. If you review the detailed link provided by the site [1] you will see some commentary about when not to use Hick's law.

Personally, I would significantly expand where Hick's law should not be applied. Examine the example provided that compares two remote controls: one with a common suite of buttons, and another with a dramatically reduced set of buttons. The site seems to suggest that at the very least the stripped remote yields ratings of "better user experience" from users. I would argue that such ratings alone should not drive UX decision-making.

In my life, I have seen the trend of simplifying user interfaces chip away at functionality in virtually every interaction I have with technology, and I don't feel better for it. I really miss the opportunity to more finely control devices and applications according to my needs and wants. The most recent technological epoch—focused so much on mobile devices as it is—has been among the most pronounced with its stripping of functionality (ostensibly to make things easier to use on tiny displays).

I often feel that this law is misapplied, perhaps subconsciously as an excuse to not build more comprehensive functionality. Why build a hard button that can turn on and off Closed Captioning when you can just put that in a menu, or better yet, not implement Closed Captioning at all?

(To be clear: it can be perfectly fine to hide infrequently-used features in special menus. I use about:config in Firefox routinely. What bothers me most is that, for example, the browser on my phone doesn't have a tenth the options of Firefox and certainly doesn't have anything like about:config. The argument this is because it's a small screen device seems hollow to me; the real reason almost always rings of laziness and contempt for customization by users. Sometimes it will be spun as a means to reduce testing time—laziness by another name—as if mobile software has had any track record of being tested more thoroughly versus old desktop software.)

Designers, hear my plea: Let's start pushing back on Hick's Law. Yes, in cases of needing a fast decision, a stripped user interface is agreeable. But in many cases, we're not acutely rushed while using our devices. Generally, I want more functionality from technology, not less. Stop using a UX law as cover for laziness and reduced feature sets.

[1] https://uxplanet.org/design-principles-hicks-law-quick-decis...


>doesn't have anything like about:config

I use about:config frequently on my phone - is a pain to use on a phone however. Here's an idea. Use software on the phone but allows users (who wish to) to do deep configuration of phone software on their desktop computer.

I have the opposite complaint about most phone apps - they expose complexity on screens where it's not appropriate. Good software on any platform should "make common things easy and hard things possible".


what a load...

Conservation, momentum, trying to force people to use physics concepts for UX, for crying out loud, is anybody taking this seriously?


Yeah seriously. Are people really that insecure with their job titles that they need to invent bullshit to make UX seem more scientific?


Gkya's law of usefulness of a web page:

The usefulness of a web page is a function of the multiplication of the number of laws it cites w/o any context whatsoever and the ratio of the lines of text such page contains in a screenful over how many it could've contained.

> The time to acquire a target is a function of the distance to and size of the target.

Wat?

> The time it takes to make a decision increases with the number and complexity of choices.

Certainly. But this is as relevant as general relativity to designing UX: the context is the key. What are you making, for what purpose, when, for whom? In this form in which it's put forth here, this can mean about anything.

> Users spend most of their time on other sites. This means that users prefer your site to work the same way as all the other sites they already know.

This is SOOO WRONG. I probably don't spend time on those sites because I'm in love with their UI, most of the time I'm fighting it with uBlock and patience. Many people are in prisons, that doesn't mean they like it.

> People will perceive and interpret ambiguous or complex images as the simplest form possible, because it is the interpretation that requires the least cognitive effort of us.

Again, this means nothing. It's like, "stones are hard". Alright then, what am I supposed to do? Sand them? Hit my head on them? Throw them at passers-by?

> Objects that are near, or proximate to each other, tend to be grouped together.

Alright...

> The average person can only keep 7 (plus or minus 2) items in their working memory.

Yeah...

> Any task will inflate until all of the available time is spent.

Oh, thanks...

> Users have a propensity to best remember the first and last items in a series.

This is kind of immediately useful, but it's also neat that this rule is ignored in making this fancy bulleted list.

> Tesler's Law, also known as The Law of Conservation of Complexity, states that for any system there is a certain amount of complexity which cannot be reduced.

Agree.

> The Von Restorff effect, also known as The Isolation Effect, predicts that when multiple similar objects are present, the one that differs from the rest is most likely to be remembered.

Certainly true.

This web page is a good demonstration of bad UX: there certainly are some stuff there that could be useful, but no indication of how that can be possible is made, no explanation of what is before the eyes of the reader is there, the only means of interpretation provided to the reader is intuition, illegiblity is swiftly achieved by using black font on a nearly-black background, the viewport is used with absolutely no care to efficiency, and there is a menu that requires JavaScript to operate. This is like a parody of a page on UX laws.

Put information on your web pages, people.


> This is SOOO WRONG.

Even if the author is not a UX person himself and doesn't understand those things well enough to give better explanations, this is still not wrong. Users spend most of the time not on your website, but on other websites. This is important, because it means that other websites shape what users know and understand about websites' UIs, not your website and that users are not willing to spend time learning your website's UI. So you have to learn how other websites do it and apply the same concepts in order to make it easy for people to use your website.


> The time to acquire a target is a function of the distance to and size of the target.

If you need to move the cursor far and to a small target, it will take a long time to hone in on it.

The shorter you have to move it, and the larger the target - the easier it is to click.

For example the menu on macOS is always at the top of the screen, making its target HUGE and is therefore basically O(1) to hit.


What (I believe) gkya was trying to point out is that "the time to acquire a target is a function of the distance to and size of the target" is a rather pointless statement. Of course it's a function of the distance to and size of a target; but Fitts' law consists not in this observation (which was nothing new to Fitts himself, and most likely to the entire human race ever since the first Paleolithic man tried to throw a stone at something), but in the actual function, ID = log(2D/W).

The cargo-cult reading of Fitts' work which is so prevalent nowadays probably accounts for many of the instances of cargo-cult UX design that are so popular today.


I don't really know Fitts' work, but I do understand that what that sentence means is obviously "smaller things are harder to click or tap". But that is very obvious and thus meaningless without indicating what that implies: e.g. "make bigger buttons".


OK, first, that sentence does not mean "smaller things are harder to click or tap". That sentence would still hold true if smaller things were easier to click or tap. Besides, in 1954, when Fitts' paper appeared, it was already understood that this was the case.

I'm not being overly pedantic here -- Archimedes' principle is not that "whether an object sinks or floats depends on what it's made of", that had been known since the dawn of time. Archimedes' contribution was to give it a quantitative formulation, which is what we now call Archimedes' principle -- the force is equal to the weight of the volume of liquid that the immersed object displaces. Similarly, Fitts' law is not that larger targets are easier to hit, that has been understood forever; it's quantifying this statement, and the end result is what we now know as Fitts' law.

Second, the implication "make bigger buttons" is not at all valid in every circumstance -- which is why I warmly suggest reading the actual paper to anyone who cites it.

Fitts' work applies to repetitive movements of equal amplitude and speed, not necessarily made with active cognitive involvement, and assumes that targets are known in advance and -- although not explicitly stated, but implicit in the experiment -- easily distinguishable. It will tell you nothing useful about the size of buttons in dialog boxes, for example. (Edit:) this blind interpretation would also suggest, for example, that making the macOS menu thicker would help, but it doesn't; or that simply making buttons thin, but placing them on top of the screen, would also help -- which holds is only partially true for mouse-driven interfaces, and not at all for touch interfaces.


I'm not really interested in these details, and "make bigger buttons" was just an example of what an implication might have been (as indicated by "e.g."). What I tried to criticise was the vagueness of the linked page and the scarcity of information.


> What I tried to criticise was the vagueness of the linked page and the scarcity of information.

So if you are not interested in "these details", but you found the page vague and the information scarce, what details should it have included so as not to be vague?


> what details should it have included so as not to be vague?

- How is the correctness of such "law", expecially in context of UX desgin, is observed?

- What are practical implications of these "laws", again in the context of UX design.


Or space them out more. Of course these concepts seem trivial when you implicitly shave off half the content and then fit it to your own pre-conceived solutions.


I tried to upvote you, but hit the downvote button instead :(. Oh well.


HN is not Fitts’ law compliant.


It's not that I don't understand this. It's that a web page on "the laws of UX" counts on the readers' interpretative capabilites to get such point across, and excludes any concrete example to make their point clear.


Unless you use a very large screen, in that case you often have to move the mouse over half the desk any time you want to click the menu. I remember the fun I had back when Apple produced those 30" screens.


For touch that is true, for mouse and pen you still have to consider travel time.


That's the distance


Yes (but for touch on a phone or tablet, being on the edge of the screen is better because your hands are already resting near there + occlusion sucks).


The navigation on this site is so bad I created an account on HN just to mention it.


I wish more websites would go back to header/sidebar/content layouts and rather than trying to impress with all the gimmicky crap and random layout, would again start trying to inform.


Don't fuck with scrolling that should be a rule.


You do realize that this "UX" thing was for decades called "ergonomics" and had a large body of research behind, do you?


Did you mean to say 'Usability'

Ergonomics was and still is it's own thing. It very much relates to the physical world exclusively.


So a digital interface that is displayed on a screen of a desktop is "UX", but the very same digital interface that is displayed on a touchscreen attached to industrial machine is suddenly a totally different field "ergonomics"? Or does it need physical buttons to be called that?


In your case, there would be an overlap. A digital interface is UI. UX is multi disciplinary, it would focus more on the human centered process of building an application that fits the user needs. Ergonomic specialists would take into account the job (task), physical environment, user need, equipement (does the worker wear gloves...). Some are trained to be able to work on both fields (Human factor, cognitive engineer...)

UX could also be called cognitive ergonomics.


You interact with websites using physical means, so it's an important aspect of how users experience them. If a website has tiny buttons and icons, it might be hard to use with a phone. On a large screen computer with a precision pointing tool it might be preferable that they are small. If the information density is ten words per 2000 vertical pixels, it's going to be a pain in the ass with a scroll wheel, not so much on a tablet where scrolling has almost friction-less inertia. Low contrast might be bad if you are using a phone, great if you're in a dark room.

If it's your job to improve the user experience, you're doing a bad job if ergonomics is not a consideration.


My point (as a UXer) is that up to around 7 years ago we were generally known as practitioners in the field.of usability / user interface design / etc.

The people in the field of Human factors and ergonomics pretty much still have those titles.

There is a lot of overlap but my point is UXers were known as Usability folks on the whole


Problem being that web design is the most likely computer discipline to not actually have that many academics in it.


People misunderstand UX; ergonomics, usability, UI are parts of a full UX process


The 3rd law is just wrong.

Yes, we spend more time on other sites and therefore, we are used to the UX patterns used on other sites, but that doesn't mean that all other pages are doing good.

Actually, we do not choose the sites we are on purely based on UX patterns. Instead we choose the sites by the service/functionality they are offering.

So assuming that other pages are doing good UX and inventing new patterns will irritate users might be a good advise for junior UX designers, but UX experts should always question the status quo and search for improvements. So defining it as a law to stick to the UX patterns of the majority of sites is just wrong.


As the down voter did not care to leave a comment, I try to give an example:

For years we were seeing the burger icon (3 horizontal bars) as an icon for menus. It took quite a while until it became a well known standard to add some 'Menu' text next to it (as you can see it on the Laws of UX page).

So for years we had a pattern on most sites which was not optimal. Just using it because everybody else was using it, didn't solve the problem that a majority of users did not understand or knew the icon.




Applications are open for YC Winter 2019

Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact

Search: