{"id":10286,"date":"2015-12-02T20:53:37","date_gmt":"2015-12-03T04:53:37","guid":{"rendered":"http:\/\/proxystudio.uxpin.com\/?p=10286"},"modified":"2021-07-23T05:53:50","modified_gmt":"2021-07-23T12:53:50","slug":"kill-friction-before-it-kills-your-ux","status":"publish","type":"post","link":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/","title":{"rendered":"Kill Friction Before It Kills Your UX"},"content":{"rendered":"<p>It\u2019s been about 15 years since Steve Krug first advised us <a href=\"http:\/\/www.amazon.com\/Dont-Make-Me-Think-Usability\/dp\/0321344758\" target=\"_blank\" rel=\"noopener noreferrer\">to not make users think<\/a>.<\/p>\n<p>Friction is anything that prevents users from accomplishing their goals \u2014 confusion, distraction, hesitation, or anything else that forces them to think.<\/p>\n<p>Let\u2019s take a refresher course on how to smooth over friction points in your design.<\/p>\n<h2>Know Your Enemy: Identifying Friction<\/h2>\n<p>What Krug was describing is academically called \u201ccognitive load,\u201d and in UX design refers to taxing the user\u2019s attention and brain. Of course some cognitive load is necessary (we\u2019ll explain later in the post), but you generally want to minimize thinking as much as possible.<\/p>\n<p><a href=\"http:\/\/www.nngroup.com\/articles\/minimize-cognitive-load\/\" target=\"_blank\" rel=\"noopener noreferrer\">The Nielson Norman Group explains cognitive load<\/a> by dividing it into two types, intrinsic and extraneous.<\/p>\n<p>Intrinsic refers to the thought involved in accomplishing a goal, i.e. \u201cIf I click on the \u2018Categories\u2019 tab will I find the content I want?\u201d Extraneous is, essentially, everything else, the friction, i.e., \u201cWhere is the categories tab? I can\u2019t find it.\u201d<\/p>\n<p>Typically, unwanted friction manifests itself as:<\/p>\n<ul>\n<li>Busy visuals that confuse or distract<\/li>\n<li>Inconsistency (\u201cWhy doesn\u2019t the button look like it did on the last page?\u201d)<\/li>\n<li>Unnecessary decisions and actions<\/li>\n<li>Unfamiliar features or functions<\/li>\n<\/ul>\n<p>Friction slips in accidentally, which is why your designs need to always be externally consistent (in line with user expectations and previous knowledge) and internally consistent (good visual hygiene across pages).<\/p>\n<h2>How to Smooth Out Friction<\/h2>\n<p>We explain more how to target more specific forms of friction in <a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/interaction-design-best-practices-intangibles\/\" target=\"_blank\" rel=\"noopener noreferrer\">Interaction Design Best Practices: Volume 2<\/a>, but here are some general tips that can help any UX project.<\/p>\n<h3>1. Reveal redundancies by listing out user flow steps.<\/h3>\n<p>List out each individual action needed to accomplish a task.<\/p>\n<p>For example, logging in sometimes requires:<\/p>\n<ol>\n<li>Click to open login window<\/li>\n<li>Click to enter username input field<\/li>\n<li>Enter username<\/li>\n<li>Click or tab to enter password input field<\/li>\n<li>\u2026 etc.<\/li>\n<\/ol>\n<p>In those first five steps, you&#8217;ll notice some redundancies.<\/p>\n<p>What if the cursor started in the username input field when the login window opened? What if the login window opened up automatically?<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-10287\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image003-1024x560.png\" alt=\"Screenshot of Reddit\u2019s login screen\" width=\"720\" height=\"394\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image003-1024x560.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image003-549x300.png 549w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image003.png 1279w\" sizes=\"auto, (max-width: 720px) 100vw, 720px\" \/><\/p>\n<p><i>Photo credit: <\/i><a href=\"https:\/\/www.reddit.com\/\" target=\"_blank\" rel=\"noopener noreferrer\"><i>Reddit<\/i><\/a><\/p>\n<p><a href=\"https:\/\/www.reddit.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Reddit<\/a> tackles friction in exactly this way: whenever a user tries to complete an action like commenting that requires logging in, the login window opens automatically. Frequent users can even save their information, reducing the login process to only two clicks.<\/p>\n<p>Notice however, that we haven\u2019t just shortened the number of steps. Each step is also effortless, which is just as important.<\/p>\n<p>When it came time for us to design the signup page for <a href=\"https:\/\/www.uxpin.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">UXPin<\/a>, we applied the same type of thinking. You\u2019ll notice that the form only asks for an email, since you can set your password once you\u2019ve redirected inside the app.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-10292\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/Screen-Shot-2015-12-02-at-8.48.32-PM.png\" alt=\"Screenshot of UXPin\u2019s signup form\" width=\"725\" height=\"68\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/Screen-Shot-2015-12-02-at-8.48.32-PM.png 725w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/Screen-Shot-2015-12-02-at-8.48.32-PM-700x66.png 700w\" sizes=\"auto, (max-width: 725px) 100vw, 725px\" \/><\/p>\n<p><em>Photo credit: <a href=\"https:\/\/www.uxpin.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">UXPin<\/a><\/em><\/p>\n<h3>2. Use recognizable UI patterns<\/h3>\n<p>Every time the user must learn how something new works, it creates friction. For the sake of external consistency, use as many appropriate UI patterns as possible.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-10288\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/Screen-Shot-2015-12-02-at-8.38.20-PM-1024x632.png\" alt=\"Screenshot of UXPin user interface design patterns\" width=\"722\" height=\"445\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/Screen-Shot-2015-12-02-at-8.38.20-PM-1024x632.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/Screen-Shot-2015-12-02-at-8.38.20-PM-486x300.png 486w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/Screen-Shot-2015-12-02-at-8.38.20-PM-290x180.png 290w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/Screen-Shot-2015-12-02-at-8.38.20-PM.png 1344w\" sizes=\"auto, (max-width: 722px) 100vw, 722px\" \/><\/p>\n<p><em>Photo credit: Patterns<\/em><\/p>\n<p>Recognizable conventions, such as an envelope icon representing email, require no extra thought for the users. For example, the default settings, guided actions, and stepped forms described in <a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/web-ui-design-best-practices\/\" target=\"_blank\" rel=\"noopener noreferrer\">Web UI Design Best Practices<\/a> are especially useful for reducing friction.<\/p>\n<p>Recognition also applies to <a href=\"http:\/\/unmatchedstyle.com\/news\/microcopy-why-is-it-so-important.php\" target=\"_blank\" rel=\"noopener noreferrer\">microcopy<\/a>, where clear text like \u201cSubmit\u201d work better than something clever like \u201cgo ahead,\u201d which may cause momentary confusion.<\/p>\n<p>Clarity before cleverness. Always.<\/p>\n<\/section><section class=\"related-books-section\"><h3>Grab design ebooks created by best designers<\/h3><p class=\"section-desc\">All for free<\/p><ul class=\"related-books-list\"><li><figure><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/curated-interaction-design-animations\/\" class=\"action-get-ebook\" data-name=\"Interaction Design &#038; Complex Animations\"><img loading=\"lazy\" decoding=\"async\" width=\"262\" height=\"375\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Interaction-Design-Complex-Animations.png\" class=\"attachment-ebook-cover size-ebook-cover wp-post-image\" alt=\"Interaction Design Complex Animations\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Interaction-Design-Complex-Animations.png 262w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Interaction-Design-Complex-Animations-210x300.png 210w\" sizes=\"auto, (max-width: 262px) 100vw, 262px\" \/><\/a><\/figure><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/curated-interaction-design-animations\/\" class=\"btn btn-ghost action-get-ebook\" data-name=\"Interaction Design &#038; Complex Animations\">Download<\/a><\/li><li><figure><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/web-ui-design-best-practices\/\" class=\"action-get-ebook\" data-name=\"Web UI Design Best Practices\"><img loading=\"lazy\" decoding=\"async\" width=\"262\" height=\"375\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-UI-Design-Best-Practices.jpg\" class=\"attachment-ebook-cover size-ebook-cover wp-post-image\" alt=\"Web UI Design Best Practices\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-UI-Design-Best-Practices.jpg 262w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-UI-Design-Best-Practices-210x300.jpg 210w\" sizes=\"auto, (max-width: 262px) 100vw, 262px\" \/><\/a><\/figure><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/web-ui-design-best-practices\/\" class=\"btn btn-ghost action-get-ebook\" data-name=\"Web UI Design Best Practices\">Download<\/a><\/li><li><figure><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/ux-design-trends-2015-2016-digital-products\/\" class=\"action-get-ebook\" data-name=\"UX Design 2015&nbsp;&#038;&nbsp;2016\"><img loading=\"lazy\" decoding=\"async\" width=\"262\" height=\"375\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/book-knowledge-262x375.png\" class=\"attachment-ebook-cover size-ebook-cover wp-post-image\" alt=\"book knowledge\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/book-knowledge-262x375.png 262w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/book-knowledge-210x300.png 210w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/book-knowledge.png 332w\" sizes=\"auto, (max-width: 262px) 100vw, 262px\" \/><\/a><\/figure><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/ux-design-trends-2015-2016-digital-products\/\" class=\"btn btn-ghost action-get-ebook\" data-name=\"UX Design 2015&nbsp;&#038;&nbsp;2016\">Download<\/a><\/li><li><figure><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/web-ui-design-trends-2015-2016\/\" class=\"action-get-ebook\" data-name=\"Free Ebook: Web Design Trends 2016\"><img loading=\"lazy\" decoding=\"async\" width=\"262\" height=\"375\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-Design-Book-of-Trends-2015-2016.png\" class=\"attachment-ebook-cover size-ebook-cover wp-post-image\" alt=\"Web Design Book of Trends 2015 2016\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-Design-Book-of-Trends-2015-2016.png 262w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-Design-Book-of-Trends-2015-2016-210x300.png 210w\" sizes=\"auto, (max-width: 262px) 100vw, 262px\" \/><\/a><\/figure><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/web-ui-design-trends-2015-2016\/\" class=\"btn btn-ghost action-get-ebook\" data-name=\"Free Ebook: Web Design Trends 2016\">Download<\/a><\/li><\/ul><\/section><section class=\"related-books-section-single\"><section class=\"post-content-wrapper\"><figure><img loading=\"lazy\" decoding=\"async\" width=\"262\" height=\"375\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-Design-Book-of-Trends-2015-2016.png\" class=\"attachment-ebook-cover size-ebook-cover wp-post-image\" alt=\"Web Design Book of Trends 2015 2016\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-Design-Book-of-Trends-2015-2016.png 262w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/Web-Design-Book-of-Trends-2015-2016-210x300.png 210w\" sizes=\"auto, (max-width: 262px) 100vw, 262px\" \/><\/figure><article><h3>Do you want to know more about UI Design?<\/h3><p>Download 'Free Ebook: Web Design Trends 2016' <span>FOR FREE!<\/span><\/p><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/web-ui-design-trends-2015-2016\/\" class=\"btn btn-flat btn-darker action-get-ebook\">Download e-book for free<\/a><\/article><\/section><a href=\"#closeEbookPanel\" class=\"icon-close action-close-ebook-panel\">Close<\/a><\/section><section class=\"post-content-wrapper\">\n<h3>3. Build navigation based on user research<\/h3>\n<p>A lot can go wrong with navigation, making it a nest of potential friction.<\/p>\n<p>While you can theorize the best navigation for ages, streamline the process by learning from users. The right user testing reveals how they inherently categorize and access information.<\/p>\n<p><a href=\"http:\/\/boxesandarrows.com\/card-sorting-a-definitive-guide\/\" target=\"_blank\" rel=\"noopener noreferrer\">Card sorting<\/a> is extremely effective for creating the site architecture based on natural thought patterns. Once you\u2019ve created the architecture, <a href=\"http:\/\/www.webcredible.com\/blog\/tree-testing-important-step-early-web-design-process\/\" target=\"_blank\" rel=\"noopener noreferrer\">tree testing<\/a> then helps you test your information pathways (both are explained more thoroughly in the <a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/guide-to-usability-testing\/\" target=\"_blank\" rel=\"noopener noreferrer\">Guide to Usability Testing<\/a>).<\/p>\n<h3>4. Chunk it out<\/h3>\n<p><a href=\"https:\/\/www.interaction-design.org\/literature\/book\/the-glossary-of-human-computer-interaction\/chunking\" target=\"_blank\" rel=\"noopener noreferrer\">Chunking<\/a> is the technique of grouping together visual elements to make their meaning more comprehensible.<\/p>\n<p>Below, <a href=\"https:\/\/www.etsy.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Etsy<\/a> showcases 16 different product images. Under different circumstances, this might overwhelm users, but by chunking them into groups of 4, they undercut the visual friction.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-10289\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image021-1024x398.png\" alt=\"Screenshot of Etsy\u2019s user interface\" width=\"720\" height=\"280\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image021-1024x398.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image021-700x272.png 700w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image021.png 1063w\" sizes=\"auto, (max-width: 720px) 100vw, 720px\" \/><\/p>\n<p><em>Photo credit: <a href=\"https:\/\/www.etsy.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Etsy<\/a><\/em><\/p>\n<p>Chunking works around the natural limitations of the human brain and memory retention \u2014 it\u2019s the same effect as breaking a 10-digit phone number into 3 \u201cchunks.\u201d It allows users to process the information by suggesting how each piece should be interpreted, and lets them skip over entire chunks that don\u2019t interest them.<\/p>\n<h2>Good Friction?<\/h2>\n<p>Before you wage all-out war on friction, keep in mind that, under the right circumstances, it can help.<\/p>\n<h3>1. Some work pays off<\/h3>\n<p>\u201cToo good to be true\u201d is a genuine threat to the UX of some products, so sometimes it pays to make your users \u201cwork for it.\u201d Look at sites based around browsing for content. Part of the thrill is sifting through the mediocre content to find and repost the gems.<\/p>\n<p>The process of discovery gives the users a sense of accomplishment, deepening their emotional investment.<\/p>\n<h3>2. Quality control<\/h3>\n<p>Another benefit of friction is filtering out irrelevant users \u2014 especially for sites where users generate the content.<\/p>\n<p>A more involved signup process also blocks off those that lack the level of commitment to reap the benefits of the full experience.<\/p>\n<p>Part of <a href=\"https:\/\/dribbble.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Dribbble<\/a>\u2019s appeal, for instance, is that the site is invite-only. Not only does the scarcity effect increase the perceived value, the additional friction also helps filter out low quality posts and potential spam.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-10290\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image031-1024x719.png\" alt=\"Screenshot of Dribbble\u2019s user interface\" width=\"721\" height=\"506\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image031-1024x719.png 1024w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image031-427x300.png 427w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image031.png 1448w\" sizes=\"auto, (max-width: 721px) 100vw, 721px\" \/><\/p>\n<p><i>Photo credit: <\/i><a href=\"https:\/\/dribbble.com\/\" target=\"_blank\" rel=\"noopener noreferrer\"><i>Dribbble<\/i><\/a><\/p>\n<h3>3. Saving users from themselves<\/h3>\n<p>Notice how the nuclear button is always protected by a key-activated cover? The same principle applies to UX design.<\/p>\n<p>For actions with severe consequences, some friction is not a bad idea. The \u201cUndo\u201d option is fine for reversing individual mistakes (e.g. unintentionally deleting a single account from your sales pipeline), but the \u201cConfirm\u201d window can offer a reflective pause before a possible cluster of mistakes (e.g. unintentionally deleting <i>your entire sales pipeline<\/i>).<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-10291\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image013.png\" alt=\"Screenshot of Salesforce\u2019s user interface\" width=\"720\" height=\"426\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image013.png 547w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/image013-506x300.png 506w\" sizes=\"auto, (max-width: 720px) 100vw, 720px\" \/><\/p>\n<p><i>Photo credit: <\/i><a href=\"http:\/\/www.salesforce.com\/salesforceiq\/overview\/\" target=\"_blank\" rel=\"noopener noreferrer\"><i>Salesforce IQ <\/i><\/a><\/p>\n<h2>Conclusion<\/h2>\n<p>We\u2019ve said it before, and we\u2019ll say it again: execute the fundamentals flawlessly.<\/p>\n<p>All the classic principles of UX design are naturally anti-friction, so fulfilling the basics already indirectly reduces friction. In particular, pay attention to the best practices for:<\/p>\n<ul>\n<li>Consistency \u2014 inconsistency creates confusion<\/li>\n<li>Visual hierarchy \u2014 guide users on the right path with visual cues<\/li>\n<li>Navigation \u2014 a lost user can\u2019t accomplish anything.<\/li>\n<\/ul>\n<p>For more help with friction, check out the free guides mentioned above.<\/p>\n<ul>\n<li><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/web-ui-design-best-practices\/\">Web UI Design Best Practices<\/a><\/li>\n<li><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/interaction-design-best-practices-intangibles\/\">Interaction Design Best Practices: Volume 2<\/a><\/li>\n<li><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/guide-to-usability-testing\/\">The Guide to Usability Testing<\/a><\/li>\n<\/ul>\n<p><a href=\"https:\/\/www.uxpin.com\/studio\/ebooks\/interaction-design-best-practices-tangibles\/\" target=\"_blank\" rel=\"noopener noreferrer\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-9650\" src=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/fb-book3.png\" alt=\"fb-book\" width=\"720\" height=\"303\" srcset=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/fb-book3.png 950w, https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/09\/fb-book3-700x295.png 700w\" sizes=\"auto, (max-width: 720px) 100vw, 720px\" \/><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>A practical refresher on how to reduce friction and when to add friction. Based on examples from Etsy, Salesforce IQ, Reddit and Dribbble. <\/p>\n","protected":false},"author":9,"featured_media":10293,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,4,6],"tags":[],"class_list":["post-10286","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","category-ui-design","category-ux-design"],"yoast_title":"","yoast_metadesc":"A practical refresher on how to reduce friction and when to add friction. Based on examples from Etsy, Salesforce IQ, Reddit and Dribbble.","acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.4 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Kill Friction Before It Kills Your UX | UXPin<\/title>\n<meta name=\"description\" content=\"A practical refresher on how to reduce friction and when to add friction. Based on examples from Etsy, Salesforce IQ, Reddit and Dribbble.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Kill Friction Before It Kills Your UX\" \/>\n<meta property=\"og:description\" content=\"A practical refresher on how to reduce friction and when to add friction. Based on examples from Etsy, Salesforce IQ, Reddit and Dribbble.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/\" \/>\n<meta property=\"og:site_name\" content=\"Studio by UXPin\" \/>\n<meta property=\"article:published_time\" content=\"2015-12-03T04:53:37+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-07-23T12:53:50+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/22606521084_bb98d8e46c_k.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2048\" \/>\n\t<meta property=\"og:image:height\" content=\"1365\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Jerry Cao\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jerry Cao\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/\"},\"author\":{\"name\":\"Jerry Cao\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e58da1b4c401eb288436977eb9810a18\"},\"headline\":\"Kill Friction Before It Kills Your UX\",\"datePublished\":\"2015-12-03T04:53:37+00:00\",\"dateModified\":\"2021-07-23T12:53:50+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/\"},\"wordCount\":1099,\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2015\\\/12\\\/22606521084_bb98d8e46c_k.jpg\",\"articleSection\":[\"Blog\",\"UI Design\",\"UX Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/\",\"name\":\"Kill Friction Before It Kills Your UX | UXPin\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2015\\\/12\\\/22606521084_bb98d8e46c_k.jpg\",\"datePublished\":\"2015-12-03T04:53:37+00:00\",\"dateModified\":\"2021-07-23T12:53:50+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e58da1b4c401eb288436977eb9810a18\"},\"description\":\"A practical refresher on how to reduce friction and when to add friction. Based on examples from Etsy, Salesforce IQ, Reddit and Dribbble.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2015\\\/12\\\/22606521084_bb98d8e46c_k.jpg\",\"contentUrl\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/wp-content\\\/uploads\\\/2015\\\/12\\\/22606521084_bb98d8e46c_k.jpg\",\"width\":2048,\"height\":1365,\"caption\":\"22606521084 bb98d8e46c k\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/blog\\\/kill-friction-before-it-kills-your-ux\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Kill Friction Before It Kills Your UX\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#website\",\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/\",\"name\":\"Studio by UXPin\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/#\\\/schema\\\/person\\\/e58da1b4c401eb288436977eb9810a18\",\"name\":\"Jerry Cao\",\"description\":\"Jerry Cao is a content strategist at UXPin where he gets to put his overly active imagination to paper every day. In a past life, he developed content strategies for clients at Brafton and worked in traditional advertising at DDB San Francisco. In his spare time he enjoys playing electric guitar, watching foreign horror films, and expanding his knowledge of random facts. Follow him on Twitter.\",\"sameAs\":[\"http:\\\/\\\/uxpin.com\"],\"url\":\"https:\\\/\\\/www.uxpin.com\\\/studio\\\/author\\\/jerrycao\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Kill Friction Before It Kills Your UX | UXPin","description":"A practical refresher on how to reduce friction and when to add friction. Based on examples from Etsy, Salesforce IQ, Reddit and Dribbble.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/","og_locale":"en_US","og_type":"article","og_title":"Kill Friction Before It Kills Your UX","og_description":"A practical refresher on how to reduce friction and when to add friction. Based on examples from Etsy, Salesforce IQ, Reddit and Dribbble.","og_url":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/","og_site_name":"Studio by UXPin","article_published_time":"2015-12-03T04:53:37+00:00","article_modified_time":"2021-07-23T12:53:50+00:00","og_image":[{"width":2048,"height":1365,"url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/22606521084_bb98d8e46c_k.jpg","type":"image\/jpeg"}],"author":"Jerry Cao","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Jerry Cao","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/#article","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/"},"author":{"name":"Jerry Cao","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e58da1b4c401eb288436977eb9810a18"},"headline":"Kill Friction Before It Kills Your UX","datePublished":"2015-12-03T04:53:37+00:00","dateModified":"2021-07-23T12:53:50+00:00","mainEntityOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/"},"wordCount":1099,"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/22606521084_bb98d8e46c_k.jpg","articleSection":["Blog","UI Design","UX Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/","url":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/","name":"Kill Friction Before It Kills Your UX | UXPin","isPartOf":{"@id":"https:\/\/www.uxpin.com\/studio\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/#primaryimage"},"image":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/#primaryimage"},"thumbnailUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/22606521084_bb98d8e46c_k.jpg","datePublished":"2015-12-03T04:53:37+00:00","dateModified":"2021-07-23T12:53:50+00:00","author":{"@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e58da1b4c401eb288436977eb9810a18"},"description":"A practical refresher on how to reduce friction and when to add friction. Based on examples from Etsy, Salesforce IQ, Reddit and Dribbble.","breadcrumb":{"@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/#primaryimage","url":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/22606521084_bb98d8e46c_k.jpg","contentUrl":"https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2015\/12\/22606521084_bb98d8e46c_k.jpg","width":2048,"height":1365,"caption":"22606521084 bb98d8e46c k"},{"@type":"BreadcrumbList","@id":"https:\/\/www.uxpin.com\/studio\/blog\/kill-friction-before-it-kills-your-ux\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.uxpin.com\/studio\/"},{"@type":"ListItem","position":2,"name":"Kill Friction Before It Kills Your UX"}]},{"@type":"WebSite","@id":"https:\/\/www.uxpin.com\/studio\/#website","url":"https:\/\/www.uxpin.com\/studio\/","name":"Studio by UXPin","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.uxpin.com\/studio\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.uxpin.com\/studio\/#\/schema\/person\/e58da1b4c401eb288436977eb9810a18","name":"Jerry Cao","description":"Jerry Cao is a content strategist at UXPin where he gets to put his overly active imagination to paper every day. In a past life, he developed content strategies for clients at Brafton and worked in traditional advertising at DDB San Francisco. In his spare time he enjoys playing electric guitar, watching foreign horror films, and expanding his knowledge of random facts. Follow him on Twitter.","sameAs":["http:\/\/uxpin.com"],"url":"https:\/\/www.uxpin.com\/studio\/author\/jerrycao\/"}]}},"_links":{"self":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/10286","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/comments?post=10286"}],"version-history":[{"count":1,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/10286\/revisions"}],"predecessor-version":[{"id":31020,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/posts\/10286\/revisions\/31020"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media\/10293"}],"wp:attachment":[{"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/media?parent=10286"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/categories?post=10286"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.uxpin.com\/studio\/wp-json\/wp\/v2\/tags?post=10286"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}