Why Rounded Corners are Easier on the Eyes

by on 08/17/11 at 10:17 pm

Designers use rounded corners so much today that they’re more of an industry standard than a design trend. They’re not only found on software user interfaces, but hardware product designs as well. So what is it about rounded corners that make them so popular? Indeed they look appealing, but there’s more to it than that.

Rounded Corners are Easier to Process

Anyone can appreciate the aesthetic beauty of rounded corners, but not everyone can explain where exactly that beauty comes from. The answer to that is literally in your eye.

Some experts say that rectangles with rounded corners are easier on the eyes than a rectangle with sharp edges because they take less cognitive effort to visually process. The fovea is fastest at processing circles. Processing edges involve more “neuronal image tools” in the brain [1]. Thus, rectangles with rounded corners are easier process because they look closer to a circle than a regular rectangle.

Scientific research done on corners by the Barrow Neurological Institute found that the “perceived salience of a corner varies linearly with the angle of the corner. Sharp angles generated stronger illusory salience than shallow angles” [2]. In other words, the sharper the corner, the brighter it seems. And the brighter a corner appears, the more it’ll affect visual processing.

Which object is easier to look at?

We’re Conditioned for Rounded Corners

Another explanation on why we have an eye for rounded corners is because they’re more organic to how we use everyday objects in the physical world [3]. Rounded corners are everywhere. And as children, we quickly learn that sharp corners hurt and that rounded corners are safer. That’s why when a child plays with a ball, most parents aren’t alarmed. But if a child were to play with a fork, the parents would take the fork away for the fear of the child hurting itself. This provokes what neuroscience calls an “avoidance response” with sharp edges. Thus, we tend to “avoid sharp edges because in nature, they can present a threat” [4].

Which object would you trust with your child?

Rounded Corners Make Information Easier to Process

Rounded corners are more effective for maps and diagrams because they allow our eyes to easily follow lines “as it suits better to the natural movement of the head and eyes respectively” [5]. Sharp corners throw your eyes off the path of the line so you end up experiencing abrupt pauses when the line changes direction. But with rounded corners, the line leads your eyes around each corner to continue along the path smoothly.

Which diagram is easier for your eyes to follow?

Rounded corners also make effective content containers. This is because the rounded corners point inward towards the center of the rectangle. This puts the focus on the contents inside the rectangle. It also makes it easy to see which side belongs to which rectangle when two rectangles are next to each other. Sharp corners point outward putting less focus on the contents inside the rectangle. They also make it hard to tell which of the two sides belong to which rectangle when two rectangles are next to each other. This is because each rectangle side is exactly a straight line. However, the sides of a rounded rectangle are unique because the lines curve towards the rectangle it belongs to.

Conclusion

There are more to rounded corners than meets the eye. Rounded corners are not only easier for our eyes to process, but they also make information easier to process. There’s no doubt that rounded corners are appealing. But these extra reasons make them even more appealing to use. Now when you talk to a client about rounded corners, you’ll have something more to say than it just looks good.

References

[1] Realizations of Rounded Rectangles

[2] Corner salience varies linearly with corner angle during flicker-augmented contrast

[3] Why Do We Love Rounded Corners?

[4] NeuroFocus Study Reveals What Went Wrong With the Gap’s New Brand Logo

[5] FMC Visualization Guidelines

70 Responses to “Why Rounded Corners are Easier on the Eyes”

  1. agentfin

    Aug 17th, 2011

    Wish I could find it now, but Frito-Lay did a delightful study on how rounded endcaps [those displays at the end of supermarket aisles] were more appealing to women. But wait, what was the reason WHY?!?

    Because sharp corners reminded women of hot oven doors.

    Perhaps more of us are afraid of hot oven doors than Frito-Lay realized. Or maybe the reason that women are able to avoid this hazard of the kitchen is not due to an innate understanding of ‘hot ovens’ but instead our brain’s dislike and mistrust of sharp angles.

    Sharp things hurt. So do corners. So, um. Watch out, yo.

    ps. In case my tirade on how much I appreciate the depth of understanding this article plumbs was not obvious: THIS RESEARCH IS RAD.

    thanks for making this a human issue, rather than some women/oven affinity factor.

    • Genn Pinnick

      Aug 19th, 2011

      Nice tirade. Yes, I think perhaps the hot corners and sharp corners did have some overlap for some generations of women, but as a whole, many of us have also experienced the thigh-level bruise from too narrow of a path between sharp-corned tables at cafes, restaurants, etc. ad we know “SHARP CORNERS BAD”.

      Still, enjoyed the tirade. Please, do it again. Intelligent humor is always amusing.

  2. Eric Scheid

    Aug 18th, 2011

    Rounded corners for connecting lines in diagrams also help to disambiguate where the lines are going (and help to discover some bizarro connection problems like you have in your diagram .. A does not flow directly to C??).

    That said, while I do use rounded connecting lines in my site maps I retain the squared corners for the boxes. The contrast is an aid to distinguishing which straight edge black line is a connector, and which is an object being connected.

    • Pito Salas

      Aug 19th, 2011

      I don’t think the rounded corner version of the org chart diagram is better. It’s worse. It visually implies that the A-B relationship is more important than the A-C relationship. Not a good example of the principle.

      • Trip

        Aug 19th, 2011

        As a non-professional, that was my immediate reaction too.

        • Eric Scheid

          Aug 24th, 2011

          Have you considered that perhaps the A-B relationship actually is less important than the A-C one, or maybe there isn’t an A-C relationship at all. To me, that diagram is saying that A goes to B, and then B goes to C.

          • Oliver

            Aug 24th, 2011

            I agree, bad comparison on that example. It should be fixed with a rounded corner going the other way as well. Unfortunately that adds more visual noise and confusion rather than remaining simple with a straight line.

    • Henrik

      Oct 4th, 2012

      Nice to read this article – uxmovement gives us great articles overall.

      About the diagram where A seems to lead to B – this is an example on how to fix it :)

      http://postimage.org/image/aqvkw649n/

  3. Suffiyan

    Aug 18th, 2011

    Join the conversation thread on the Facebook Group for User Experience called ‘YouX – UX for You’ … Ur article is the topic for the day :)

  4. Wayne McManus

    Aug 18th, 2011

    Good read and nice examples

  5. Tim

    Aug 18th, 2011

    Pretty sure those two flow-charts are not equivalent. The rest of your examples are all fine and I pretty much agree. But rounded versus sharp corners have specific connotations in certain areas and flowcharts is one of them.

  6. Danil

    Aug 18th, 2011

    I’m not impressed by the “sharp edges all around” example; if you want to be making the case that rounded corners help, then the complement should be a the crazy zig zag star with the points rounded off.

    I suspect that proposed shape would also be hard to look at.

  7. Udegbunam Chukwudi

    Aug 18th, 2011

    Hmmmmm. Nice theory. I’ll be testing out with my adsense image ads to see if rounded edges positively or negatively affect the CTR :)

  8. Victor

    Aug 18th, 2011

    curious though, your comment boxes don’t have rounded corners.

    i’m not going to say that it made a great difference for me.

    i guess it’s all relative…

  9. john felts

    Aug 18th, 2011

    i disagree. my round belly is not helping me get chicks.

  10. Jeffrey

    Aug 18th, 2011

    I dunno… some of the examples are pretty extreme. Comparing scissors to a beach ball is like comparing an active volcano to a swimming pool, asking “which one would you rather be submerged in?” and concluding that people prefer cool to warm.

    I also think that curved lines in flow diagrams will create bias, so that’s not very useful – regardless of how much easier on the eyes it may be. overall, this is interesting food for thought, but not nearly as concrete as it’s presented.

    • anthony

      Aug 19th, 2011

      I agree that the scissors is not the best example to use because it has sharp blade. I have changed the scissors to a fork, but the premise still holds – we tend to avoid sharp corners because growing up we have associated sharp objects with pain and danger.

      • Mike

        Aug 19th, 2011

        Fork vs. Beach Ball is still a pretty far stretch. Perhaps, Fork vs. Spoon/Spork would be more realistic. They both kitchen utensils, made of the same material and still hold the sharp vs. rounded argument. However, I don’t think any parent would choose one over the other when it comes to a toddler/child playing with either, since we’re conditioned not to play with silverware, so I suppose this argument is fairly moot with these examples.

        • Dan Eastwell

          Nov 10th, 2011

          Anthony – you’re a scientist, change one parameter if you’re testing/comparing. Your example should be a rounded cornered table vs a sharp cornered table. Bringing children into it is needlessly alarmist for an article with a solid foundation – you’re not concerned with children’s responses to corners in interface design.

          • Nathan

            Feb 1st, 2012

            I agree Dan. Whilst I appreciate the thought behind this it reads as if the conclusion has been made before the research and the article written to match.

            Comparing forks and beach balls? What about comparing a cardboard box and a cannon ball? Which does your child prefer to play with?

            To successfully argue this point, I think you need to challenge your preconceptions. If corners are bad and to be avoided etc, why are they still used so often in packaging, architecture etc? (I’m not answering it here for you and its likely due to cost efficiency over anything else) but the fact that you haven’t challenged your own thinking feels like the perfect opportunity for a follow up article.

    • DeD

      Aug 20th, 2011

      Jeffrey point is extremely important. The author is not comparing two similar shapes and concluding the round is preferable. He is comparing a complex shape with a simple one.

    • agentfin

      Sep 26th, 2011

      I’m interested that no one has been talking about the implied movement that the rounded connectors on the flowchart include. Certainly, informed choice is important. Always using squared off sharp corners is lazy, as is always using rounded corners. A careful reading of intended connections as well as some pretty damned basic A/B testing will result in stronger, more meaningful design.

      Personally, I am very glad that my knife company has not taken “sharp corners bad” as dogma. I find their knife designs aesthetically pleasing as well as utile.

      Another point [hehe] . . . the circle vs star is not a ‘pointy/round’ issue, but one of noise. The points all form an implied circle. If that circle is the information that needs to be communicated, then a circle should be drawn. If the point is to draw a star, then a circle will be an incorrect portrayal.

  11. dmitri

    Aug 18th, 2011

    Wow, totally makes sense!

    And the funny part is that form on this site for leaving a comment uses a sharp corners! :-)

  12. Hoopz

    Aug 18th, 2011

    People should not just be talking about how things should be rounded, but also *how* things should be rounded. And it doesn’t just apply to shapes, it applies to e.g. animation timing curves and gradients as well.

    Our eyes emphasize all discontinuities, whether it be shape, velocity, curvature or luminance. As a designer, it is your job to smooth them out.

    Unfortunately, this requires a basic understanding of calculus to truly grok.

    • Ned Horvath

      Aug 19th, 2011

      Actually, as a designer your job is to smooth out what should flow and draw attention where it needs to focus. Don’t ask me to pick the marshmallow-shaped tiger out of a pile of marshmallows.

  13. Rishi

    Aug 18th, 2011

    this is an awesome blog post. The organizational diagram with rounded corners blew my mind.

  14. Pablo

    Aug 18th, 2011

    I agree with @Jeffrey on both points, but will add that I prefer the non-rounded corner flow diagram in the example. The straight lines are easier to process because, as pointed out, the curves create unwanted bias. The burden is then on the viewer to filter out the curves in order to interpret the diagram flow.

    I do agree however with the other ideas in general that a curved box is easier on the eye. But the flow diagram was not a great example.

  15. Harry Feltersnatch

    Aug 19th, 2011

    This website only has rounded corners on this button below.

  16. Greg

    Aug 19th, 2011

    Using Firebug to make the comment boxes have rounded corners (say 10px radius) does feel easier on the eye strangely enough! ;-)

    Adding a slight shadow also makes it easier……I’ll stop redesigning your site now, because at the end of the day, what do I know!

  17. Patent Advisor

    Aug 19th, 2011

    You should patent this.

  18. Mentis

    Aug 19th, 2011

    We want rounded corner table tennis. Not because it is better to play, but because it is easy on eyes of spectators.

  19. Matt Willett

    Aug 19th, 2011

    Google could take not of this for pretty much all of their user interface design.

    Just a little bit of care for all those sharp edges would make my eyes feel good!

  20. Bevan

    Aug 19th, 2011

    Agree with Jeffrey – the beach ball vs scissors is not really helping the argument here. Maybe we are predisposed to chose soft items over hard items. Change the scissors to a piece of foam cut in the shape of scissors and the rhetorical question no longer makes the point…..so to speak.

  21. frank

    Aug 19th, 2011

    That starburst at the beginning of the article is vibrating like all hell, while the circle is just sitting there. Hard to take my eyes off the burst. I get the inoffensive, safe component to curves but where appropriate those spikes scream “Look at me!”

  22. Gif

    Aug 19th, 2011

    The rounded path is worse as it promotes your eye to choose B because of the path. The proper UX would be for both B and C do have equal chance of being next, but the rounded one is misleading

  23. person287

    Aug 19th, 2011

    Totally agree. I just started putting ads on my website and I started off with just the normal squares, and they looked really ugly. When I changed them to just slightly rounded corners they started to look a lot better. You can see at http://mediamonstrosity.com/#ads , and that way I don’t think they look too bad.

    Ed

  24. Chris

    Aug 19th, 2011

    hard corners also take more implicit resources because every time a line ends abruptly, we must decide if that line is blocked by a closer object (meaning the line actually continues) or if does actually bends 90 degrees and go the other way.
    It’s an awful idea to use non-rounded rectangles if the background color isn’t different.
    This is explained perfectly in the book Visual Intelligence by Donald Huffman.

  25. Eben Visher

    Aug 19th, 2011

    Thanks! I really enjoyed your article. Thanks for doing the work of creating it.

  26. Don

    Aug 19th, 2011

    Apparently Steve Jobs had this insight in 1981.

    http://www.folklore.org/StoryView.py?story=Round_Rects_Are_Everywhere.txt

    Steve suddenly got more intense. “Rectangles with rounded corners are everywhere! Just look around this room!”. And sure enough, there were lots of them, like the whiteboard and some of the desks and tables. Then he pointed out the window. “And look outside, there’s even more, practically everywhere you look!”

  27. AJ

    Aug 19th, 2011

    I did find the org chart example opposite to what the author conveys. I found the rounded corner one to be misleading that one child has more weight over the other.

  28. Pete

    Aug 19th, 2011

    The flowchart example only needs to be redrawn so that the junction is symmetrical (resembling a curly bracket “{” rotated 90° clockwise) and the bias of A to B would be removed making the two diagrams equivalent again.

  29. Matthew Frederick

    Aug 21st, 2011

    Flowchart example with bias-free connections:

    http://imgur.com/omqex

  30. Marie-Pier

    Aug 22nd, 2011

    Great article. I wonder if round or sharp edge corners are perceived the same way for humans living in tribes (Papua New Guinea for exemple) than ones living in industrialized area.

  31. Brian B

    Aug 24th, 2011

    I think another factor is that we use our eyes to perceive these objects, and as stated before, sharp edges are pointy and can cause rips and tears.

    Considering how delicate and gentle (gelatinous) our eyes are, the very thought of looking at something which could injure such an important organ on the human body may cause rejection.

    Possibly a self-defense mechanism of the eye?

    Just a thought…

  32. Maayan M

    Sep 12th, 2011

    deciding between rounded or not rounded corners should be related to content – to the atmosphere your website is giving the user.

    so I agree in general with the associations to rounded and not rounded corners, but not to the “always choose rounded corners” or “rounded corners – good, not rounded – bad” notion i’m getting from this article.

  33. me

    Oct 25th, 2011

    Yeah, I remember how the Facebook people LOVED rounded corners… NOT.

  34. Alessandro Mingione

    Nov 8th, 2011

    Unfortunately this is just pure theory, it would be cool to make an experiment!

    • anthony

      Nov 8th, 2011

      No, it’s not pure theory. It’s pure truth. There are studies and research that justify the claim that you can find in the references section at the bottom of the article.

      Your feeling of skepticism has nothing to do with what’s true and what’s not. Truth does not care for individual human feelings.

  35. Long

    Nov 8th, 2011

    This is comparing apples to oranges. The designer should be knowledgable enough to understand what fits the design and the concept the best at the moment. It’s almost unnecessary to write an article to talk about corners.

  36. Jonathan

    Nov 8th, 2011

    I wish I could read these great comments but I can’t focus on them because of their straight edge containers! :p

    Good article with good points. But in the end, straight edge has its place and rounded edge has its own place. There is no end all be all.

  37. bah

    Nov 8th, 2011

    And another design article full of opinions being pushed as facts. When something is “in” like rounded corners, you all will do anything to justify it.

  38. DaemonK

    Nov 10th, 2011

    Thanks for a great post.

    However, I wouldn’t say that round corners are always better. Just look at Microsoft’s Metro UI. It’s clean and beautiful, while many of its elements (along with the basic ‘grid’ of tiles) have sharp corners.

  39. Paul Hudson

    Dec 6th, 2011

    Brilliant! This sort of analytical detail where design can be examined in the minutiae is exactly why I’m so passionate about this industry.

    Great job!

  40. Will Drotar

    Jan 9th, 2012

    Do you have any examples of high-content websites that use rounded elements and borders effectively? Most of the high traffic sites are still very synthetic and straight-laced with box frames.

    It looks great but it’s hard to make it subtle and not distracting.

  41. jack

    Jan 16th, 2012

    Sometimes adding rounded corners makes such a huge difference I surprise myself. it’s amazing what a little thing can do.

  42. DesignToads

    Feb 27th, 2012

    I feel like I’m seeing less and less rounded edges and more squares in websites. Do rounded edges look a little, “2005″ to anyone else?

  43. Just-for-thought

    Mar 17th, 2012

    Imaging designing a new car with sharp corners…if people avoid these maybe we would have car accidents anymore. Problem would be no one would buy one due to people preferring rounded corners…then again Volvo butter boxes are still on the road.

  44. Brain

    May 8th, 2012

    I can see the advantage of rounding boxes on a button, else where is design and functionality. We can not eliminate sharped corners if we want to stack boxes, rounding corners will create instability. So the article refers to digital design not real world design, therefore comparing scissors to balls or forks is kind of out of scope here. I think therefore I exists… I think.

  45. snort

    May 9th, 2012

    Just wanted to point out that the first two diagrams are not necessarilly semantically equivalent. If these are railroad diagrams, for instance, the rounded diagram indicates that something can move from A to B and from B to C, but not directly from A to C. This is very useful, but designers should recognize that subtleties like that can be very important, especially in technical diagrams.

  46. Michael Shelley

    Aug 13th, 2012

    this is cool and exactly what we were all thinking. Sharp objects hurt. If it wasn’t for those pesky ie8 users we would all be so happy

  47. Alan S

    Aug 30th, 2012

    I don’t think rounded edges are for looks only. Objects shaped with sharp edges like a rectangular iphone must be rounded or else it could poke your eyes out. Engineers will round an edge for safety reasons. If you look closely even the sharpest edge in most designs will be in reality rounded, not for aesthetic reasons, just for your safety.

  48. MatusT

    Sep 4th, 2012

    If rounded corners are better than why did microsoft make everything rectangular in their Metro interface? They for sure have some UX/UI guys who know what they do and know about this(maybe even THIS article) and yet they choose rectangles, sharp corners everywhere. Can anyone explain?

  49. Simon

    Oct 4th, 2012

    Which diagram is easier for your eyes to follow? I would say the one with the corners! Also, the diagram with the rounded corners infers that route a>b is more important than route a>c

  50. Anna Kitowska

    Mar 25th, 2013

    I have to admit that the spoon vs fork example would work better (and cause less controversy) when it comes to the “what would you want your children to play with” example. The example with rounded/sharp-edged forms, however, was absolutely interesting.

Leave a Comment