{"id":1271,"date":"2023-12-12T02:38:33","date_gmt":"2023-12-12T02:38:33","guid":{"rendered":"https:\/\/international.binus.ac.id\/graphic-design\/?p=1271"},"modified":"2023-12-13T02:41:03","modified_gmt":"2023-12-13T02:41:03","slug":"the-tyranny-of-consistency","status":"publish","type":"post","link":"https:\/\/international.binus.ac.id\/graphic-design\/2023\/12\/12\/the-tyranny-of-consistency\/","title":{"rendered":"The Tyranny of Consistency"},"content":{"rendered":"
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
<\/i><\/p>\n

by Robert Stribley<\/span><\/h3>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/section>\n<\/div>\n<\/div>\n
\n
\n
\n
\"\"<\/div>\n<\/div>\n
\n
\n
\n

Consistency is helpful as a tool for designing user-friendly experiences. Until it isn\u2019t.<\/p>\n

\n
\n
\n
\n
\n
\n
\n
\n
<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n
\n
\n

In a\u00a0recent post on LinkedIn<\/a>, design system consultant Brad Frost referenced\u00a0Google\u2019s notoriously baffling 2020changes<\/a>\u00a0to the icons for its popular apps, simply noting, \u201cAll this time later, I still consider this decision to be a big mistake.\u201d Erica Hall, co-founder of Mule Design commented beneath: \u201cFoolish consistency. I hate it.\u201d<\/p>\n

\"\"<\/a><\/figure>\n

In 2020, Google changed the icons for their most popular apps from the ones in the top row to the ones in the bottom. Some confusion ensued.<\/em><\/p>\n

I agree. The problem is Google\u2019s updated icons are more consistent to a fault: You can no longer distinguish between them quickly at a scan.<\/p>\n

I often refer to \u201cthe tyranny of consistency\u201d (with tongue somewhat in cheek) in my UX classes. My takeaway there is this:<\/p>\n

\n

Consistency is an important but sometimes over-rated tool. It\u2019s key in maintaining a coherent experience. But develop an eye to know when to break from it.<\/p>\n<\/blockquote>\n

To be sure then, in principle, consistency does help contribute to maintaining cohesive user experiences, but we also need to recognize that forcing things to fit sometimes actually undermines usability. Spotting those moments and determining how best to articulate why they are a problem is its own skill.<\/p>\n

I had been grappling with this dynamic when occasionally encountering situations with clients, where they insisted that something be changed in our designs \u201cto be consistent,\u201d though I knew that \u201cconsistent\u201d in these specific situations was not congruent with \u201cusable.\u201d Sometimes, consistency becomes a blunt tool: Like trying to sledgehammer a square peg into a round hole.<\/p>\n

\n

\u201cConsistency is a tool, not a rule.\u201d \u2014 John Musci, Senior Content Strategist, Microsoft<\/p>\n<\/blockquote>\n

I had been joking about this \u201ctyranny of consistency\u201d for several years. I even presented on it within a larger talk entitled \u201cEverything Is Not Important<\/a>\u201d at SXSW in 2013. So I was much relieved to eventually discover that voices in design much greater than mine agreed.<\/p>\n

For example, in Steve Krug\u2019s wonderful book\u00a0Don\u2019t Make Me Think<\/em><\/a>, he simply concludes that \u201cClarity trumps consistency.\u201d<\/p>\n

He explains this principle in some detail:<\/p>\n

\n

You often hear consistency cited as an absolute good. People win a lot of design arguments just by saying \u201cWe can\u2019t do that. It wouldn\u2019t be consistent.\u201d<\/p>\n

Consistency is always a good thing to strive for within your site or app. If your navigation is always in the same place, for instance, I don\u2019t have to think about it or waste time looking for it. But there will be cases where things will be clearer if you make them slightly inconsistent.<\/p>\n<\/blockquote>\n

That was my experience, too. When folks bring up consistency, they may deploy it as a conversation ender, as if they\u2019ve just achieved checkmate. But, as Krug concludes, \u201cIf you can make something significantly clearer by making it slightly inconsistent, choose in favor of clarity.\u201d<\/p>\n

In 2018, Jared Spool wrote a whole piece on the topic, too. \u201cConsistency in Design Is the Wrong Approach<\/a>,\u201d his title declared, which may have prompted some to catch their breath.<\/p>\n

He explained his point, however, saying that rather than asking if something is consistent:<\/p>\n

\n

Instead, the right question is, \u201cWill the user\u2019s current knowledge help them understand how to use what I\u2019m designing?\u201d Current knowledge is the knowledge the user has when they approach the design. It\u2019s the sum of all their previous experiences with relevant products and designs.<\/p>\n<\/blockquote>\n

Jared used the example of Avis using asterisks on their site to highlight optional form fields instead of mandatory ones since optional fields accounted for only 10 percent of the fields on the site. This decision meant Avis labeled fields in a way that was \u201cinconsistent\u201d with other sites but made sense (and was consistent) in the context of their own.<\/p>\n

As our above conversation on LinkedIn continued, too, I loved how John Musci, a Senior Content Strategist with Microsoft, summed up the topic: \u201cConsistency is a tool, not a rule.\u201d<\/p>\n

A use case comes to mind.<\/p>\n

Steve Krug used the placement of navigation as an example, and he\u2019s right. You wouldn\u2019t want to change the placement of your nav in different places on your site. That could prove very disorienting to visitors attempting to navigate the experience. But consider the appearance of individual nav elements: Do they all have to be consistent?<\/p>\n

Back in the day, we used to design website dropdown menus with incredible consistency: We needed them to be the same width, maybe even the same length, and contain the same font sizes and colors. That made sense on a young(ish) web, where slow internet speeds prevented us from implementing more complex interactions and navigational styles on a site.<\/p>\n

It\u2019s not\u00a0too<\/em>\u00a0uncommon to find this sort of navigation on the web. Here\u2019s a fairly standard \u201cold school\u201d example from the current Nielsen Norman Group site, for example. It\u2019s simple. It works. It\u2019s fine.<\/p>\n

\"\"<\/a><\/figure>\n

Activated main nav dropdown on the Nielsen Norman Group website<\/em><\/p>\n

A few years ago, however, we started to create what we then called \u201cmega dropdowns\u201d on websites, which could include much more helpful information, allowing visitors to a website, for example, to compare products within a navigational structure without even leaving the page they\u2019re on. That meant that every dropdown also need not necessarily be laid out the same way, nor even have the same dimensions. That\u2019s not to say they couldn\u2019t still include some consistencies of font and color, etcetera, but different patterns within a navigation structure could offer different value.<\/p>\n

Look at how these three dropdowns are laid out very differently on the Mercedes-Benz USA site, for example. The first one allows you to compare models at high level by appearance and starting price anywhere on the site without leaving the page you\u2019re on.<\/p>\n

\"\"<\/a><\/figure>\n

The Vehicles dropdown allows users to compare vehicles by price within a body style before continuing to Build a vehicle or review specific Models. Note the activated Models dropdown under the EQB SUV.<\/em><\/p>\n

\"\"<\/a><\/figure>\n

The Shopping dropdown lays out specific tools by category, which Mercedes-Benz wanted to highlight, plus promotions for special offers and to Find Your Perfect Vehicle.<\/em><\/p>\n

\"\"<\/a><\/figure>\n

The My Account dropdown differs from the other dropdowns in its dimensions, layout and background color.<\/em><\/p>\n

Another place I\u2019ve seen consistency become an issue is with screen templates. We should design such templates so they\u2019re scalable to meet the needs of each screen, meaning that every module need not be used for the screen to go live. That means allowing for screens to not necessarily look precisely the same, just so they all look \u201cconsistent.\u201d That seems pretty basic now, admittedly, but it\u2019s still not uncommon to find websites or applications with empty modules acting as containers for missing data or coming content in order to maintain some sort of needless \u201cconsistency.\u201d With that in mind, you certainly don\u2019t want to labor to create potentially anemic content just to ensure every screen or element is \u201cconsistently\u201d populated.<\/p>\n

Remember: Tool, not rule!<\/p>\n<\/div>\n

Source: The Tyranny of Consistency – UX Magazine<\/p>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

by Robert Stribley Consistency is helpful as a tool for designing user-friendly experiences. Until it isn\u2019t. In a\u00a0recent post on LinkedIn, design system consultant Brad Frost referenced\u00a0Google\u2019s notoriously baffling 2020changes\u00a0to the icons for its popular apps, simply noting, \u201cAll this time later, I still consider this decision to be a big mistake.\u201d Erica Hall, co-founder […]<\/p>\n","protected":false},"author":41,"featured_media":1272,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2],"tags":[],"class_list":["post-1271","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-articles"],"_links":{"self":[{"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/posts\/1271"}],"collection":[{"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/users\/41"}],"replies":[{"embeddable":true,"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/comments?post=1271"}],"version-history":[{"count":1,"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/posts\/1271\/revisions"}],"predecessor-version":[{"id":1273,"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/posts\/1271\/revisions\/1273"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/media\/1272"}],"wp:attachment":[{"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/media?parent=1271"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/categories?post=1271"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/international.binus.ac.id\/graphic-design\/wp-json\/wp\/v2\/tags?post=1271"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}