Rounded Corners Are Cognitively Cheaper, Yet Facebook Drops Them Anyways: Image Source: UI & US

Yesterday Facebook announced that it decided to drop all rounded corners in their latest UI refresh, sacrificing those cheerful corner radii on most of its interface modules for the more severe but coder-friendly squared off look. It’ s almost like they’re declaring the end of web 2.0, once and for all. Keith Lang’s UI & Us has consolidated a terrific history of where this rounded rectangle thing started in the first place… with the original Macintosh apparently. Folklore has it that Steve Jobs pointed out to Bill Gates that the real world is full of rectangles and squarish shapes that have rounded corners -stop signs, coffee tables, beverage coasters – so why not user interfaces? Right angled shapes are computationally efficient to draw, but let’s face it – you can put an eye out with one of those things if you’re not careful. And that’s exactly the kind of human-centric thinking that has Apple rounding the corners on everything from your iPhone to those error message pop-ups that you’re getting in iTunes. Interestingly, Lang makes a cognitive processing argument for the benefits of the roundedness, quoting author Jurg Nanni. “A rectangle with sharp edges takes indeed a little bit more cognitive visible effort than for example an ellipse of the same size. Our fovea is even faster in recording a circle. Edges involve additional neuronal image tools. The process is therefore slowed down.”

Linking aesthetics to cognition is not a stretch. We often express a qualitative preference for the look of something that is driven by something more elemental in our biology and our evolutionary need to survive. For instance, we see and process information better when it’s portrayed in color combinations that are found together in nature. I quote a good piece from 2003 by Luke Wroblewski. “[colors] found in nature are often less saturated and more pleasing to the eye than their artificial counterparts. As a result, they allow users to focus on interactions, and not be distracted by overly bright hues.” In fact there is a whole book about this called Evolutionary Aesthetics, which makes the case that our aesthetic preferences are not only driven by evolution, but that there are huge differences in what we visually respond to based on whether we’re male or female and in a precopulatory or postcopulatory state. I’m sensing a whole interesting new category of design research on the horizon here.

Trendy No More - Say Goodbye to Your Rounded Corners in Facebook

So CSS3 is including a property for rounded corners and I’m sure browsers will support this soon. This will relieve the technical “expense” of how they are rendered in browsers now (via the use of image files.) But do we want them? Are they really there to provide a more “organic context” (as argued in this piece four years ago on basement.org), or are they just trendy? I’m sure bell-bottom trousers were more efficient for us in terms of neuronal image processing but that didn’t keep them around any longer, did it? Personally I think there’s something else going on here. We have clearly established a design idiom over the years that elements with rounded corners are things you are supposed to interact with… e.g. rounded corners are a functional cue. Functional cues help us put some space between the kind of design choices we make for an interface versus those we make for print. Think about the kinds of things that consistently don’ t have rounded corners on the web – ads and photographs. Now think about the kinds of things that do – buttons, modules containing links and form elements, navigation menus, and tabs. We don’t want our users tuning out areas of the screen just because it doesn’t look like something that is interactive. For designers, rounded corners have played a tiny role in managing that issue. Plus, they just look so damn cool in that Web 2.0 way, don’t you think?