CINXE.COM

<!doctype html><html lang="en"><head><title data-rh="true">Understanding Good vs Bad UX Designs | by Nihal Abdul Bari | Medium</title><meta data-rh="true" charset="utf-8"/><meta data-rh="true" name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1,maximum-scale=1"/><meta data-rh="true" name="theme-color" content="#000000"/><meta data-rh="true" name="twitter:app:name:iphone" content="Medium"/><meta data-rh="true" name="twitter:app:id:iphone" content="828256236"/><meta data-rh="true" property="al:ios:app_name" content="Medium"/><meta data-rh="true" property="al:ios:app_store_id" content="828256236"/><meta data-rh="true" property="al:android:package" content="com.medium.reader"/><meta data-rh="true" property="fb:app_id" content="542599432471018"/><meta data-rh="true" property="og:site_name" content="Medium"/><meta data-rh="true" property="og:type" content="article"/><meta data-rh="true" property="article:published_time" content="2021-05-18T11:14:31.385Z"/><meta data-rh="true" name="title" content="Understanding Good vs Bad UX Designs | by Nihal Abdul Bari | Medium"/><meta data-rh="true" property="og:title" content="Understanding Good vs Bad UX Designs"/><meta data-rh="true" property="al:android:url" content="medium://p/7d710ef783b9"/><meta data-rh="true" property="al:ios:url" content="medium://p/7d710ef783b9"/><meta data-rh="true" property="al:android:app_name" content="Medium"/><meta data-rh="true" name="description" content="Understanding the difference between good and bad user experience design can be subjective and sometimes hard to notice. But I have some helpful tips that can help us understand what makes for a good…"/><meta data-rh="true" property="og:description" content="Understanding the difference between good and bad user experience design can be subjective and sometimes hard to notice. But I have some…"/><meta data-rh="true" property="og:url" content="https://nihxl.medium.com/understanding-good-vs-bad-ux-designs-7d710ef783b9"/><meta data-rh="true" property="al:web:url" content="https://nihxl.medium.com/understanding-good-vs-bad-ux-designs-7d710ef783b9"/><meta data-rh="true" property="og:image" content="https://miro.medium.com/v2/resize:fit:1200/1*-uQsCHsccSsMpmcO1-neig.jpeg"/><meta data-rh="true" property="article:author" content="https://nihxl.medium.com"/><meta data-rh="true" name="author" content="Nihal Abdul Bari"/><meta data-rh="true" name="robots" content="index,noarchive,follow,max-image-preview:large"/><meta data-rh="true" name="referrer" content="unsafe-url"/><meta data-rh="true" property="twitter:title" content="Understanding Good vs Bad UX Designs"/><meta data-rh="true" name="twitter:site" content="@Medium"/><meta data-rh="true" name="twitter:app:url:iphone" content="medium://p/7d710ef783b9"/><meta data-rh="true" property="twitter:description" content="Understanding the difference between good and bad user experience design can be subjective and sometimes hard to notice. But I have some…"/><meta data-rh="true" name="twitter:image:src" content="https://miro.medium.com/v2/resize:fit:1200/1*-uQsCHsccSsMpmcO1-neig.jpeg"/><meta data-rh="true" name="twitter:card" content="summary_large_image"/><meta data-rh="true" name="twitter:creator" content="@nihalerooth"/><meta data-rh="true" name="twitter:label1" content="Reading time"/><meta data-rh="true" name="twitter:data1" content="3 min read"/><link data-rh="true" rel="icon" href="https://miro.medium.com/v2/5d8de952517e8160e40ef9841c781cdc14a5db313057fa3c3de41c6f5b494b19"/><link data-rh="true" rel="search" type="application/opensearchdescription+xml" title="Medium" href="/osd.xml"/><link data-rh="true" rel="apple-touch-icon" sizes="152x152" href="https://miro.medium.com/v2/resize:fill:304:304/10fd5c419ac61637245384e7099e131627900034828f4f386bdaa47a74eae156"/><link data-rh="true" rel="apple-touch-icon" sizes="120x120" href="https://miro.medium.com/v2/resize:fill:240:240/10fd5c419ac61637245384e7099e131627900034828f4f386bdaa47a74eae156"/><link data-rh="true" rel="apple-touch-icon" sizes="76x76" href="https://miro.medium.com/v2/resize:fill:152:152/10fd5c419ac61637245384e7099e131627900034828f4f386bdaa47a74eae156"/><link data-rh="true" rel="apple-touch-icon" sizes="60x60" href="https://miro.medium.com/v2/resize:fill:120:120/10fd5c419ac61637245384e7099e131627900034828f4f386bdaa47a74eae156"/><link data-rh="true" rel="mask-icon" href="https://miro.medium.com/v2/resize:fill:1000:1000/7*GAOKVe--MXbEJmV9230oOQ.png" color="#171717"/><link data-rh="true" rel="preconnect" href="https://glyph.medium.com" crossOrigin=""/><link data-rh="true" id="glyph_preload_link" rel="preload" as="style" type="text/css" href="https://glyph.medium.com/css/unbound.css"/><link data-rh="true" id="glyph_link" rel="stylesheet" type="text/css" href="https://glyph.medium.com/css/unbound.css"/><link data-rh="true" rel="author" href="https://nihxl.medium.com"/><link data-rh="true" rel="canonical" href="https://nihxl.medium.com/understanding-good-vs-bad-ux-designs-7d710ef783b9"/><link data-rh="true" rel="alternate" href="android-app://com.medium.reader/https/medium.com/p/7d710ef783b9"/><script data-rh="true" type="application/ld+json">{"@context":"http:\u002F\u002Fschema.org","@type":"NewsArticle","image":["https:\u002F\u002Fmiro.medium.com\u002Fv2\u002Fresize:fit:1200\u002F1*-uQsCHsccSsMpmcO1-neig.jpeg"],"url":"https:\u002F\u002Fnihxl.medium.com\u002Funderstanding-good-vs-bad-ux-designs-7d710ef783b9","dateCreated":"2021-05-18T11:14:31.385Z","datePublished":"2021-05-18T11:14:31.385Z","dateModified":"2022-01-06T18:35:00.575Z","headline":"Understanding Good vs Bad UX Designs - Nihal Abdul Bari - Medium","name":"Understanding Good vs Bad UX Designs - Nihal Abdul Bari - Medium","description":"Understanding the difference between good and bad user experience design can be subjective and sometimes hard to notice. But I have some helpful tips that can help us understand what makes for a good…","identifier":"7d710ef783b9","author":{"@type":"Person","name":"Nihal Abdul Bari","url":"https:\u002F\u002Fnihxl.medium.com"},"creator":["Nihal Abdul Bari"],"publisher":{"@type":"Organization","name":"Medium","url":"https:\u002F\u002Fnihxl.medium.com\u002F","logo":{"@type":"ImageObject","width":272,"height":60,"url":"https:\u002F\u002Fmiro.medium.com\u002Fv2\u002Fresize:fit:544\u002F7*V1_7XP4snlmqrc_0Njontw.png"}},"mainEntityOfPage":"https:\u002F\u002Fnihxl.medium.com\u002Funderstanding-good-vs-bad-ux-designs-7d710ef783b9"}</script><style type="text/css" data-fela-rehydration="499" data-fela-type="STATIC">html{box-sizing:border-box;-webkit-text-size-adjust:100%}*, *:before, *:after{box-sizing:inherit}body{margin:0;padding:0;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color:rgba(0,0,0,0.8);position:relative;min-height:100vh}h1, h2, h3, h4, h5, h6, dl, dd, ol, ul, menu, figure, blockquote, p, pre, form{margin:0}menu, ol, ul{padding:0;list-style:none;list-style-image:none}main{display:block}a{color:inherit;text-decoration:none}a, button, input{-webkit-tap-highlight-color:transparent}img, svg{vertical-align:middle}button{background:transparent;overflow:visible}button, input, optgroup, select, textarea{margin:0}:root{--reach-tabs:1;--reach-menu-button:1}#speechify-root{font-family:Sohne, sans-serif}div[data-popper-reference-hidden="true"]{visibility:hidden;pointer-events:none}.grecaptcha-badge{visibility:hidden} /*XCode style (c) Angel Garcia <angelgarcia.mail@gmail.com>*/.hljs {background: #fff;color: black; }/* Gray DOCTYPE selectors like WebKit */ .xml .hljs-meta {color: #c0c0c0; }.hljs-comment, .hljs-quote {color: #007400; }.hljs-tag, .hljs-attribute, .hljs-keyword, .hljs-selector-tag, .hljs-literal, .hljs-name {color: #aa0d91; }.hljs-variable, .hljs-template-variable {color: #3F6E74; }.hljs-code, .hljs-string, .hljs-meta .hljs-string {color: #c41a16; }.hljs-regexp, .hljs-link {color: #0E0EFF; }.hljs-title, .hljs-symbol, .hljs-bullet, .hljs-number {color: #1c00cf; }.hljs-section, .hljs-meta {color: #643820; }.hljs-title.class_, .hljs-class .hljs-title, .hljs-type, .hljs-built_in, .hljs-params {color: #5c2699; }.hljs-attr {color: #836C28; }.hljs-subst {color: #000; }.hljs-formula {background-color: #eee;font-style: italic; }.hljs-addition {background-color: #baeeba; }.hljs-deletion {background-color: #ffc8bd; }.hljs-selector-id, .hljs-selector-class {color: #9b703f; }.hljs-doctag, .hljs-strong {font-weight: bold; }.hljs-emphasis {font-style: italic; } </style><style type="text/css" data-fela-rehydration="499" data-fela-type="KEYFRAME">@-webkit-keyframes k1{0%{opacity:0.8}50%{opacity:0.5}100%{opacity:0.8}}@-moz-keyframes k1{0%{opacity:0.8}50%{opacity:0.5}100%{opacity:0.8}}@keyframes k1{0%{opacity:0.8}50%{opacity:0.5}100%{opacity:0.8}}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE">.a{font-family:medium-content-sans-serif-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif}.b{font-weight:400}.c{background-color:rgba(255, 255, 255, 1)}.l{display:block}.m{position:sticky}.n{top:0}.o{z-index:500}.p{padding:0 24px}.q{align-items:center}.r{border-bottom:solid 1px #F2F2F2}.y{height:41px}.z{line-height:20px}.ab{display:flex}.ac{height:57px}.ae{flex:1 0 auto}.af{color:inherit}.ag{fill:inherit}.ah{font-size:inherit}.ai{border:inherit}.aj{font-family:inherit}.ak{letter-spacing:inherit}.al{font-weight:inherit}.am{padding:0}.an{margin:0}.ao{cursor:pointer}.ap:disabled{cursor:not-allowed}.aq:disabled{color:#6B6B6B}.ar:disabled{fill:#6B6B6B}.au{width:auto}.av path{fill:#242424}.aw{height:25px}.ax{margin-left:16px}.ay{border:none}.az{border-radius:20px}.ba{width:240px}.bb{background:#F9F9F9}.bc path{fill:#6B6B6B}.be{outline:none}.bf{font-family:sohne, "Helvetica Neue", Helvetica, Arial, sans-serif}.bg{font-size:14px}.bh{width:100%}.bi{padding:10px 20px 10px 0}.bj{background-color:transparent}.bk{color:#242424}.bl::placeholder{color:#6B6B6B}.bm{display:inline-block}.bn{margin-left:12px}.bo{margin-right:12px}.bp{border-radius:4px}.bq{margin-left:24px}.br{height:24px}.bx{background-color:#F9F9F9}.by{border-radius:50%}.bz{height:32px}.ca{width:32px}.cb{justify-content:center}.ch{max-width:680px}.ci{min-width:0}.cj{animation:k1 1.2s ease-in-out infinite}.ck{height:100vh}.cl{margin-bottom:16px}.cm{margin-top:48px}.cn{align-items:flex-start}.co{flex-direction:column}.cp{justify-content:space-between}.cq{margin-bottom:24px}.cw{width:80%}.cx{background-color:#F2F2F2}.dd{height:44px}.de{width:44px}.df{margin:auto 0}.dg{margin-bottom:4px}.dh{height:16px}.di{width:120px}.dj{width:80px}.dp{margin-bottom:8px}.dq{width:96%}.dr{width:98%}.ds{width:81%}.dt{margin-left:8px}.du{color:#6B6B6B}.dv{font-size:13px}.dw{height:100%}.ep{color:#FFFFFF}.eq{fill:#FFFFFF}.er{background:#1A8917}.es{border-color:#1A8917}.ew:disabled{cursor:inherit !important}.ex:disabled{opacity:0.3}.ey:disabled:hover{background:#1A8917}.ez:disabled:hover{border-color:#1A8917}.fa{border-radius:99em}.fb{border-width:1px}.fc{border-style:solid}.fd{box-sizing:border-box}.fe{text-decoration:none}.ff{text-align:center}.fi{margin-right:32px}.fj{position:relative}.fk{fill:#6B6B6B}.fn{background:transparent}.fo svg{margin-left:4px}.fp svg{fill:#6B6B6B}.fr{box-shadow:inset 0 0 0 1px rgba(0, 0, 0, 0.05)}.fs{position:absolute}.fz{margin:0 24px}.gd{background:rgba(255, 255, 255, 1)}.ge{border:1px solid #F2F2F2}.gf{box-shadow:0 1px 4px #F2F2F2}.gg{max-height:100vh}.gh{overflow-y:auto}.gi{left:0}.gj{top:calc(100vh + 100px)}.gk{bottom:calc(100vh + 100px)}.gl{width:10px}.gm{pointer-events:none}.gn{word-break:break-word}.go{word-wrap:break-word}.gp:after{display:block}.gq:after{content:""}.gr:after{clear:both}.gs{line-height:1.23}.gt{letter-spacing:0}.gu{font-style:normal}.gv{font-weight:700}.ia{align-items:baseline}.ib{width:48px}.ic{height:48px}.id{border:2px solid rgba(255, 255, 255, 1)}.ie{z-index:0}.if{box-shadow:none}.ig{border:1px solid rgba(0, 0, 0, 0.05)}.ih{margin-bottom:2px}.ii{flex-wrap:nowrap}.ij{font-size:16px}.ik{line-height:24px}.im{margin:0 8px}.in{display:inline}.io{color:#1A8917}.ip{fill:#1A8917}.is{flex:0 0 auto}.iv{flex-wrap:wrap}.iw{padding-left:8px}.ix{padding-right:8px}.jy> *{flex-shrink:0}.jz{overflow-x:scroll}.ka::-webkit-scrollbar{display:none}.kb{scrollbar-width:none}.kc{-ms-overflow-style:none}.kd{width:74px}.ke{flex-direction:row}.kf{z-index:2}.kg{margin-right:4px}.kj{-webkit-user-select:none}.kk{border:0}.kl{fill:rgba(117, 117, 117, 1)}.ko{outline:0}.kp{user-select:none}.kq> svg{pointer-events:none}.kz{cursor:progress}.la{opacity:1}.lb{padding:4px 0}.le{margin-top:0px}.lf{width:16px}.lh{display:inline-flex}.ln{max-width:100%}.lo{padding:8px 2px}.lp svg{color:#6B6B6B}.mg{line-height:1.58}.mh{letter-spacing:-0.004em}.mi{font-family:source-serif-pro, Georgia, Cambria, "Times New Roman", Times, serif}.nd{margin-bottom:-0.46em}.ne{margin-left:auto}.nf{margin-right:auto}.ng{max-width:3126px}.nm{clear:both}.no{cursor:zoom-in}.np{z-index:auto}.nr{height:auto}.ns{line-height:1.12}.nt{letter-spacing:-0.022em}.nu{font-weight:600}.op{margin-bottom:-0.28em}.ov{max-width:3125px}.ow{margin-bottom:26px}.ox{margin-top:6px}.oy{margin-top:8px}.oz{margin-right:8px}.pa{padding:8px 16px}.pb{border-radius:100px}.pc{transition:background 300ms ease}.pe{white-space:nowrap}.pf{border-top:none}.pl{height:52px}.pm{max-height:52px}.pn{box-sizing:content-box}.po{position:static}.pp{z-index:1}.pr{max-width:155px}.px{margin-right:20px}.qr{height:64px}.qs{width:64px}.qt{align-self:flex-end}.qu{color:rgba(255, 255, 255, 1)}.qv{fill:rgba(255, 255, 255, 1)}.qw{background:rgba(25, 25, 25, 1)}.qx{border-color:rgba(25, 25, 25, 1)}.ra:disabled{opacity:0.1}.rb:disabled:hover{background:rgba(25, 25, 25, 1)}.rc:disabled:hover{border-color:rgba(25, 25, 25, 1)}.rd{flex:1 1 auto}.rj{padding-right:4px}.rk{font-weight:500}.rx{white-space:pre-wrap}.ry{margin-top:16px}.rz{height:0px}.sa{border-bottom:solid 1px #E5E5E5}.sb{margin-top:56px}.sc{margin-top:72px}.sd{padding:24px 0}.se{margin-bottom:0px}.sf{margin-right:16px}.as:hover:not(:disabled){color:rgba(25, 25, 25, 1)}.at:hover:not(:disabled){fill:rgba(25, 25, 25, 1)}.et:hover{background:#156D12}.eu:hover{border-color:#156D12}.ev:hover{cursor:pointer}.fl:hover{color:#242424}.fm:hover{fill:#242424}.fq:hover svg{fill:#242424}.ft:hover{background-color:rgba(0, 0, 0, 0.1)}.il:hover{text-decoration:underline}.iq:hover:not(:disabled){color:#156D12}.ir:hover:not(:disabled){fill:#156D12}.kn:hover{fill:rgba(8, 8, 8, 1)}.lc:hover{fill:#000000}.ld:hover p{color:#000000}.lg:hover{color:#000000}.lq:hover svg{color:#000000}.pd:hover{background-color:#F2F2F2}.qq:hover{background-color:none}.qy:hover{background:#000000}.qz:hover{border-color:#242424}.bd:focus-within path{fill:#242424}.km:focus{fill:rgba(8, 8, 8, 1)}.lr:focus svg{color:#000000}.nq:focus{transform:scale(1.01)}.kr:active{border-style:none}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="all and (min-width: 1080px)">.d{display:none}.bw{width:64px}.cg{margin:0 64px}.cv{height:48px}.dc{margin-bottom:52px}.do{margin-bottom:48px}.ef{font-size:14px}.eg{line-height:20px}.em{font-size:13px}.eo{padding:5px 12px}.fh{display:flex}.fy{margin-bottom:68px}.gc{max-width:680px}.hq{font-size:42px}.hr{margin-top:1.19em}.hs{margin-bottom:32px}.ht{line-height:52px}.hu{letter-spacing:-0.011em}.hz{align-items:center}.jk{border-top:solid 1px #F2F2F2}.jl{border-bottom:solid 1px #F2F2F2}.jm{margin:32px 0 0}.jn{padding:3px 8px}.jw> *{margin-right:24px}.jx> :last-child{margin-right:0}.ky{margin-top:0px}.lm{margin:0}.mz{font-size:20px}.na{margin-top:2.14em}.nb{line-height:32px}.nc{letter-spacing:-0.003em}.nl{margin-top:56px}.ol{font-size:24px}.om{margin-top:1.95em}.on{line-height:30px}.oo{letter-spacing:-0.016em}.ou{margin-top:0.94em}.pk{margin-bottom:88px}.pw{display:inline-block}.qc{padding-top:72px}.qd{flex-direction:row}.qg{margin-bottom:0}.qh{margin-right:20px}.re{max-width:500px}.rv{line-height:24px}.rw{letter-spacing:0}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="all and (max-width: 1079.98px)">.e{display:none}.kx{margin-top:0px}.pv{display:inline-block}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="all and (max-width: 903.98px)">.f{display:none}.kw{margin-top:0px}.pu{display:inline-block}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="all and (max-width: 727.98px)">.g{display:none}.ku{margin-top:0px}.kv{margin-right:0px}.pt{display:inline-block}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="all and (max-width: 551.98px)">.h{display:none}.s{display:flex}.t{justify-content:space-between}.bs{width:24px}.cc{margin:0 24px}.cr{height:40px}.cy{margin-bottom:44px}.dk{margin-bottom:32px}.dx{font-size:13px}.dy{line-height:20px}.eh{padding:0px 8px 1px}.fu{margin-bottom:4px}.gw{font-size:32px}.gx{margin-top:1.01em}.gy{margin-bottom:24px}.gz{line-height:38px}.ha{letter-spacing:-0.014em}.hv{align-items:flex-start}.it{flex-direction:column}.iy{margin:24px -24px 0}.iz{padding:0}.jo> *{margin-right:8px}.jp> :last-child{margin-right:24px}.kh{margin-left:0px}.ks{margin-top:0px}.kt{margin-right:0px}.li{margin:0}.ls{border:1px solid #F2F2F2}.lt{border-radius:99em}.lu{padding:0px 16px 0px 12px}.lv{height:38px}.lw{align-items:center}.ly svg{margin-right:8px}.mj{font-size:18px}.mk{margin-top:1.56em}.ml{line-height:28px}.mm{letter-spacing:-0.003em}.nh{margin-top:40px}.nv{font-size:20px}.nw{margin-top:1.2em}.nx{line-height:24px}.ny{letter-spacing:0}.oq{margin-top:0.67em}.pg{margin-bottom:80px}.ps{display:inline-block}.py{padding-top:48px}.qo{margin-bottom:20px}.qp{margin-right:0}.ri{max-width:100%}.rl{font-size:24px}.rm{line-height:30px}.rn{letter-spacing:-0.016em}.lx:hover{border-color:#E5E5E5}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="all and (min-width: 904px) and (max-width: 1079.98px)">.i{display:none}.bv{width:64px}.cf{margin:0 64px}.cu{height:48px}.db{margin-bottom:52px}.dn{margin-bottom:48px}.ed{font-size:14px}.ee{line-height:20px}.ek{font-size:13px}.el{padding:5px 12px}.fg{display:flex}.fx{margin-bottom:68px}.gb{max-width:680px}.hl{font-size:42px}.hm{margin-top:1.19em}.hn{margin-bottom:32px}.ho{line-height:52px}.hp{letter-spacing:-0.011em}.hy{align-items:center}.jg{border-top:solid 1px #F2F2F2}.jh{border-bottom:solid 1px #F2F2F2}.ji{margin:32px 0 0}.jj{padding:3px 8px}.ju> *{margin-right:24px}.jv> :last-child{margin-right:0}.ll{margin:0}.mv{font-size:20px}.mw{margin-top:2.14em}.mx{line-height:32px}.my{letter-spacing:-0.003em}.nk{margin-top:56px}.oh{font-size:24px}.oi{margin-top:1.95em}.oj{line-height:30px}.ok{letter-spacing:-0.016em}.ot{margin-top:0.94em}.pj{margin-bottom:88px}.qb{padding-top:72px}.qe{flex-direction:row}.qi{margin-bottom:0}.qj{margin-right:20px}.rf{max-width:500px}.rt{line-height:24px}.ru{letter-spacing:0}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="all and (min-width: 728px) and (max-width: 903.98px)">.j{display:none}.w{display:flex}.x{justify-content:space-between}.bu{width:64px}.ce{margin:0 48px}.ct{height:48px}.da{margin-bottom:52px}.dm{margin-bottom:48px}.eb{font-size:13px}.ec{line-height:20px}.ej{padding:0px 8px 1px}.fw{margin-bottom:68px}.ga{max-width:680px}.hg{font-size:42px}.hh{margin-top:1.19em}.hi{margin-bottom:32px}.hj{line-height:52px}.hk{letter-spacing:-0.011em}.hx{align-items:center}.jc{border-top:solid 1px #F2F2F2}.jd{border-bottom:solid 1px #F2F2F2}.je{margin:32px 0 0}.jf{padding:3px 8px}.js> *{margin-right:24px}.jt> :last-child{margin-right:0}.lk{margin:0}.mr{font-size:20px}.ms{margin-top:2.14em}.mt{line-height:32px}.mu{letter-spacing:-0.003em}.nj{margin-top:56px}.od{font-size:24px}.oe{margin-top:1.95em}.of{line-height:30px}.og{letter-spacing:-0.016em}.os{margin-top:0.94em}.pi{margin-bottom:88px}.qa{padding-top:72px}.qf{flex-direction:row}.qk{margin-bottom:0}.ql{margin-right:20px}.rg{max-width:500px}.rr{line-height:24px}.rs{letter-spacing:0}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="all and (min-width: 552px) and (max-width: 727.98px)">.k{display:none}.u{display:flex}.v{justify-content:space-between}.bt{width:24px}.cd{margin:0 24px}.cs{height:40px}.cz{margin-bottom:44px}.dl{margin-bottom:32px}.dz{font-size:13px}.ea{line-height:20px}.ei{padding:0px 8px 1px}.fv{margin-bottom:4px}.hb{font-size:32px}.hc{margin-top:1.01em}.hd{margin-bottom:24px}.he{line-height:38px}.hf{letter-spacing:-0.014em}.hw{align-items:flex-start}.iu{flex-direction:column}.ja{margin:24px 0 0}.jb{padding:0}.jq> *{margin-right:8px}.jr> :last-child{margin-right:8px}.ki{margin-left:0px}.lj{margin:0}.lz{border:1px solid #F2F2F2}.ma{border-radius:99em}.mb{padding:0px 16px 0px 12px}.mc{height:38px}.md{align-items:center}.mf svg{margin-right:8px}.mn{font-size:18px}.mo{margin-top:1.56em}.mp{line-height:28px}.mq{letter-spacing:-0.003em}.ni{margin-top:40px}.nz{font-size:20px}.oa{margin-top:1.2em}.ob{line-height:24px}.oc{letter-spacing:0}.or{margin-top:0.67em}.ph{margin-bottom:80px}.pz{padding-top:48px}.qm{margin-bottom:20px}.qn{margin-right:0}.rh{max-width:100%}.ro{font-size:24px}.rp{line-height:30px}.rq{letter-spacing:-0.016em}.me:hover{border-color:#E5E5E5}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="print">.pq{display:none}</style><style type="text/css" data-fela-rehydration="499" data-fela-type="RULE" media="(prefers-reduced-motion: no-preference)">.nn{transition:transform 300ms cubic-bezier(0.2, 0, 0.2, 1)}</style></head><body><div id="root"><div class="a b c"><div class="d e f g h i j k"></div><script>document.domain = document.domain;</script><div class="l c"><div class="l m n o c"><div class="p q r s t u v w x i d y z"><a class="du ag dv bf ak b am an ao ap aq ar as at s u w i d q dw z" href="https://rsci.app.link/?%24canonical_url=https%3A%2F%2Fmedium.com%2Fp%2F7d710ef783b9&%7Efeature=LoOpenInAppButton&%7Echannel=ShowPostUnderUser&source=---top_nav_layout_nav----------------------------------" rel="noopener follow">Open in app<svg xmlns="http://www.w3.org/2000/svg" width="10" height="10" fill="none" viewBox="0 0 10 10" class="dt"><path fill="currentColor" d="M.985 8.485a.375.375 0 1 0 .53.53zM8.75 1.25h.375A.375.375 0 0 0 8.75.875zM8.375 6.5a.375.375 0 1 0 .75 0zM3.5.875a.375.375 0 1 0 0 .75zm-1.985 8.14 7.5-7.5-.53-.53-7.5 7.5zm6.86-7.765V6.5h.75V1.25zM3.5 1.625h5.25v-.75H3.5z"></path></svg></a><div class="ab q"><p class="bf b dx dy dz ea eb ec ed ee ef eg du"><span><button class="bf b dx dy eh dz ea ei eb ec ej ek ee el em eg eo ep eq er es et eu ev ew ex ey ez fa fb fc fd bm fe ff" data-testid="headerSignUpButton">Sign up</button></span></p><div class="ax l"><p class="bf b dx dy dz ea eb ec ed ee ef eg du"><span><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="headerSignInButton" href="https://medium.com/m/signin?operation=login&redirect=https%3A%2F%2Fnihxl.medium.com%2Funderstanding-good-vs-bad-ux-designs-7d710ef783b9&source=post_page---top_nav_layout_nav-----------------------global_nav-----------" rel="noopener follow">Sign in</a></span></p></div></div></div><div class="p q r ab ac"><div class="ab q ae"><a class="af ag ah ai aj ak al am an ao ap aq ar as at ab" aria-label="Homepage" data-testid="headerMediumLogo" href="https://medium.com/?source=---top_nav_layout_nav----------------------------------" rel="noopener follow"><svg xmlns="http://www.w3.org/2000/svg" width="719" height="160" fill="none" viewBox="0 0 719 160" class="au av aw"><path fill="#242424" d="m174.104 9.734.215-.047V8.02H130.39L89.6 103.89 48.81 8.021H1.472v1.666l.212.047c8.018 1.81 12.09 4.509 12.09 14.242V137.93c0 9.734-4.087 12.433-12.106 14.243l-.212.047v1.671h32.118v-1.665l-.213-.048c-8.018-1.809-12.089-4.509-12.089-14.242V30.586l52.399 123.305h2.972l53.925-126.743V140.75c-.687 7.688-4.721 10.062-11.982 11.701l-.215.05v1.652h55.948v-1.652l-.215-.05c-7.269-1.639-11.4-4.013-12.087-11.701l-.037-116.774h.037c0-9.733 4.071-12.432 12.087-14.242m25.555 75.488c.915-20.474 8.268-35.252 20.606-35.507 3.806.063 6.998 1.312 9.479 3.714 5.272 5.118 7.751 15.812 7.368 31.793zm-.553 5.77h65.573v-.275c-.186-15.656-4.721-27.834-13.466-36.196-7.559-7.227-18.751-11.203-30.507-11.203h-.263c-6.101 0-13.584 1.48-18.909 4.16-6.061 2.807-11.407 7.003-15.855 12.511-7.161 8.874-11.499 20.866-12.554 34.343q-.05.606-.092 1.212a50 50 0 0 0-.065 1.151 85.807 85.807 0 0 0-.094 5.689c.71 30.524 17.198 54.917 46.483 54.917 25.705 0 40.675-18.791 44.407-44.013l-1.886-.664c-6.557 13.556-18.334 21.771-31.738 20.769-18.297-1.369-32.314-19.922-31.042-42.395m139.722 41.359c-2.151 5.101-6.639 7.908-12.653 7.908s-11.513-4.129-15.418-11.63c-4.197-8.053-6.405-19.436-6.405-32.92 0-28.067 8.729-46.22 22.24-46.22 5.657 0 10.111 2.807 12.236 7.704zm43.499 20.008c-8.019-1.897-12.089-4.722-12.089-14.951V1.309l-48.716 14.353v1.757l.299-.024c6.72-.543 11.278.386 13.925 2.83 2.072 1.915 3.082 4.853 3.082 8.987v18.66c-4.803-3.067-10.516-4.56-17.448-4.56-14.059 0-26.909 5.92-36.176 16.672-9.66 11.205-14.767 26.518-14.767 44.278-.003 31.72 15.612 53.039 38.851 53.039 13.595 0 24.533-7.449 29.54-20.013v16.865h43.711v-1.746zM424.1 19.819c0-9.904-7.468-17.374-17.375-17.374-9.859 0-17.573 7.632-17.573 17.374s7.721 17.374 17.573 17.374c9.907 0 17.375-7.47 17.375-17.374m11.499 132.546c-8.019-1.897-12.089-4.722-12.089-14.951h-.035V43.635l-43.714 12.551v1.705l.263.024c9.458.842 12.047 4.1 12.047 15.152v81.086h43.751v-1.746zm112.013 0c-8.018-1.897-12.089-4.722-12.089-14.951V43.635l-41.621 12.137v1.71l.246.026c7.733.813 9.967 4.257 9.967 15.36v59.279c-2.578 5.102-7.415 8.131-13.274 8.336-9.503 0-14.736-6.419-14.736-18.073V43.638l-43.714 12.55v1.703l.262.024c9.459.84 12.05 4.097 12.05 15.152v50.17a56.3 56.3 0 0 0 .91 10.444l.787 3.423c3.701 13.262 13.398 20.197 28.59 20.197 12.868 0 24.147-7.966 29.115-20.43v17.311h43.714v-1.747zm169.818 1.788v-1.749l-.213-.05c-8.7-2.006-12.089-5.789-12.089-13.49v-63.79c0-19.89-11.171-31.761-29.883-31.761-13.64 0-25.141 7.882-29.569 20.16-3.517-13.01-13.639-20.16-28.606-20.16-13.146 0-23.449 6.938-27.869 18.657V43.643L545.487 55.68v1.715l.263.024c9.345.829 12.047 4.181 12.047 14.95v81.784h40.787v-1.746l-.215-.053c-6.941-1.631-9.181-4.606-9.181-12.239V66.998c1.836-4.289 5.537-9.37 12.853-9.37 9.086 0 13.692 6.296 13.692 18.697v77.828h40.797v-1.746l-.215-.053c-6.94-1.631-9.18-4.606-9.18-12.239V75.066a42 42 0 0 0-.578-7.26c1.947-4.661 5.86-10.177 13.475-10.177 9.214 0 13.691 6.114 13.691 18.696v77.828z"></path></svg></a><div class="ax h"><div class="ab ay az ba bb q bc bd"><div class="bm" aria-hidden="false" aria-describedby="searchResults" aria-labelledby="searchResults"></div><div class="bn bo ab"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M4.092 11.06a6.95 6.95 0 1 1 13.9 0 6.95 6.95 0 0 1-13.9 0m6.95-8.05a8.05 8.05 0 1 0 5.13 14.26l3.75 3.75a.56.56 0 1 0 .79-.79l-3.73-3.73A8.05 8.05 0 0 0 11.042 3z" clip-rule="evenodd"></path></svg></div><input role="combobox" aria-controls="searchResults" aria-expanded="false" aria-label="search" data-testid="headerSearchInput" tabindex="0" class="ay be bf bg z bh bi bj bk bl" placeholder="Search" value=""/></div></div></div><div class="h k w fg fh"><div class="fi ab"><span><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="headerWriteButton" href="https://medium.com/m/signin?operation=register&redirect=https%3A%2F%2Fmedium.com%2Fnew-story&source=---top_nav_layout_nav-----------------------new_post_topnav-----------" rel="noopener follow"><div class="bf b bg z du fj fk ab q fl fm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24" aria-label="Write"><path fill="currentColor" d="M14 4a.5.5 0 0 0 0-1zm7 6a.5.5 0 0 0-1 0zm-7-7H4v1h10zM3 4v16h1V4zm1 17h16v-1H4zm17-1V10h-1v10zm-1 1a1 1 0 0 0 1-1h-1zM3 20a1 1 0 0 0 1 1v-1zM4 3a1 1 0 0 0-1 1h1z"></path><path stroke="currentColor" d="m17.5 4.5-8.458 8.458a.25.25 0 0 0-.06.098l-.824 2.47a.25.25 0 0 0 .316.316l2.47-.823a.25.25 0 0 0 .098-.06L19.5 6.5m-2-2 2.323-2.323a.25.25 0 0 1 .354 0l1.646 1.646a.25.25 0 0 1 0 .354L19.5 6.5m-2-2 2 2"></path></svg><div class="dt l">Write</div></div></a></span></div></div><div class="k j i d"><div class="fi ab"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="headerSearchButton" href="https://medium.com/search?source=---top_nav_layout_nav----------------------------------" rel="noopener follow"><div class="bf b bg z du fj fk ab q fl fm"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24" aria-label="Search"><path fill="currentColor" fill-rule="evenodd" d="M4.092 11.06a6.95 6.95 0 1 1 13.9 0 6.95 6.95 0 0 1-13.9 0m6.95-8.05a8.05 8.05 0 1 0 5.13 14.26l3.75 3.75a.56.56 0 1 0 .79-.79l-3.73-3.73A8.05 8.05 0 0 0 11.042 3z" clip-rule="evenodd"></path></svg></div></a></div></div><div class="fi h k j"><div class="ab q"><p class="bf b dx dy dz ea eb ec ed ee ef eg du"><span><button class="bf b dx dy eh dz ea ei eb ec ej ek ee el em eg eo ep eq er es et eu ev ew ex ey ez fa fb fc fd bm fe ff" data-testid="headerSignUpButton">Sign up</button></span></p><div class="ax l"><p class="bf b dx dy dz ea eb ec ed ee ef eg du"><span><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="headerSignInButton" href="https://medium.com/m/signin?operation=login&redirect=https%3A%2F%2Fnihxl.medium.com%2Funderstanding-good-vs-bad-ux-designs-7d710ef783b9&source=post_page---top_nav_layout_nav-----------------------global_nav-----------" rel="noopener follow">Sign in</a></span></p></div></div></div><div class="l" aria-hidden="false"><button class="ay fn am ab q ao fo fp fq" aria-label="user options menu" data-testid="headerUserIcon"><div class="l fj"><img alt="" class="l fd by bz ca cx" src="https://miro.medium.com/v2/resize:fill:64:64/1*dmbNkD5D-u45r44go_cf0g.png" width="32" height="32" loading="lazy" role="presentation"/><div class="fr by l bz ca fs n ay ft"></div></div></button></div></div></div><div class="l"><div class="fu fv fw fx fy l"><div class="ab cb"><div class="ci bh fz ga gb gc"></div></div><article><div class="l"><div class="l"><span class="l"></span><section><div><div class="fs gi gj gk gl gm"></div><div class="gn go gp gq gr"><div class="ab cb"><div class="ci bh fz ga gb gc"><div><h1 id="6ce2" class="pw-post-title gs gt gu bf gv gw gx gy gz ha hb hc hd he hf hg hh hi hj hk hl hm hn ho hp hq hr hs ht hu bk" data-testid="storyTitle">Understanding Good vs Bad UX Designs</h1><div><div class="speechify-ignore ab cp"><div class="speechify-ignore bh l"><div class="hv hw hx hy hz ab"><div><div class="ab ia"><div><div class="bm" aria-hidden="false"><a rel="noopener follow" href="/?source=post_page---byline--7d710ef783b9--------------------------------"><div class="l ib ic by id ie"><div class="l fj"><img alt="Nihal Abdul Bari" class="l fd by dd de cx" src="https://miro.medium.com/v2/resize:fill:88:88/1*veo3g1SZpyFTlNmTgp22Tw.png" width="44" height="44" loading="lazy" data-testid="authorPhoto"/><div class="if by l dd de fs n ig ft"></div></div></div></a></div></div></div></div><div class="bn bh l"><div class="ab"><div style="flex:1"><span class="bf b bg z bk"><div class="ih ab q"><div class="ab q ii"><div class="ab q"><div><div class="bm" aria-hidden="false"><p class="bf b ij ik bk"><a class="af ag ah ai aj ak al am an ao ap aq ar il" data-testid="authorName" rel="noopener follow" href="/?source=post_page---byline--7d710ef783b9--------------------------------">Nihal Abdul Bari</a></p></div></div></div><span class="im in" aria-hidden="true"><span class="bf b bg z du">·</span></span><p class="bf b ij ik du"><span><a class="io ip ah ai aj ak al am an ao ap aq ar ex iq ir" href="https://medium.com/m/signin?actionUrl=https%3A%2F%2Fmedium.com%2F_%2Fsubscribe%2Fuser%2F533c9b6e2c7&operation=register&redirect=https%3A%2F%2Fnihxl.medium.com%2Funderstanding-good-vs-bad-ux-designs-7d710ef783b9&user=Nihal+Abdul+Bari&userId=533c9b6e2c7&source=post_page-533c9b6e2c7--byline--7d710ef783b9---------------------post_header-----------" rel="noopener follow">Follow</a></span></p></div></div></span></div></div><div class="l is"><span class="bf b bg z du"><div class="ab cn it iu iv"><span class="bf b bg z du"><div class="ab ae"><span data-testid="storyReadTime">3 min read</span><div class="iw ix l" aria-hidden="true"><span class="l" aria-hidden="true"><span class="bf b bg z du">·</span></span></div><span data-testid="storyPublishDate">May 18, 2021</span></div></span></div></span></div></div></div><div class="ab cp iy iz ja jb jc jd je jf jg jh ji jj jk jl jm jn"><div class="h k w fg fh q"><div class="kd l"><div class="ab q ke kf"><div class="pw-multi-vote-icon fj kg kh ki kj"><span><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="headerClapButton" href="https://medium.com/m/signin?actionUrl=https%3A%2F%2Fmedium.com%2F_%2Fvote%2Fp%2F7d710ef783b9&operation=register&redirect=https%3A%2F%2Fnihxl.medium.com%2Funderstanding-good-vs-bad-ux-designs-7d710ef783b9&user=Nihal+Abdul+Bari&userId=533c9b6e2c7&source=---header_actions--7d710ef783b9---------------------clap_footer-----------" rel="noopener follow"><div><div class="bm" aria-hidden="false"><div class="kk ao kl km kn ko am kp kq kr kj"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-label="clap"><path fill-rule="evenodd" d="M11.37.828 12 3.282l.63-2.454zM13.916 3.953l1.523-2.112-1.184-.39zM8.589 1.84l1.522 2.112-.337-2.501zM18.523 18.92c-.86.86-1.75 1.246-2.62 1.33a6 6 0 0 0 .407-.372c2.388-2.389 2.86-4.951 1.399-7.623l-.912-1.603-.79-1.672c-.26-.56-.194-.98.203-1.288a.7.7 0 0 1 .546-.132c.283.046.546.231.728.5l2.363 4.157c.976 1.624 1.141 4.237-1.324 6.702m-10.999-.438L3.37 14.328a.828.828 0 0 1 .585-1.408.83.83 0 0 1 .585.242l2.158 2.157a.365.365 0 0 0 .516-.516l-2.157-2.158-1.449-1.449a.826.826 0 0 1 1.167-1.17l3.438 3.44a.363.363 0 0 0 .516 0 .364.364 0 0 0 0-.516L5.293 9.513l-.97-.97a.826.826 0 0 1 0-1.166.84.84 0 0 1 1.167 0l.97.968 3.437 3.436a.36.36 0 0 0 .517 0 .366.366 0 0 0 0-.516L6.977 7.83a.82.82 0 0 1-.241-.584.82.82 0 0 1 .824-.826c.219 0 .43.087.584.242l5.787 5.787a.366.366 0 0 0 .587-.415l-1.117-2.363c-.26-.56-.194-.98.204-1.289a.7.7 0 0 1 .546-.132c.283.046.545.232.727.501l2.193 3.86c1.302 2.38.883 4.59-1.277 6.75-1.156 1.156-2.602 1.627-4.19 1.367-1.418-.236-2.866-1.033-4.079-2.246M10.75 5.971l2.12 2.12c-.41.502-.465 1.17-.128 1.89l.22.465-3.523-3.523a.8.8 0 0 1-.097-.368c0-.22.086-.428.241-.584a.847.847 0 0 1 1.167 0m7.355 1.705c-.31-.461-.746-.758-1.23-.837a1.44 1.44 0 0 0-1.11.275c-.312.24-.505.543-.59.881a1.74 1.74 0 0 0-.906-.465 1.47 1.47 0 0 0-.82.106l-2.182-2.182a1.56 1.56 0 0 0-2.2 0 1.54 1.54 0 0 0-.396.701 1.56 1.56 0 0 0-2.21-.01 1.55 1.55 0 0 0-.416.753c-.624-.624-1.649-.624-2.237-.037a1.557 1.557 0 0 0 0 2.2c-.239.1-.501.238-.715.453a1.56 1.56 0 0 0 0 2.2l.516.515a1.556 1.556 0 0 0-.753 2.615L7.01 19c1.32 1.319 2.909 2.189 4.475 2.449q.482.08.971.08c.85 0 1.653-.198 2.393-.579.231.033.46.054.686.054 1.266 0 2.457-.52 3.505-1.567 2.763-2.763 2.552-5.734 1.439-7.586z" clip-rule="evenodd"></path></svg></div></div></div></a></span></div><div class="pw-multi-vote-count l ks kt ku kv kw kx ky"><p class="bf b dv z du"><span class="kz">--</span></p></div></div></div><div><div class="bm" aria-hidden="false"><button class="ao kk la lb ab q fk lc ld" aria-label="responses"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" class="le"><path d="M18.006 16.803c1.533-1.456 2.234-3.325 2.234-5.321C20.24 7.357 16.709 4 12.191 4S4 7.357 4 11.482c0 4.126 3.674 7.482 8.191 7.482.817 0 1.622-.111 2.393-.327.231.2.48.391.744.559 1.06.693 2.203 1.044 3.399 1.044.224-.008.4-.112.486-.287a.49.49 0 0 0-.042-.518c-.495-.67-.845-1.364-1.04-2.057a4 4 0 0 1-.125-.598zm-3.122 1.055-.067-.223-.315.096a8 8 0 0 1-2.311.338c-4.023 0-7.292-2.955-7.292-6.587 0-3.633 3.269-6.588 7.292-6.588 4.014 0 7.112 2.958 7.112 6.593 0 1.794-.608 3.469-2.027 4.72l-.195.168v.255c0 .056 0 .151.016.295.025.231.081.478.154.733.154.558.398 1.117.722 1.659a5.3 5.3 0 0 1-2.165-.845c-.276-.176-.714-.383-.941-.59z"></path></svg></button></div></div></div><div class="ab q jo jp jq jr js jt ju jv jw jx jy jz ka kb kc"><div class="lf k j i d"></div><div class="h k"><div><div class="bm" aria-hidden="false"><span><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="headerBookmarkButton" href="https://medium.com/m/signin?actionUrl=https%3A%2F%2Fmedium.com%2F_%2Fbookmark%2Fp%2F7d710ef783b9&operation=register&redirect=https%3A%2F%2Fnihxl.medium.com%2Funderstanding-good-vs-bad-ux-designs-7d710ef783b9&source=---header_actions--7d710ef783b9---------------------bookmark_footer-----------" rel="noopener follow"><svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="none" viewBox="0 0 25 25" class="du lg" aria-label="Add to list bookmark button"><path fill="currentColor" d="M18 2.5a.5.5 0 0 1 1 0V5h2.5a.5.5 0 0 1 0 1H19v2.5a.5.5 0 1 1-1 0V6h-2.5a.5.5 0 0 1 0-1H18zM7 7a1 1 0 0 1 1-1h3.5a.5.5 0 0 0 0-1H8a2 2 0 0 0-2 2v14a.5.5 0 0 0 .805.396L12.5 17l5.695 4.396A.5.5 0 0 0 19 21v-8.5a.5.5 0 0 0-1 0v7.485l-5.195-4.012a.5.5 0 0 0-.61 0L7 19.985z"></path></svg></a></span></div></div></div><div class="fd lh cn"><div class="l ae"><div class="ab cb"><div class="li lj lk ll lm ln ci bh"><div class="ab"><div class="bm bh" aria-hidden="false"><div><div class="bm" aria-hidden="false"><button aria-label="Listen" data-testid="audioPlayButton" class="af fk ah ai aj ak al lo an ao ap ex lp lq ld lr ls lt lu lv s lw lx ly lz ma mb mc u md me mf"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M3 12a9 9 0 1 1 18 0 9 9 0 0 1-18 0m9-10C6.477 2 2 6.477 2 12s4.477 10 10 10 10-4.477 10-10S17.523 2 12 2m3.376 10.416-4.599 3.066a.5.5 0 0 1-.777-.416V8.934a.5.5 0 0 1 .777-.416l4.599 3.066a.5.5 0 0 1 0 .832" clip-rule="evenodd"></path></svg><div class="j i d"><p class="bf b bg z du">Listen</p></div></button></div></div></div></div></div></div></div></div><div class="bm" aria-hidden="false" aria-describedby="postFooterSocialMenu" aria-labelledby="postFooterSocialMenu"><div><div class="bm" aria-hidden="false"><button aria-controls="postFooterSocialMenu" aria-expanded="false" aria-label="Share Post" data-testid="headerSocialShareButton" class="af fk ah ai aj ak al lo an ao ap ex lp lq ld lr ls lt lu lv s lw lx ly lz ma mb mc u md me mf"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M15.218 4.931a.4.4 0 0 1-.118.132l.012.006a.45.45 0 0 1-.292.074.5.5 0 0 1-.3-.13l-2.02-2.02v7.07c0 .28-.23.5-.5.5s-.5-.22-.5-.5v-7.04l-2 2a.45.45 0 0 1-.57.04h-.02a.4.4 0 0 1-.16-.3.4.4 0 0 1 .1-.32l2.8-2.8a.5.5 0 0 1 .7 0l2.8 2.79a.42.42 0 0 1 .068.498m-.106.138.008.004v-.01zM16 7.063h1.5a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-11c-1.1 0-2-.9-2-2v-10a2 2 0 0 1 2-2H8a.5.5 0 0 1 .35.15.5.5 0 0 1 .15.35.5.5 0 0 1-.15.35.5.5 0 0 1-.35.15H6.4c-.5 0-.9.4-.9.9v10.2a.9.9 0 0 0 .9.9h11.2c.5 0 .9-.4.9-.9v-10.2c0-.5-.4-.9-.9-.9H16a.5.5 0 0 1 0-1" clip-rule="evenodd"></path></svg><div class="j i d"><p class="bf b bg z du">Share</p></div></button></div></div></div></div></div></div></div></div></div><p id="156d" class="pw-post-body-paragraph mg mh gu mi b mj mk ml mm mn mo mp mq mr ms mt mu mv mw mx my mz na nb nc nd gn bk">Understanding the difference between good and bad user experience design can be subjective and sometimes hard to notice. But I have some helpful tips that can help us understand what makes for a good user experience.</p><figure class="nh ni nj nk nl nm ne nf paragraph-image"><div role="button" tabindex="0" class="nn no fj np bh nq"><div class="ne nf ng"><picture><source srcSet="https://miro.medium.com/v2/resize:fit:640/format:webp/1*-uQsCHsccSsMpmcO1-neig.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/format:webp/1*-uQsCHsccSsMpmcO1-neig.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/format:webp/1*-uQsCHsccSsMpmcO1-neig.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/format:webp/1*-uQsCHsccSsMpmcO1-neig.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/format:webp/1*-uQsCHsccSsMpmcO1-neig.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/format:webp/1*-uQsCHsccSsMpmcO1-neig.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/format:webp/1*-uQsCHsccSsMpmcO1-neig.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px" type="image/webp"/><source data-testid="og" srcSet="https://miro.medium.com/v2/resize:fit:640/1*-uQsCHsccSsMpmcO1-neig.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/1*-uQsCHsccSsMpmcO1-neig.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/1*-uQsCHsccSsMpmcO1-neig.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/1*-uQsCHsccSsMpmcO1-neig.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/1*-uQsCHsccSsMpmcO1-neig.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/1*-uQsCHsccSsMpmcO1-neig.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/1*-uQsCHsccSsMpmcO1-neig.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px"/><img alt="" class="bh ln nr c" width="700" height="467" loading="eager" role="presentation"/></picture></div></div></figure><p id="e079" class="pw-post-body-paragraph mg mh gu mi b mj mk ml mm mn mo mp mq mr ms mt mu mv mw mx my mz na nb nc nd gn bk">Grasping these tips is one element, seeing how you use them in practice is another element of understanding good vs bad user experiences. In this article, we will explore some examples of good vs bad ux designs.</p><h1 id="8fd5" class="ns nt gu bf nu nv nw nx ny nz oa ob oc od oe of og oh oi oj ok ol om on oo op bk">Reveal current state</h1><p id="d8f7" class="pw-post-body-paragraph mg mh gu mi b mj oq ml mm mn or mp mq mr os mt mu mv ot mx my mz ou nb nc nd gn bk">One of the heuristics developed by Jakob Nielsen, visibility of system status states that users should be informed about what is happening inside a product or website, in a reasonable response time following the action.</p><p id="3889" class="pw-post-body-paragraph mg mh gu mi b mj mk ml mm mn mo mp mq mr ms mt mu mv mw mx my mz na nb nc nd gn bk">This means that applications that don’t provide timely feedback on what the status might be, may create a negative or confusing experience. Take for instance the action of uploading a file. As a user when you upload a file, you want to be able to know whether your action was recognized. Delaying, or not showing a response to the action leaves a user questioning.</p><figure class="nh ni nj nk nl nm ne nf paragraph-image"><div role="button" tabindex="0" class="nn no fj np bh nq"><div class="ne nf ng"><picture><source srcSet="https://miro.medium.com/v2/resize:fit:640/format:webp/1*gfLsjKvKp6W0XjHdq1vxWA.gif 640w, https://miro.medium.com/v2/resize:fit:720/format:webp/1*gfLsjKvKp6W0XjHdq1vxWA.gif 720w, https://miro.medium.com/v2/resize:fit:750/format:webp/1*gfLsjKvKp6W0XjHdq1vxWA.gif 750w, https://miro.medium.com/v2/resize:fit:786/format:webp/1*gfLsjKvKp6W0XjHdq1vxWA.gif 786w, https://miro.medium.com/v2/resize:fit:828/format:webp/1*gfLsjKvKp6W0XjHdq1vxWA.gif 828w, https://miro.medium.com/v2/resize:fit:1100/format:webp/1*gfLsjKvKp6W0XjHdq1vxWA.gif 1100w, https://miro.medium.com/v2/resize:fit:1400/format:webp/1*gfLsjKvKp6W0XjHdq1vxWA.gif 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px" type="image/webp"/><source data-testid="og" srcSet="https://miro.medium.com/v2/resize:fit:640/1*gfLsjKvKp6W0XjHdq1vxWA.gif 640w, https://miro.medium.com/v2/resize:fit:720/1*gfLsjKvKp6W0XjHdq1vxWA.gif 720w, https://miro.medium.com/v2/resize:fit:750/1*gfLsjKvKp6W0XjHdq1vxWA.gif 750w, https://miro.medium.com/v2/resize:fit:786/1*gfLsjKvKp6W0XjHdq1vxWA.gif 786w, https://miro.medium.com/v2/resize:fit:828/1*gfLsjKvKp6W0XjHdq1vxWA.gif 828w, https://miro.medium.com/v2/resize:fit:1100/1*gfLsjKvKp6W0XjHdq1vxWA.gif 1100w, https://miro.medium.com/v2/resize:fit:1400/1*gfLsjKvKp6W0XjHdq1vxWA.gif 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px"/><img alt="" class="bh ln nr c" width="700" height="372" loading="lazy" role="presentation"/></picture></div></div></figure><h1 id="bef6" class="ns nt gu bf nu nv nw nx ny nz oa ob oc od oe of og oh oi oj ok ol om on oo op bk">Effective use of color and hierarchy</h1><p id="a97f" class="pw-post-body-paragraph mg mh gu mi b mj oq ml mm mn or mp mq mr os mt mu mv ot mx my mz ou nb nc nd gn bk">Though the visual aesthetic may not be the top priority in a ux process, ignoring visual design can lead to bad experiences. The practice of pairing thoughtful experience design with clear, hierarchical visual design can create easy to understand digital experiences that lead to higher effectiveness.</p><figure class="nh ni nj nk nl nm ne nf paragraph-image"><div role="button" tabindex="0" class="nn no fj np bh nq"><div class="ne nf ov"><picture><source srcSet="https://miro.medium.com/v2/resize:fit:640/format:webp/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/format:webp/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/format:webp/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/format:webp/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/format:webp/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/format:webp/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/format:webp/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px" type="image/webp"/><source data-testid="og" srcSet="https://miro.medium.com/v2/resize:fit:640/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/1*7Zdpyn_mgoVKXZbknrBeyA.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px"/><img alt="" class="bh ln nr c" width="700" height="372" loading="lazy" role="presentation"/></picture></div></div></figure><h1 id="8fbe" class="ns nt gu bf nu nv nw nx ny nz oa ob oc od oe of og oh oi oj ok ol om on oo op bk">Using clear and understandable language</h1><p id="6077" class="pw-post-body-paragraph mg mh gu mi b mj oq ml mm mn or mp mq mr os mt mu mv ot mx my mz ou nb nc nd gn bk">A good user experience is one that speaks to the user with words they understand. Even top apps fall into the trap of using highly technical terms that only experts may understand. Even if a user understands, or can make sense of it, in a tense situation, highly technical language can lead to user error and costly mistakes.</p><figure class="nh ni nj nk nl nm ne nf paragraph-image"><div role="button" tabindex="0" class="nn no fj np bh nq"><div class="ne nf ng"><picture><source srcSet="https://miro.medium.com/v2/resize:fit:640/format:webp/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/format:webp/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/format:webp/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/format:webp/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/format:webp/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/format:webp/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/format:webp/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px" type="image/webp"/><source data-testid="og" srcSet="https://miro.medium.com/v2/resize:fit:640/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/1*aTmHbpULfDoLIH4ny2xg4Q.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px"/><img alt="" class="bh ln nr c" width="700" height="372" loading="lazy" role="presentation"/></picture></div></div></figure><h1 id="d5a0" class="ns nt gu bf nu nv nw nx ny nz oa ob oc od oe of og oh oi oj ok ol om on oo op bk">Reduce errors</h1><p id="2494" class="pw-post-body-paragraph mg mh gu mi b mj oq ml mm mn or mp mq mr os mt mu mv ot mx my mz ou nb nc nd gn bk">Mistakes and errors happen, every human errs. Whether someone runs a sequence that uncovers a rare bug or the wrong button is clicked before the action should be completed, we have to be able to handle errors. Good ux not only inform a user when an error has occurred, but they also actively design to prevent errors from happening in the first place.</p><figure class="nh ni nj nk nl nm ne nf paragraph-image"><div role="button" tabindex="0" class="nn no fj np bh nq"><div class="ne nf ng"><picture><source srcSet="https://miro.medium.com/v2/resize:fit:640/format:webp/1*9sbNnpacfid30NjQ-Arg2g.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/format:webp/1*9sbNnpacfid30NjQ-Arg2g.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/format:webp/1*9sbNnpacfid30NjQ-Arg2g.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/format:webp/1*9sbNnpacfid30NjQ-Arg2g.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/format:webp/1*9sbNnpacfid30NjQ-Arg2g.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/format:webp/1*9sbNnpacfid30NjQ-Arg2g.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/format:webp/1*9sbNnpacfid30NjQ-Arg2g.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px" type="image/webp"/><source data-testid="og" srcSet="https://miro.medium.com/v2/resize:fit:640/1*9sbNnpacfid30NjQ-Arg2g.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/1*9sbNnpacfid30NjQ-Arg2g.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/1*9sbNnpacfid30NjQ-Arg2g.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/1*9sbNnpacfid30NjQ-Arg2g.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/1*9sbNnpacfid30NjQ-Arg2g.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/1*9sbNnpacfid30NjQ-Arg2g.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/1*9sbNnpacfid30NjQ-Arg2g.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px"/><img alt="" class="bh ln nr c" width="700" height="372" loading="lazy" role="presentation"/></picture></div></div></figure><h1 id="c4a6" class="ns nt gu bf nu nv nw nx ny nz oa ob oc od oe of og oh oi oj ok ol om on oo op bk">Communicate errors and next steps</h1><p id="b633" class="pw-post-body-paragraph mg mh gu mi b mj oq ml mm mn or mp mq mr os mt mu mv ot mx my mz ou nb nc nd gn bk">When errors happen, it’s important to communicate to the user. Language, tone and design are important in these communications. It is important to provide a clear and understandable reason for an error wherever possible and give instructions so that the error can be solved. Leaning on technical language, or database error terms (as mentioned before) will not be beneficial to the user. Color is also important as it can help indicate the severity of an error or warning.</p><figure class="nh ni nj nk nl nm ne nf paragraph-image"><div role="button" tabindex="0" class="nn no fj np bh nq"><div class="ne nf ov"><picture><source srcSet="https://miro.medium.com/v2/resize:fit:640/format:webp/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/format:webp/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/format:webp/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/format:webp/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/format:webp/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/format:webp/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/format:webp/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px" type="image/webp"/><source data-testid="og" srcSet="https://miro.medium.com/v2/resize:fit:640/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 640w, https://miro.medium.com/v2/resize:fit:720/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 720w, https://miro.medium.com/v2/resize:fit:750/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 750w, https://miro.medium.com/v2/resize:fit:786/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 786w, https://miro.medium.com/v2/resize:fit:828/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 828w, https://miro.medium.com/v2/resize:fit:1100/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 1100w, https://miro.medium.com/v2/resize:fit:1400/1*E-Py6QSnsUE7tYjLi14AOA.jpeg 1400w" sizes="(min-resolution: 4dppx) and (max-width: 700px) 50vw, (-webkit-min-device-pixel-ratio: 4) and (max-width: 700px) 50vw, (min-resolution: 3dppx) and (max-width: 700px) 67vw, (-webkit-min-device-pixel-ratio: 3) and (max-width: 700px) 65vw, (min-resolution: 2.5dppx) and (max-width: 700px) 80vw, (-webkit-min-device-pixel-ratio: 2.5) and (max-width: 700px) 80vw, (min-resolution: 2dppx) and (max-width: 700px) 100vw, (-webkit-min-device-pixel-ratio: 2) and (max-width: 700px) 100vw, 700px"/><img alt="" class="bh ln nr c" width="700" height="372" loading="lazy" role="presentation"/></picture></div></div></figure><p id="fcc7" class="pw-post-body-paragraph mg mh gu mi b mj mk ml mm mn mo mp mq mr ms mt mu mv mw mx my mz na nb nc nd gn bk">From these examples, we can see that some designs are a pleasure to use and others are a challenge! We should not assume what the users like or dislike, but should rather talk to users to be able to satisfy their actual needs. We have to backup our decisions with valid research and by following best design practices and guidelines.</p></div></div></div></div></section></div></div></article></div><div class="ab cb"><div class="ci bh fz ga gb gc"><div class="ow ox ab iv"><div class="oy ab"><a class="oz ay am ao" href="https://medium.com/tag/ux-design?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><div class="pa fj cx pb ge pc pd bf b bg z bk pe">UX Design</div></a></div><div class="oy ab"><a class="oz ay am ao" href="https://medium.com/tag/ui-design?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><div class="pa fj cx pb ge pc pd bf b bg z bk pe">UI Design</div></a></div></div></div></div><div class="l"></div><footer class="pf pg ph pi pj pk pl pm pn ab q po pp c"><div class="l ae"><div class="ab cb"><div class="ci bh fz ga gb gc"><div class="ab cp pq"><div class="ab q ke"><div class="pr l"><span class="l ps pt pu e d"><div class="ab q ke kf"><div class="pw-multi-vote-icon fj kg kh ki kj"><span><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="footerClapButton" href="https://medium.com/m/signin?actionUrl=https%3A%2F%2Fmedium.com%2F_%2Fvote%2Fp%2F7d710ef783b9&operation=register&redirect=https%3A%2F%2Fnihxl.medium.com%2Funderstanding-good-vs-bad-ux-designs-7d710ef783b9&user=Nihal+Abdul+Bari&userId=533c9b6e2c7&source=---footer_actions--7d710ef783b9---------------------clap_footer-----------" rel="noopener follow"><div><div class="bm" aria-hidden="false"><div class="kk ao kl km kn ko am kp kq kr kj"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-label="clap"><path fill-rule="evenodd" d="M11.37.828 12 3.282l.63-2.454zM13.916 3.953l1.523-2.112-1.184-.39zM8.589 1.84l1.522 2.112-.337-2.501zM18.523 18.92c-.86.86-1.75 1.246-2.62 1.33a6 6 0 0 0 .407-.372c2.388-2.389 2.86-4.951 1.399-7.623l-.912-1.603-.79-1.672c-.26-.56-.194-.98.203-1.288a.7.7 0 0 1 .546-.132c.283.046.546.231.728.5l2.363 4.157c.976 1.624 1.141 4.237-1.324 6.702m-10.999-.438L3.37 14.328a.828.828 0 0 1 .585-1.408.83.83 0 0 1 .585.242l2.158 2.157a.365.365 0 0 0 .516-.516l-2.157-2.158-1.449-1.449a.826.826 0 0 1 1.167-1.17l3.438 3.44a.363.363 0 0 0 .516 0 .364.364 0 0 0 0-.516L5.293 9.513l-.97-.97a.826.826 0 0 1 0-1.166.84.84 0 0 1 1.167 0l.97.968 3.437 3.436a.36.36 0 0 0 .517 0 .366.366 0 0 0 0-.516L6.977 7.83a.82.82 0 0 1-.241-.584.82.82 0 0 1 .824-.826c.219 0 .43.087.584.242l5.787 5.787a.366.366 0 0 0 .587-.415l-1.117-2.363c-.26-.56-.194-.98.204-1.289a.7.7 0 0 1 .546-.132c.283.046.545.232.727.501l2.193 3.86c1.302 2.38.883 4.59-1.277 6.75-1.156 1.156-2.602 1.627-4.19 1.367-1.418-.236-2.866-1.033-4.079-2.246M10.75 5.971l2.12 2.12c-.41.502-.465 1.17-.128 1.89l.22.465-3.523-3.523a.8.8 0 0 1-.097-.368c0-.22.086-.428.241-.584a.847.847 0 0 1 1.167 0m7.355 1.705c-.31-.461-.746-.758-1.23-.837a1.44 1.44 0 0 0-1.11.275c-.312.24-.505.543-.59.881a1.74 1.74 0 0 0-.906-.465 1.47 1.47 0 0 0-.82.106l-2.182-2.182a1.56 1.56 0 0 0-2.2 0 1.54 1.54 0 0 0-.396.701 1.56 1.56 0 0 0-2.21-.01 1.55 1.55 0 0 0-.416.753c-.624-.624-1.649-.624-2.237-.037a1.557 1.557 0 0 0 0 2.2c-.239.1-.501.238-.715.453a1.56 1.56 0 0 0 0 2.2l.516.515a1.556 1.556 0 0 0-.753 2.615L7.01 19c1.32 1.319 2.909 2.189 4.475 2.449q.482.08.971.08c.85 0 1.653-.198 2.393-.579.231.033.46.054.686.054 1.266 0 2.457-.52 3.505-1.567 2.763-2.763 2.552-5.734 1.439-7.586z" clip-rule="evenodd"></path></svg></div></div></div></a></span></div><div class="pw-multi-vote-count l ks kt ku kv kw kx ky"><p class="bf b dv z du"><span class="kz">--</span></p></div></div></span><span class="l h g f pv pw"><div class="ab q ke kf"><div class="pw-multi-vote-icon fj kg kh ki kj"><span><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="footerClapButton" href="https://medium.com/m/signin?actionUrl=https%3A%2F%2Fmedium.com%2F_%2Fvote%2Fp%2F7d710ef783b9&operation=register&redirect=https%3A%2F%2Fnihxl.medium.com%2Funderstanding-good-vs-bad-ux-designs-7d710ef783b9&user=Nihal+Abdul+Bari&userId=533c9b6e2c7&source=---footer_actions--7d710ef783b9---------------------clap_footer-----------" rel="noopener follow"><div><div class="bm" aria-hidden="false"><div class="kk ao kl km kn ko am kp kq kr kj"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" aria-label="clap"><path fill-rule="evenodd" d="M11.37.828 12 3.282l.63-2.454zM13.916 3.953l1.523-2.112-1.184-.39zM8.589 1.84l1.522 2.112-.337-2.501zM18.523 18.92c-.86.86-1.75 1.246-2.62 1.33a6 6 0 0 0 .407-.372c2.388-2.389 2.86-4.951 1.399-7.623l-.912-1.603-.79-1.672c-.26-.56-.194-.98.203-1.288a.7.7 0 0 1 .546-.132c.283.046.546.231.728.5l2.363 4.157c.976 1.624 1.141 4.237-1.324 6.702m-10.999-.438L3.37 14.328a.828.828 0 0 1 .585-1.408.83.83 0 0 1 .585.242l2.158 2.157a.365.365 0 0 0 .516-.516l-2.157-2.158-1.449-1.449a.826.826 0 0 1 1.167-1.17l3.438 3.44a.363.363 0 0 0 .516 0 .364.364 0 0 0 0-.516L5.293 9.513l-.97-.97a.826.826 0 0 1 0-1.166.84.84 0 0 1 1.167 0l.97.968 3.437 3.436a.36.36 0 0 0 .517 0 .366.366 0 0 0 0-.516L6.977 7.83a.82.82 0 0 1-.241-.584.82.82 0 0 1 .824-.826c.219 0 .43.087.584.242l5.787 5.787a.366.366 0 0 0 .587-.415l-1.117-2.363c-.26-.56-.194-.98.204-1.289a.7.7 0 0 1 .546-.132c.283.046.545.232.727.501l2.193 3.86c1.302 2.38.883 4.59-1.277 6.75-1.156 1.156-2.602 1.627-4.19 1.367-1.418-.236-2.866-1.033-4.079-2.246M10.75 5.971l2.12 2.12c-.41.502-.465 1.17-.128 1.89l.22.465-3.523-3.523a.8.8 0 0 1-.097-.368c0-.22.086-.428.241-.584a.847.847 0 0 1 1.167 0m7.355 1.705c-.31-.461-.746-.758-1.23-.837a1.44 1.44 0 0 0-1.11.275c-.312.24-.505.543-.59.881a1.74 1.74 0 0 0-.906-.465 1.47 1.47 0 0 0-.82.106l-2.182-2.182a1.56 1.56 0 0 0-2.2 0 1.54 1.54 0 0 0-.396.701 1.56 1.56 0 0 0-2.21-.01 1.55 1.55 0 0 0-.416.753c-.624-.624-1.649-.624-2.237-.037a1.557 1.557 0 0 0 0 2.2c-.239.1-.501.238-.715.453a1.56 1.56 0 0 0 0 2.2l.516.515a1.556 1.556 0 0 0-.753 2.615L7.01 19c1.32 1.319 2.909 2.189 4.475 2.449q.482.08.971.08c.85 0 1.653-.198 2.393-.579.231.033.46.054.686.054 1.266 0 2.457-.52 3.505-1.567 2.763-2.763 2.552-5.734 1.439-7.586z" clip-rule="evenodd"></path></svg></div></div></div></a></span></div><div class="pw-multi-vote-count l ks kt ku kv kw kx ky"><p class="bf b dv z du"><span class="kz">--</span></p></div></div></span></div><div class="bq ab"><div><div class="bm" aria-hidden="false"><button class="ao kk la lb ab q fk lc ld" aria-label="responses"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" class="le"><path d="M18.006 16.803c1.533-1.456 2.234-3.325 2.234-5.321C20.24 7.357 16.709 4 12.191 4S4 7.357 4 11.482c0 4.126 3.674 7.482 8.191 7.482.817 0 1.622-.111 2.393-.327.231.2.48.391.744.559 1.06.693 2.203 1.044 3.399 1.044.224-.008.4-.112.486-.287a.49.49 0 0 0-.042-.518c-.495-.67-.845-1.364-1.04-2.057a4 4 0 0 1-.125-.598zm-3.122 1.055-.067-.223-.315.096a8 8 0 0 1-2.311.338c-4.023 0-7.292-2.955-7.292-6.587 0-3.633 3.269-6.588 7.292-6.588 4.014 0 7.112 2.958 7.112 6.593 0 1.794-.608 3.469-2.027 4.72l-.195.168v.255c0 .056 0 .151.016.295.025.231.081.478.154.733.154.558.398 1.117.722 1.659a5.3 5.3 0 0 1-2.165-.845c-.276-.176-.714-.383-.941-.59z"></path></svg></button></div></div></div></div><div class="ab q"><div class="px l is"><div><div class="bm" aria-hidden="false"><span><a class="af ag ah ai aj ak al am an ao ap aq ar as at" data-testid="footerBookmarkButton" href="https://medium.com/m/signin?actionUrl=https%3A%2F%2Fmedium.com%2F_%2Fbookmark%2Fp%2F7d710ef783b9&operation=register&redirect=https%3A%2F%2Fnihxl.medium.com%2Funderstanding-good-vs-bad-ux-designs-7d710ef783b9&source=---footer_actions--7d710ef783b9---------------------bookmark_footer-----------" rel="noopener follow"><svg xmlns="http://www.w3.org/2000/svg" width="25" height="25" fill="none" viewBox="0 0 25 25" class="du lg" aria-label="Add to list bookmark button"><path fill="currentColor" d="M18 2.5a.5.5 0 0 1 1 0V5h2.5a.5.5 0 0 1 0 1H19v2.5a.5.5 0 1 1-1 0V6h-2.5a.5.5 0 0 1 0-1H18zM7 7a1 1 0 0 1 1-1h3.5a.5.5 0 0 0 0-1H8a2 2 0 0 0-2 2v14a.5.5 0 0 0 .805.396L12.5 17l5.695 4.396A.5.5 0 0 0 19 21v-8.5a.5.5 0 0 0-1 0v7.485l-5.195-4.012a.5.5 0 0 0-.61 0L7 19.985z"></path></svg></a></span></div></div></div><div class="px l is"><div class="bm" aria-hidden="false" aria-describedby="postFooterSocialMenu" aria-labelledby="postFooterSocialMenu"><div><div class="bm" aria-hidden="false"><button aria-controls="postFooterSocialMenu" aria-expanded="false" aria-label="Share Post" data-testid="footerSocialShareButton" class="af fk ah ai aj ak al lo an ao ap ex lp lq ld lr"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" fill-rule="evenodd" d="M15.218 4.931a.4.4 0 0 1-.118.132l.012.006a.45.45 0 0 1-.292.074.5.5 0 0 1-.3-.13l-2.02-2.02v7.07c0 .28-.23.5-.5.5s-.5-.22-.5-.5v-7.04l-2 2a.45.45 0 0 1-.57.04h-.02a.4.4 0 0 1-.16-.3.4.4 0 0 1 .1-.32l2.8-2.8a.5.5 0 0 1 .7 0l2.8 2.79a.42.42 0 0 1 .068.498m-.106.138.008.004v-.01zM16 7.063h1.5a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2h-11c-1.1 0-2-.9-2-2v-10a2 2 0 0 1 2-2H8a.5.5 0 0 1 .35.15.5.5 0 0 1 .15.35.5.5 0 0 1-.15.35.5.5 0 0 1-.35.15H6.4c-.5 0-.9.4-.9.9v10.2a.9.9 0 0 0 .9.9h11.2c.5 0 .9-.4.9-.9v-10.2c0-.5-.4-.9-.9-.9H16a.5.5 0 0 1 0-1" clip-rule="evenodd"></path></svg></button></div></div></div></div></div></div></div></div></div></footer><div class="py pz qa qb qc l bx"><div class="ab cb"><div class="ci bh fz ga gb gc"><div class="ab qd qe qf iu it"><div class="qg qh qi qj qk ql qm qn qo qp ab cp"><div class="h k"><a tabindex="0" rel="noopener follow" href="/?source=post_page---post_author_info--7d710ef783b9--------------------------------"><div class="l fj"><img alt="Nihal Abdul Bari" class="l fd by ic ib cx" src="https://miro.medium.com/v2/resize:fill:96:96/1*veo3g1SZpyFTlNmTgp22Tw.png" width="48" height="48" loading="lazy"/><div class="fr by l ic ib fs n ay qq"></div></div></a></div><div class="j i d"><a tabindex="0" rel="noopener follow" href="/?source=post_page---post_author_info--7d710ef783b9--------------------------------"><div class="l fj"><img alt="Nihal Abdul Bari" class="l fd by qr qs cx" src="https://miro.medium.com/v2/resize:fill:128:128/1*veo3g1SZpyFTlNmTgp22Tw.png" width="64" height="64" loading="lazy"/><div class="fr by l qr qs fs n ay qq"></div></div></a></div><div class="j i d qt is"><div class="ab"><span><button class="bf b bg z qu pa qv qw qx qy qz ev ew ra rb rc fa fb fc fd bm fe ff">Follow</button></span></div></div></div><div class="ab co rd"><div class="re rf rg rh ri l"><a class="af ag ah aj ak al am an ao ap aq ar as at ab q" rel="noopener follow" href="/?source=post_page---post_author_info--7d710ef783b9--------------------------------"><h2 class="pw-author-name bf rk rl rm rn ro rp rq mr rr rs mv rt ru mz rv rw bk"><span class="gn rj">Written by Nihal Abdul Bari</span></h2></a><div class="oy ab ia"><div class="l is"><span class="pw-follower-count bf b bg z du"><a class="af ag ah ai aj ak al am an ao ap aq ar il" rel="noopener follow" href="/followers?source=post_page---post_author_info--7d710ef783b9--------------------------------">19 Followers</a></span></div><div class="bf b bg z du ab rx"><span class="im l" aria-hidden="true"><span class="bf b bg z du">·</span></span><a class="af ag ah ai aj ak al am an ao ap aq ar il" rel="noopener follow" href="/following?source=post_page---post_author_info--7d710ef783b9--------------------------------">176 Following</a></div></div><div class="ry l"><p class="bf b bg z bk"><span class="gn">A product designer with an obsession for crafting fine-user experiences. Now, helping design the best 100ms experience possible.</span></p></div></div></div><div class="h k"><div class="ab"><span><button class="bf b bg z qu pa qv qw qx qy qz ev ew ra rb rc fa fb fc fd bm fe ff">Follow</button></span></div></div></div><div class="rz bh sa sb"></div></div></div><div class="h k j"><div class="rz bh sa sc"></div><div class="ab cb"><div class="ci bh fz ga gb gc"><div class="sd ab ke iv"><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://help.medium.com/hc/en-us?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Help</p></a></div><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://medium.statuspage.io/?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Status</p></a></div><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://medium.com/about?autoplay=1&source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">About</p></a></div><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://medium.com/jobs-at-medium/work-at-medium-959d1a85284e?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Careers</p></a></div><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="pressinquiries@medium.com?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Press</p></a></div><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://blog.medium.com/?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Blog</p></a></div><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://policy.medium.com/medium-privacy-policy-f03bf92035c9?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Privacy</p></a></div><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://policy.medium.com/medium-terms-of-service-9db0094a1e0f?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Terms</p></a></div><div class="se sf l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://speechify.com/medium?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Text to speech</p></a></div><div class="se l"><a class="af ag ah ai aj ak al am an ao ap aq ar as at" href="https://medium.com/business?source=post_page-----7d710ef783b9--------------------------------" rel="noopener follow"><p class="bf b dv z du">Teams</p></a></div></div></div></div></div></div></div></div></div></div><script>window.__BUILD_ID__="main-20241204-183243-cee04dfc04"</script><script>window.__GRAPHQL_URI__ = "https://nihxl.medium.com/_/graphql"</script><script>window.__PRELOADED_STATE__ = {"algolia":{"queries":{}},"cache":{"experimentGroupSet":true,"reason":"","group":"enabled","tags":["group-edgeCachePosts","post-7d710ef783b9","user-533c9b6e2c7"],"serverVariantState":"44136fa355b3678a1146ad16f7e8649e94fb4fc21fe77e8310c060f61caaff8a","middlewareEnabled":true,"cacheStatus":"DYNAMIC","shouldUseCache":true,"vary":[],"lohpSummerUpsellEnabled":false,"postBottomResponsesEnabled":false},"client":{"hydrated":false,"isUs":false,"isNativeMedium":false,"isSafariMobile":false,"isSafari":false,"isFirefox":false,"routingEntity":{"type":"USER","id":"533c9b6e2c7","explicit":true},"viewerIsBot":false},"debug":{"requestId":"7dd9bec1-a8a0-4967-bf92-3584259ae848","hybridDevServices":[],"originalSpanCarrier":{"traceparent":"00-0b54e29c5860421e61685be2facdcbe9-d968bb245ab63b95-01"}},"multiVote":{"clapsPerPost":{}},"navigation":{"branch":{"show":null,"hasRendered":null,"blockedByCTA":false},"hideGoogleOneTap":false,"hasRenderedAlternateUserBanner":null,"currentLocation":"https:\u002F\u002Fnihxl.medium.com\u002Funderstanding-good-vs-bad-ux-designs-7d710ef783b9","host":"nihxl.medium.com","hostname":"nihxl.medium.com","referrer":"","hasSetReferrer":false,"susiModal":{"step":null,"operation":"register"},"postRead":false,"partnerProgram":{"selectedCountryCode":null},"queryString":"","currentHash":""},"config":{"nodeEnv":"production","version":"main-20241204-183243-cee04dfc04","target":"production","productName":"Medium","publicUrl":"https:\u002F\u002Fcdn-client.medium.com\u002Flite","authDomain":"medium.com","authGoogleClientId":"216296035834-k1k6qe060s2tp2a2jam4ljdcms00sttg.apps.googleusercontent.com","favicon":"production","glyphUrl":"https:\u002F\u002Fglyph.medium.com","branchKey":"key_live_ofxXr2qTrrU9NqURK8ZwEhknBxiI6KBm","algolia":{"appId":"MQ57UUUQZ2","apiKeySearch":"394474ced050e3911ae2249ecc774921","indexPrefix":"medium_","host":"-dsn.algolia.net"},"recaptchaKey":"6Lfc37IUAAAAAKGGtC6rLS13R1Hrw_BqADfS1LRk","recaptcha3Key":"6Lf8R9wUAAAAABMI_85Wb8melS7Zj6ziuf99Yot5","recaptchaEnterpriseKeyId":"6Le-uGgpAAAAAPprRaokM8AKthQ9KNGdoxaGUvVp","datadog":{"applicationId":"6702d87d-a7e0-42fe-bbcb-95b469547ea0","clientToken":"pub853ea8d17ad6821d9f8f11861d23dfed","rumToken":"pubf9cc52896502b9413b68ba36fc0c7162","context":{"deployment":{"target":"production","tag":"main-20241204-183243-cee04dfc04","commit":"cee04dfc041ca9e22c744c3181f58e28829ae62d"}},"datacenter":"us"},"googleAnalyticsCode":"G-7JY7T788PK","googlePay":{"apiVersion":"2","apiVersionMinor":"0","merchantId":"BCR2DN6TV7EMTGBM","merchantName":"Medium","instanceMerchantId":"13685562959212738550"},"applePay":{"version":3},"signInWallCustomDomainCollectionIds":["3a8144eabfe3","336d898217ee","61061eb0c96b","138adf9c44c","819cc2aaeee0"],"mediumMastodonDomainName":"me.dm","mediumOwnedAndOperatedCollectionIds":["8a9336e5bb4","b7e45b22fec3","193b68bd4fba","8d6b8a439e32","54c98c43354d","3f6ecf56618","d944778ce714","92d2092dc598","ae2a65f35510","1285ba81cada","544c7006046e","fc8964313712","40187e704f1c","88d9857e584e","7b6769f2748b","bcc38c8f6edf","cef6983b292","cb8577c9149e","444d13b52878","713d7dbc99b0","ef8e90590e66","191186aaafa0","55760f21cdc5","9dc80918cc93","bdc4052bbdba","8ccfed20cbb2"],"tierOneDomains":["medium.com","thebolditalic.com","arcdigital.media","towardsdatascience.com","uxdesign.cc","codeburst.io","psiloveyou.xyz","writingcooperative.com","entrepreneurshandbook.co","prototypr.io","betterhumans.coach.me","theascent.pub"],"topicsToFollow":["d61cf867d93f","8a146bc21b28","1eca0103fff3","4d562ee63426","aef1078a3ef5","e15e46793f8d","6158eb913466","55f1c20aba7a","3d18b94f6858","4861fee224fd","63c6f1f93ee","1d98b3a9a871","decb52b64abf","ae5d4995e225","830cded25262"],"topicToTagMappings":{"accessibility":"accessibility","addiction":"addiction","android-development":"android-development","art":"art","artificial-intelligence":"artificial-intelligence","astrology":"astrology","basic-income":"basic-income","beauty":"beauty","biotech":"biotech","blockchain":"blockchain","books":"books","business":"business","cannabis":"cannabis","cities":"cities","climate-change":"climate-change","comics":"comics","coronavirus":"coronavirus","creativity":"creativity","cryptocurrency":"cryptocurrency","culture":"culture","cybersecurity":"cybersecurity","data-science":"data-science","design":"design","digital-life":"digital-life","disability":"disability","economy":"economy","education":"education","equality":"equality","family":"family","feminism":"feminism","fiction":"fiction","film":"film","fitness":"fitness","food":"food","freelancing":"freelancing","future":"future","gadgets":"gadgets","gaming":"gaming","gun-control":"gun-control","health":"health","history":"history","humor":"humor","immigration":"immigration","ios-development":"ios-development","javascript":"javascript","justice":"justice","language":"language","leadership":"leadership","lgbtqia":"lgbtqia","lifestyle":"lifestyle","machine-learning":"machine-learning","makers":"makers","marketing":"marketing","math":"math","media":"media","mental-health":"mental-health","mindfulness":"mindfulness","money":"money","music":"music","neuroscience":"neuroscience","nonfiction":"nonfiction","outdoors":"outdoors","parenting":"parenting","pets":"pets","philosophy":"philosophy","photography":"photography","podcasts":"podcast","poetry":"poetry","politics":"politics","privacy":"privacy","product-management":"product-management","productivity":"productivity","programming":"programming","psychedelics":"psychedelics","psychology":"psychology","race":"race","relationships":"relationships","religion":"religion","remote-work":"remote-work","san-francisco":"san-francisco","science":"science","self":"self","self-driving-cars":"self-driving-cars","sexuality":"sexuality","social-media":"social-media","society":"society","software-engineering":"software-engineering","space":"space","spirituality":"spirituality","sports":"sports","startups":"startup","style":"style","technology":"technology","transportation":"transportation","travel":"travel","true-crime":"true-crime","tv":"tv","ux":"ux","venture-capital":"venture-capital","visual-design":"visual-design","work":"work","world":"world","writing":"writing"},"defaultImages":{"avatar":{"imageId":"1*dmbNkD5D-u45r44go_cf0g.png","height":150,"width":150},"orgLogo":{"imageId":"7*V1_7XP4snlmqrc_0Njontw.png","height":110,"width":500},"postLogo":{"imageId":"bd978bb536350a710e8efb012513429cabdc4c28700604261aeda246d0f980b7","height":810,"width":1440},"postPreviewImage":{"imageId":"1*hn4v1tCaJy7cWMyb0bpNpQ.png","height":386,"width":579}},"collectionStructuredData":{"8d6b8a439e32":{"name":"Elemental","data":{"@type":"NewsMediaOrganization","ethicsPolicy":"https:\u002F\u002Fhelp.medium.com\u002Fhc\u002Fen-us\u002Farticles\u002F360043290473","logo":{"@type":"ImageObject","url":"https:\u002F\u002Fcdn-images-1.medium.com\u002Fmax\u002F980\u002F1*9ygdqoKprhwuTVKUM0DLPA@2x.png","width":980,"height":159}}},"3f6ecf56618":{"name":"Forge","data":{"@type":"NewsMediaOrganization","ethicsPolicy":"https:\u002F\u002Fhelp.medium.com\u002Fhc\u002Fen-us\u002Farticles\u002F360043290473","logo":{"@type":"ImageObject","url":"https:\u002F\u002Fcdn-images-1.medium.com\u002Fmax\u002F596\u002F1*uULpIlImcO5TDuBZ6lm7Lg@2x.png","width":596,"height":183}}},"ae2a65f35510":{"name":"GEN","data":{"@type":"NewsMediaOrganization","ethicsPolicy":"https:\u002F\u002Fhelp.medium.com\u002Fhc\u002Fen-us\u002Farticles\u002F360043290473","logo":{"@type":"ImageObject","url":"https:\u002F\u002Fmiro.medium.com\u002Fmax\u002F264\u002F1*RdVZMdvfV3YiZTw6mX7yWA.png","width":264,"height":140}}},"88d9857e584e":{"name":"LEVEL","data":{"@type":"NewsMediaOrganization","ethicsPolicy":"https:\u002F\u002Fhelp.medium.com\u002Fhc\u002Fen-us\u002Farticles\u002F360043290473","logo":{"@type":"ImageObject","url":"https:\u002F\u002Fmiro.medium.com\u002Fmax\u002F540\u002F1*JqYMhNX6KNNb2UlqGqO2WQ.png","width":540,"height":108}}},"7b6769f2748b":{"name":"Marker","data":{"@type":"NewsMediaOrganization","ethicsPolicy":"https:\u002F\u002Fhelp.medium.com\u002Fhc\u002Fen-us\u002Farticles\u002F360043290473","logo":{"@type":"ImageObject","url":"https:\u002F\u002Fcdn-images-1.medium.com\u002Fmax\u002F383\u002F1*haCUs0wF6TgOOvfoY-jEoQ@2x.png","width":383,"height":92}}},"444d13b52878":{"name":"OneZero","data":{"@type":"NewsMediaOrganization","ethicsPolicy":"https:\u002F\u002Fhelp.medium.com\u002Fhc\u002Fen-us\u002Farticles\u002F360043290473","logo":{"@type":"ImageObject","url":"https:\u002F\u002Fmiro.medium.com\u002Fmax\u002F540\u002F1*cw32fIqCbRWzwJaoQw6BUg.png","width":540,"height":123}}},"8ccfed20cbb2":{"name":"Zora","data":{"@type":"NewsMediaOrganization","ethicsPolicy":"https:\u002F\u002Fhelp.medium.com\u002Fhc\u002Fen-us\u002Farticles\u002F360043290473","logo":{"@type":"ImageObject","url":"https:\u002F\u002Fmiro.medium.com\u002Fmax\u002F540\u002F1*tZUQqRcCCZDXjjiZ4bDvgQ.png","width":540,"height":106}}}},"embeddedPostIds":{"coronavirus":"cd3010f9d81f"},"sharedCdcMessaging":{"COVID_APPLICABLE_TAG_SLUGS":[],"COVID_APPLICABLE_TOPIC_NAMES":[],"COVID_APPLICABLE_TOPIC_NAMES_FOR_TOPIC_PAGE":[],"COVID_MESSAGES":{"tierA":{"text":"For more information on the novel coronavirus and Covid-19, visit cdc.gov.","markups":[{"start":66,"end":73,"href":"https:\u002F\u002Fwww.cdc.gov\u002Fcoronavirus\u002F2019-nCoV"}]},"tierB":{"text":"Anyone can publish on Medium per our Policies, but we don’t fact-check every story. For more info about the coronavirus, see cdc.gov.","markups":[{"start":37,"end":45,"href":"https:\u002F\u002Fhelp.medium.com\u002Fhc\u002Fen-us\u002Fcategories\u002F201931128-Policies-Safety"},{"start":125,"end":132,"href":"https:\u002F\u002Fwww.cdc.gov\u002Fcoronavirus\u002F2019-nCoV"}]},"paywall":{"text":"This article has been made free for everyone, thanks to Medium Members. For more information on the novel coronavirus and Covid-19, visit cdc.gov.","markups":[{"start":56,"end":70,"href":"https:\u002F\u002Fmedium.com\u002Fmembership"},{"start":138,"end":145,"href":"https:\u002F\u002Fwww.cdc.gov\u002Fcoronavirus\u002F2019-nCoV"}]},"unbound":{"text":"This article is free for everyone, thanks to Medium Members. For more information on the novel coronavirus and Covid-19, visit cdc.gov.","markups":[{"start":45,"end":59,"href":"https:\u002F\u002Fmedium.com\u002Fmembership"},{"start":127,"end":134,"href":"https:\u002F\u002Fwww.cdc.gov\u002Fcoronavirus\u002F2019-nCoV"}]}},"COVID_BANNER_POST_ID_OVERRIDE_WHITELIST":["3b31a67bff4a"]},"sharedVoteMessaging":{"TAGS":["politics","election-2020","government","us-politics","election","2020-presidential-race","trump","donald-trump","democrats","republicans","congress","republican-party","democratic-party","biden","joe-biden","maga"],"TOPICS":["politics","election"],"MESSAGE":{"text":"Find out more about the U.S. election results here.","markups":[{"start":46,"end":50,"href":"https:\u002F\u002Fcookpolitical.com\u002F2020-national-popular-vote-tracker"}]},"EXCLUDE_POSTS":["397ef29e3ca5"]},"embedPostRules":[],"recircOptions":{"v1":{"limit":3},"v2":{"limit":8}},"braintreeClientKey":"production_zjkj96jm_m56f8fqpf7ngnrd4","braintree":{"enabled":true,"merchantId":"m56f8fqpf7ngnrd4","merchantAccountId":{"usd":"AMediumCorporation_instant","eur":"amediumcorporation_EUR","cad":"amediumcorporation_CAD"},"publicKey":"ds2nn34bg2z7j5gd","braintreeEnvironment":"production","dashboardUrl":"https:\u002F\u002Fwww.braintreegateway.com\u002Fmerchants","gracePeriodDurationInDays":14,"mediumMembershipPlanId":{"monthly":"ce105f8c57a3","monthlyV2":"e8a5e126-792b-4ee6-8fba-d574c1b02fc5","monthlyWithTrial":"d5ee3dbe3db8","monthlyPremium":"fa741a9b47a2","yearly":"a40ad4a43185","yearlyV2":"3815d7d6-b8ca-4224-9b8c-182f9047866e","yearlyStaff":"d74fb811198a","yearlyWithTrial":"b3bc7350e5c7","yearlyPremium":"e21bd2c12166","monthlyOneYearFree":"e6c0637a-2bad-4171-ab4f-3c268633d83c","monthly25PercentOffFirstYear":"235ecc62-0cdb-49ae-9378-726cd21c504b","monthly20PercentOffFirstYear":"ba518864-9c13-4a99-91ca-411bf0cac756","monthly15PercentOffFirstYear":"594c029b-9f89-43d5-88f8-8173af4e070e","monthly10PercentOffFirstYear":"c6c7bc9a-40f2-4b51-8126-e28511d5bdb0","monthlyForStudents":"629ebe51-da7d-41fd-8293-34cd2f2030a8","yearlyOneYearFree":"78ba7be9-0d9f-4ece-aa3e-b54b826f2bf1","yearly25PercentOffFirstYear":"2dbb010d-bb8f-4eeb-ad5c-a08509f42d34","yearly20PercentOffFirstYear":"47565488-435b-47f8-bf93-40d5fbe0ebc8","yearly15PercentOffFirstYear":"8259809b-0881-47d9-acf7-6c001c7f720f","yearly10PercentOffFirstYear":"9dd694fb-96e1-472c-8d9e-3c868d5c1506","yearlyForStudents":"e29345ef-ab1c-4234-95c5-70e50fe6bc23","monthlyCad":"p52orjkaceei","yearlyCad":"h4q9g2up9ktt"},"braintreeDiscountId":{"oneMonthFree":"MONTHS_FREE_01","threeMonthsFree":"MONTHS_FREE_03","sixMonthsFree":"MONTHS_FREE_06","fiftyPercentOffOneYear":"FIFTY_PERCENT_OFF_ONE_YEAR"},"3DSecureVersion":"2","defaultCurrency":"usd","providerPlanIdCurrency":{"4ycw":"usd","rz3b":"usd","3kqm":"usd","jzw6":"usd","c2q2":"usd","nnsw":"usd","q8qw":"usd","d9y6":"usd","fx7w":"cad","nwf2":"cad"}},"paypalClientId":"AXj1G4fotC2GE8KzWX9mSxCH1wmPE3nJglf4Z2ig_amnhvlMVX87otaq58niAg9iuLktVNF_1WCMnN7v","paypal":{"host":"https:\u002F\u002Fapi.paypal.com:443","clientMode":"production","serverMode":"live","webhookId":"4G466076A0294510S","monthlyPlan":{"planId":"P-9WR0658853113943TMU5FDQA","name":"Medium Membership (Monthly) with setup fee","description":"Unlimited access to the best and brightest stories on Medium. Membership billed monthly."},"yearlyPlan":{"planId":"P-7N8963881P8875835MU5JOPQ","name":"Medium Membership (Annual) with setup fee","description":"Unlimited access to the best and brightest stories on Medium. Membership billed annually."},"oneYearGift":{"name":"Medium Membership (1 Year, Digital Gift Code)","description":"Unlimited access to the best and brightest stories on Medium. Gift codes can be redeemed at medium.com\u002Fredeem.","price":"50.00","currency":"USD","sku":"membership-gift-1-yr"},"oldMonthlyPlan":{"planId":"P-96U02458LM656772MJZUVH2Y","name":"Medium Membership (Monthly)","description":"Unlimited access to the best and brightest stories on Medium. Membership billed monthly."},"oldYearlyPlan":{"planId":"P-59P80963JF186412JJZU3SMI","name":"Medium Membership (Annual)","description":"Unlimited access to the best and brightest stories on Medium. Membership billed annually."},"monthlyPlanWithTrial":{"planId":"P-66C21969LR178604GJPVKUKY","name":"Medium Membership (Monthly) with setup fee","description":"Unlimited access to the best and brightest stories on Medium. Membership billed monthly."},"yearlyPlanWithTrial":{"planId":"P-6XW32684EX226940VKCT2MFA","name":"Medium Membership (Annual) with setup fee","description":"Unlimited access to the best and brightest stories on Medium. Membership billed annually."},"oldMonthlyPlanNoSetupFee":{"planId":"P-4N046520HR188054PCJC7LJI","name":"Medium Membership (Monthly)","description":"Unlimited access to the best and brightest stories on Medium. Membership billed monthly."},"oldYearlyPlanNoSetupFee":{"planId":"P-7A4913502Y5181304CJEJMXQ","name":"Medium Membership (Annual)","description":"Unlimited access to the best and brightest stories on Medium. Membership billed annually."},"sdkUrl":"https:\u002F\u002Fwww.paypal.com\u002Fsdk\u002Fjs"},"stripePublishableKey":"pk_live_7FReX44VnNIInZwrIIx6ghjl","log":{"json":true,"level":"info"},"imageUploadMaxSizeMb":25,"staffPicks":{"title":"Staff Picks","catalogId":"c7bc6e1ee00f"}},"session":{"xsrf":""}}</script><script>window.__APOLLO_STATE__ = {"ROOT_QUERY":{"__typename":"Query","viewer":null,"postResult({\"id\":\"7d710ef783b9\"})":{"__ref":"Post:7d710ef783b9"},"collectionByDomainOrSlug({\"domainOrSlug\":\"nihxl.medium.com\"})":null},"LinkedAccounts:533c9b6e2c7":{"__typename":"LinkedAccounts","mastodon":null,"id":"533c9b6e2c7"},"User:533c9b6e2c7":{"__typename":"User","id":"533c9b6e2c7","linkedAccounts":{"__ref":"LinkedAccounts:533c9b6e2c7"},"isSuspended":false,"name":"Nihal Abdul Bari","imageId":"1*veo3g1SZpyFTlNmTgp22Tw.png","customDomainState":{"__typename":"CustomDomainState","live":{"__typename":"CustomDomain","domain":"nihxl.medium.com"}},"hasSubdomain":true,"username":"nihxl","verifications":{"__typename":"VerifiedInfo","isBookAuthor":false},"socialStats":{"__typename":"SocialStats","followerCount":19,"followingCount":139,"collectionFollowingCount":37},"bio":"A product designer with an obsession for crafting fine-user experiences. Now, helping design the best 100ms experience possible.","membership":null,"allowNotes":true,"viewerEdge":{"__ref":"UserViewerEdge:userId:533c9b6e2c7-viewerId:lo_82d9b67c6632"},"twitterScreenName":"nihalerooth"},"Paragraph:b66bd0a319e_0":{"__typename":"Paragraph","id":"b66bd0a319e_0","name":"6ce2","type":"H3","href":null,"layout":null,"metadata":null,"text":"Understanding Good vs Bad UX Designs","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_1":{"__typename":"Paragraph","id":"b66bd0a319e_1","name":"156d","type":"P","href":null,"layout":null,"metadata":null,"text":"Understanding the difference between good and bad user experience design can be subjective and sometimes hard to notice. But I have some helpful tips that can help us understand what makes for a good user experience.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"ImageMetadata:1*-uQsCHsccSsMpmcO1-neig.jpeg":{"__typename":"ImageMetadata","id":"1*-uQsCHsccSsMpmcO1-neig.jpeg","originalHeight":2084,"originalWidth":3126,"focusPercentX":null,"focusPercentY":null,"alt":null},"Paragraph:b66bd0a319e_2":{"__typename":"Paragraph","id":"b66bd0a319e_2","name":"d40a","type":"IMG","href":null,"layout":"INSET_CENTER","metadata":{"__ref":"ImageMetadata:1*-uQsCHsccSsMpmcO1-neig.jpeg"},"text":"","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_3":{"__typename":"Paragraph","id":"b66bd0a319e_3","name":"e079","type":"P","href":null,"layout":null,"metadata":null,"text":"Grasping these tips is one element, seeing how you use them in practice is another element of understanding good vs bad user experiences. In this article, we will explore some examples of good vs bad ux designs.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_4":{"__typename":"Paragraph","id":"b66bd0a319e_4","name":"8fd5","type":"H3","href":null,"layout":null,"metadata":null,"text":"Reveal current state","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_5":{"__typename":"Paragraph","id":"b66bd0a319e_5","name":"d8f7","type":"P","href":null,"layout":null,"metadata":null,"text":"One of the heuristics developed by Jakob Nielsen, visibility of system status states that users should be informed about what is happening inside a product or website, in a reasonable response time following the action.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_6":{"__typename":"Paragraph","id":"b66bd0a319e_6","name":"3889","type":"P","href":null,"layout":null,"metadata":null,"text":"This means that applications that don’t provide timely feedback on what the status might be, may create a negative or confusing experience. Take for instance the action of uploading a file. As a user when you upload a file, you want to be able to know whether your action was recognized. Delaying, or not showing a response to the action leaves a user questioning.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"ImageMetadata:1*gfLsjKvKp6W0XjHdq1vxWA.gif":{"__typename":"ImageMetadata","id":"1*gfLsjKvKp6W0XjHdq1vxWA.gif","originalHeight":1659,"originalWidth":3126,"focusPercentX":null,"focusPercentY":null,"alt":null},"Paragraph:b66bd0a319e_7":{"__typename":"Paragraph","id":"b66bd0a319e_7","name":"290c","type":"IMG","href":null,"layout":"INSET_CENTER","metadata":{"__ref":"ImageMetadata:1*gfLsjKvKp6W0XjHdq1vxWA.gif"},"text":"","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_8":{"__typename":"Paragraph","id":"b66bd0a319e_8","name":"bef6","type":"H3","href":null,"layout":null,"metadata":null,"text":"Effective use of color and hierarchy","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_9":{"__typename":"Paragraph","id":"b66bd0a319e_9","name":"a97f","type":"P","href":null,"layout":null,"metadata":null,"text":"Though the visual aesthetic may not be the top priority in a ux process, ignoring visual design can lead to bad experiences. The practice of pairing thoughtful experience design with clear, hierarchical visual design can create easy to understand digital experiences that lead to higher effectiveness.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"ImageMetadata:1*7Zdpyn_mgoVKXZbknrBeyA.jpeg":{"__typename":"ImageMetadata","id":"1*7Zdpyn_mgoVKXZbknrBeyA.jpeg","originalHeight":1659,"originalWidth":3125,"focusPercentX":null,"focusPercentY":null,"alt":null},"Paragraph:b66bd0a319e_10":{"__typename":"Paragraph","id":"b66bd0a319e_10","name":"c7ee","type":"IMG","href":null,"layout":"INSET_CENTER","metadata":{"__ref":"ImageMetadata:1*7Zdpyn_mgoVKXZbknrBeyA.jpeg"},"text":"","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_11":{"__typename":"Paragraph","id":"b66bd0a319e_11","name":"8fbe","type":"H3","href":null,"layout":null,"metadata":null,"text":"Using clear and understandable language","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_12":{"__typename":"Paragraph","id":"b66bd0a319e_12","name":"6077","type":"P","href":null,"layout":null,"metadata":null,"text":"A good user experience is one that speaks to the user with words they understand. Even top apps fall into the trap of using highly technical terms that only experts may understand. Even if a user understands, or can make sense of it, in a tense situation, highly technical language can lead to user error and costly mistakes.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"ImageMetadata:1*aTmHbpULfDoLIH4ny2xg4Q.jpeg":{"__typename":"ImageMetadata","id":"1*aTmHbpULfDoLIH4ny2xg4Q.jpeg","originalHeight":1659,"originalWidth":3126,"focusPercentX":null,"focusPercentY":null,"alt":null},"Paragraph:b66bd0a319e_13":{"__typename":"Paragraph","id":"b66bd0a319e_13","name":"6974","type":"IMG","href":null,"layout":"INSET_CENTER","metadata":{"__ref":"ImageMetadata:1*aTmHbpULfDoLIH4ny2xg4Q.jpeg"},"text":"","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_14":{"__typename":"Paragraph","id":"b66bd0a319e_14","name":"d5a0","type":"H3","href":null,"layout":null,"metadata":null,"text":"Reduce errors","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_15":{"__typename":"Paragraph","id":"b66bd0a319e_15","name":"2494","type":"P","href":null,"layout":null,"metadata":null,"text":"Mistakes and errors happen, every human errs. Whether someone runs a sequence that uncovers a rare bug or the wrong button is clicked before the action should be completed, we have to be able to handle errors. Good ux not only inform a user when an error has occurred, but they also actively design to prevent errors from happening in the first place.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"ImageMetadata:1*9sbNnpacfid30NjQ-Arg2g.jpeg":{"__typename":"ImageMetadata","id":"1*9sbNnpacfid30NjQ-Arg2g.jpeg","originalHeight":1659,"originalWidth":3126,"focusPercentX":null,"focusPercentY":null,"alt":null},"Paragraph:b66bd0a319e_16":{"__typename":"Paragraph","id":"b66bd0a319e_16","name":"b9f7","type":"IMG","href":null,"layout":"INSET_CENTER","metadata":{"__ref":"ImageMetadata:1*9sbNnpacfid30NjQ-Arg2g.jpeg"},"text":"","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_17":{"__typename":"Paragraph","id":"b66bd0a319e_17","name":"c4a6","type":"H3","href":null,"layout":null,"metadata":null,"text":"Communicate errors and next steps","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_18":{"__typename":"Paragraph","id":"b66bd0a319e_18","name":"b633","type":"P","href":null,"layout":null,"metadata":null,"text":"When errors happen, it’s important to communicate to the user. Language, tone and design are important in these communications. It is important to provide a clear and understandable reason for an error wherever possible and give instructions so that the error can be solved. Leaning on technical language, or database error terms (as mentioned before) will not be beneficial to the user. Color is also important as it can help indicate the severity of an error or warning.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"ImageMetadata:1*E-Py6QSnsUE7tYjLi14AOA.jpeg":{"__typename":"ImageMetadata","id":"1*E-Py6QSnsUE7tYjLi14AOA.jpeg","originalHeight":1659,"originalWidth":3125,"focusPercentX":null,"focusPercentY":null,"alt":null},"Paragraph:b66bd0a319e_19":{"__typename":"Paragraph","id":"b66bd0a319e_19","name":"de3e","type":"IMG","href":null,"layout":"INSET_CENTER","metadata":{"__ref":"ImageMetadata:1*E-Py6QSnsUE7tYjLi14AOA.jpeg"},"text":"","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"Paragraph:b66bd0a319e_20":{"__typename":"Paragraph","id":"b66bd0a319e_20","name":"fcc7","type":"P","href":null,"layout":null,"metadata":null,"text":"From these examples, we can see that some designs are a pleasure to use and others are a challenge! We should not assume what the users like or dislike, but should rather talk to users to be able to satisfy their actual needs. We have to backup our decisions with valid research and by following best design practices and guidelines.","hasDropCap":null,"dropCapImage":null,"markups":[],"codeBlockMetadata":null,"iframe":null,"mixtapeMetadata":null},"UserViewerEdge:userId:533c9b6e2c7-viewerId:lo_82d9b67c6632":{"__typename":"UserViewerEdge","id":"userId:533c9b6e2c7-viewerId:lo_82d9b67c6632","isMuting":false},"PostViewerEdge:postId:7d710ef783b9-viewerId:lo_82d9b67c6632":{"__typename":"PostViewerEdge","shouldIndexPostForExternalSearch":true,"id":"postId:7d710ef783b9-viewerId:lo_82d9b67c6632"},"Tag:ux-design":{"__typename":"Tag","id":"ux-design","displayTitle":"UX Design","normalizedTagSlug":"ux-design"},"Tag:ui-design":{"__typename":"Tag","id":"ui-design","displayTitle":"UI Design","normalizedTagSlug":"ui-design"},"Post:7d710ef783b9":{"__typename":"Post","id":"7d710ef783b9","collection":null,"content({\"postMeteringOptions\":{}})":{"__typename":"PostContent","isLockedPreviewOnly":false,"bodyModel":{"__typename":"RichText","sections":[{"__typename":"Section","name":"7476","startIndex":0,"textLayout":null,"imageLayout":null,"backgroundImage":null,"videoLayout":null,"backgroundVideo":null}],"paragraphs":[{"__ref":"Paragraph:b66bd0a319e_0"},{"__ref":"Paragraph:b66bd0a319e_1"},{"__ref":"Paragraph:b66bd0a319e_2"},{"__ref":"Paragraph:b66bd0a319e_3"},{"__ref":"Paragraph:b66bd0a319e_4"},{"__ref":"Paragraph:b66bd0a319e_5"},{"__ref":"Paragraph:b66bd0a319e_6"},{"__ref":"Paragraph:b66bd0a319e_7"},{"__ref":"Paragraph:b66bd0a319e_8"},{"__ref":"Paragraph:b66bd0a319e_9"},{"__ref":"Paragraph:b66bd0a319e_10"},{"__ref":"Paragraph:b66bd0a319e_11"},{"__ref":"Paragraph:b66bd0a319e_12"},{"__ref":"Paragraph:b66bd0a319e_13"},{"__ref":"Paragraph:b66bd0a319e_14"},{"__ref":"Paragraph:b66bd0a319e_15"},{"__ref":"Paragraph:b66bd0a319e_16"},{"__ref":"Paragraph:b66bd0a319e_17"},{"__ref":"Paragraph:b66bd0a319e_18"},{"__ref":"Paragraph:b66bd0a319e_19"},{"__ref":"Paragraph:b66bd0a319e_20"}]},"validatedShareKey":"","shareKeyCreator":null},"creator":{"__ref":"User:533c9b6e2c7"},"inResponseToEntityType":null,"isLocked":false,"isMarkedPaywallOnly":false,"lockedSource":"LOCKED_POST_SOURCE_NONE","mediumUrl":"https:\u002F\u002Fnihxl.medium.com\u002Funderstanding-good-vs-bad-ux-designs-7d710ef783b9","primaryTopic":null,"topics":[{"__typename":"Topic","slug":"design"}],"isPublished":true,"latestPublishedVersion":"b66bd0a319e","visibility":"PUBLIC","postResponses":{"__typename":"PostResponses","count":0},"clapCount":10,"allowResponses":true,"isLimitedState":false,"title":"Understanding Good vs Bad UX Designs","isSeries":false,"sequence":null,"uniqueSlug":"understanding-good-vs-bad-ux-designs-7d710ef783b9","socialTitle":"","socialDek":"","canonicalUrl":"","metaDescription":"","latestPublishedAt":1621336471385,"readingTime":2.85188679245283,"previewContent":{"__typename":"PreviewContent","subtitle":"Understanding the difference between good and bad user experience design can be subjective and sometimes hard to notice. But I have some…"},"previewImage":{"__ref":"ImageMetadata:1*-uQsCHsccSsMpmcO1-neig.jpeg"},"isShortform":false,"seoTitle":"","firstPublishedAt":1621336471385,"updatedAt":1641494100575,"shortformType":"SHORTFORM_TYPE_LINK","seoDescription":"","viewerEdge":{"__ref":"PostViewerEdge:postId:7d710ef783b9-viewerId:lo_82d9b67c6632"},"isSuspended":false,"license":"ALL_RIGHTS_RESERVED","tags":[{"__ref":"Tag:ux-design"},{"__ref":"Tag:ui-design"}],"isNewsletter":false,"statusForCollection":null,"pendingCollection":null,"detectedLanguage":"en","wordCount":504,"layerCake":0,"responsesLocked":false}}</script><script>window.__MIDDLEWARE_STATE__={"session":{"xsrf":""},"cache":{"cacheStatus":"MISS"}}</script><script src="https://cdn-client.medium.com/lite/static/js/manifest.9fd38a72.js"></script><script src="https://cdn-client.medium.com/lite/static/js/9865.1496d74a.js"></script><script src="https://cdn-client.medium.com/lite/static/js/main.4b728d55.js"></script><script src="https://cdn-client.medium.com/lite/static/js/instrumentation.d9108df7.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/reporting.ff22a7a5.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/5049.d1ead72d.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/4810.6318add7.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/6618.db187378.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/2707.b0942613.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/9977.24215cba.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/8599.a99358a5.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/5250.9f9e01d2.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/5787.e66a3a4d.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/2648.26563adf.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/8393.826a25fb.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/7082.5d2b0546.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/6589.5efd110b.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/5642.d8ead0e7.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/6546.cd03f950.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/6834.08de95de.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/2420.2a5e2d95.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/839.ca7937c2.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/7975.d195c6f1.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/2106.21ff89d3.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/7394.bf599bc5.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/5794.1d6ee184.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/8204.c4082863.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/4391.59acaed3.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/6179.7a032070.chunk.js"></script> <script src="https://cdn-client.medium.com/lite/static/js/PostPage.MainContent.f8852162.chunk.js"></script><script>window.main();</script><script>(function(){function c(){var b=a.contentDocument||a.contentWindow.document;if(b){var d=b.createElement('script');d.innerHTML="window.__CF$cv$params={r:'8ece46830c74dd9d',t:'MTczMzM0MTMwMy4wMDAwMDA='};var a=document.createElement('script');a.nonce='';a.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js';document.getElementsByTagName('head')[0].appendChild(a);";b.getElementsByTagName('head')[0].appendChild(d)}}if(document.body){var a=document.createElement('iframe');a.height=1;a.width=1;a.style.position='absolute';a.style.top=0;a.style.left=0;a.style.border='none';a.style.visibility='hidden';document.body.appendChild(a);if('loading'!==document.readyState)c();else if(window.addEventListener)document.addEventListener('DOMContentLoaded',c);else{var e=document.onreadystatechange||function(){};document.onreadystatechange=function(b){e(b);'loading'!==document.readyState&&(document.onreadystatechange=e,c())}}}})();</script></body></html>