{"id":4965,"date":"2018-05-30T16:00:50","date_gmt":"2018-05-30T13:00:50","guid":{"rendered":"https:\/\/www.intellectsoft.net\/blog\/?p=4965"},"modified":"2018-10-09T18:56:45","modified_gmt":"2018-10-09T15:56:45","slug":"the-difference-between-ui-and-ux-design","status":"publish","type":"post","link":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/","title":{"rendered":"ESSENTIALS: THE DIFFERENCE BETWEEN UX & UI DESIGN"},"content":{"rendered":"

Since the first articles about UI and UX design appeared on the internet, the line between the two started to blur. Are they closely connected? Or are they separate concepts? Some people tie them together, naming their website pages and blog posts \u201cUI\/UX design,\u201d while others choose \u201cUI and UX design.\u201d More so, many people use the terms without providing their meaning. This results in a confusion that leads people to come back to the same old question again and again: What\u2019s the difference between UX and UI design?<\/span><\/p>\n

Let\u2019s take a few minutes to pick the terms apart, refresh the memory, and put everything back into its place.<\/span><\/p>\n

BRIEFLY ABOUT THE BASICS<\/b><\/h2>\n

What unites UI and UX is that, at a basic level, they are types of design. UX means User Experience, while UI means User Interface. Today, both terms are commonly used to refer to solutions and services software development companies provide. This can be a UI and UX design job for a website, a mobile app, an iWatch app.<\/span><\/p>\n

UX and UI are two separate types of design.<\/span><\/p>\n

UX design is a schematic backbone of a solution. Just like an architect draws a blueprint for a building with all the walls and pipes and a multitude of other elements, a UX designer draws a scheme for a website that encompasses all the elements, from the top menu to the last button below. The aim of UX is to create a comfortable experience for a user that, for example, ensures that buying a pair of Nike shoes online is as simple as possible.<\/span><\/p>\n

\"The<\/p>\n

Meanwhile, UI design is responsible for the gift wrapping of the experience and the boxes on the UX scheme. UI designer picks colors, fonts, button styles, pictures, illustrations \u2014 they are responsible for the outer appeal of a digital product. <\/span><\/p>\n

Some companies employ an individual for each, others hire a single expert who can create both. UI and UX design solve different issues, but they still overlap. The typical converging point is elaborate animations: one can\u2019t deliver a well-working animation when UI and UX design are out of sync. <\/span><\/p>\n

Now, let\u2019s dive a little bit deeper.<\/span><\/p>\n

DIVING DEEPER \u2014 USER EXPERIENCE DEFINITION AND ESSENTIALS<\/b><\/h2>\n

According to the inventor <\/span>Don Norman<\/span><\/a>, the necessity to determine the interactions that were not covered by concepts like \u201chuman interface\u201d and \u201cusability\u201d led to the creation of the concept of \u201cuser experience\u201d. <\/span><\/p>\n

UX design gives greater attention to all development stages. It deals with the placement of visuals on the screen, sequences of user actions, details like how the search works, as well as the final impression. It is responsible for how the product feels when a user interacts with it. UX design also involves establishing clear communication between the product and its users, creation of prototypes and scenarios for them, as well as user analytics.<\/span><\/p>\n

\"UX<\/p>\n

To create an intuitive design, a UX designer should be well-versed in social sciences and psychology, mostly to successfully cater to their target audience. Thus, lifelong learning and mastering the best design tools are the building blocks of success in UX design. Interestingly, it is similar to market research: UX design also deals with analyzing and structuring a great amount of data, along with coordinating and integrating the results.<\/span><\/p>\n

Now, let\u2019s look at what makes a well-working UX design:<\/span><\/p>\n

    \n
  1. User-friendly functionality<\/span><\/li>\n
  2. User profiling <\/span><\/li>\n
  3. Notifying about any extra features and connections with other apps <\/span><\/li>\n
  4. Consistency, facility, and intuitiveness.<\/span><\/li>\n
  5. Spot-on prototyping <\/span><\/li>\n<\/ol>\n

    In short, UX design is about making everything work as simply as possible, helping users to achieve what they want on a given page. <\/span><\/p>\n

    USER INTERFACE DEFINITION, OR GIFT WRAPPING<\/b><\/h2>\n

    UI design is responsible for how the product looks \u2013 colors, styles, fonts, and other visual elements. UI design should turn all the UX engineering work into an eye-candy.<\/span><\/p>\n

    The UI design process deals with choosing different visual elements and making them all work together, that is creating a design that would please the eye of target users without causing visual discomfort or overwhelming them. A UI designer is responsible for bringing about a brand\u2019s voice through digital visuals, with the ultimate goal of making the user like the brand at first glance.<\/span><\/p>\n

    The process of creating a UI design significantly challenges an individual\u2019s creativity and communication skills: working alongside a UX designer, a <\/span>UI<\/span><\/i> designer should build a beautiful and comfortable car that can drive the user down the UX road that ends with buying a product. <\/span><\/p>\n

    Here, the impeding question finally arises: Isn\u2019t it better to unite both roles? <\/span><\/p>\n

    USER INTERFACE VS. USER EXPERIENCE \u2014 DIVIDE THE DUTIES?<\/b><\/h2>\n

    The difference between UI and UX design is pretty clear on paper. In practice, there is not one but two ways to design digital products. <\/span><\/p>\n

    It all depends on a given company. As UI and UX design go hand in hand, a lot of people learn both at once. For many businesses hiring one person to create both makes sense when it comes to their mode of operation and their budget. This position usually bares the title \u201cUI\/UX designer\u201d or, less frequently, \u201cDigital Designer.\u201d<\/span><\/p>\n

    \"UI<\/p>\n

    Other companies prefer to separate the duties to get the best UI and UX design possible. It also can be said that companies that divide the two strive for perfection. Be it as it may, when a company separates the duties, a well-established cooperation between a UX designer and a UI designer is highly important to create a coherent product.<\/span><\/p>\n

    BOTTOM LINE \u2013 UX OR UI?<\/b><\/h2>\n

    Whether the duties are separated or not, both user experience and user interface design are crucial to creating a coherent, quality product \u2014 a product that looks beautiful, that raises emotions, and one that is a pleasure to use.<\/span><\/p>\n

    If you need assistance in creating a solid digital product, leverage the wide-ranging 10-year expertise of our design department<\/a>.\u00a0<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"

    Re-visit our classic post that stood the test of time.<\/p>\n","protected":false},"author":25,"featured_media":4969,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[6],"tags":[],"class_list":["post-4965","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-software-development"],"acf":[],"yoast_head":"\nEssentials: The Difference Between UI and UX Design<\/title>\n<meta name=\"description\" content=\"Is it correct to name a service UI\/UX design? Revisit Intellectsoft\u2019s classic post about the difference between user experience design and user interface design.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Essentials: The Difference Between UI and UX Design\" \/>\n<meta property=\"og:description\" content=\"Is it correct to name a service UI\/UX design? Revisit Intellectsoft\u2019s classic post about the difference between user experience design and user interface design.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/\" \/>\n<meta property=\"og:site_name\" content=\"Intellectsoft Blog\" \/>\n<meta property=\"article:published_time\" content=\"2018-05-30T13:00:50+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2018-10-09T15:56:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.intellectsoft.net\/blog\/wp-content\/uploads\/Digital-Design.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1300\" \/>\n\t<meta property=\"og:image:height\" content=\"600\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"alexey.neskuba\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"alexey.neskuba\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/\",\"url\":\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/\",\"name\":\"Essentials: The Difference Between UI and UX Design\",\"isPartOf\":{\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.intellectsoft.net\/blog\/wp-content\/uploads\/Digital-Design.jpg\",\"datePublished\":\"2018-05-30T13:00:50+00:00\",\"dateModified\":\"2018-10-09T15:56:45+00:00\",\"author\":{\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/#\/schema\/person\/ae03ee10afd833ca9c1e2ac0b466ca3a\"},\"description\":\"Is it correct to name a service UI\/UX design? Revisit Intellectsoft\u2019s classic post about the difference between user experience design and user interface design.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#primaryimage\",\"url\":\"https:\/\/www.intellectsoft.net\/blog\/wp-content\/uploads\/Digital-Design.jpg\",\"contentUrl\":\"https:\/\/www.intellectsoft.net\/blog\/wp-content\/uploads\/Digital-Design.jpg\",\"width\":1300,\"height\":600,\"caption\":\"UI\/UX design\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.intellectsoft.net\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"ESSENTIALS: THE DIFFERENCE BETWEEN UX & UI DESIGN\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/#website\",\"url\":\"https:\/\/www.intellectsoft.net\/blog\/\",\"name\":\"Intellectsoft Blog\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.intellectsoft.net\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/#\/schema\/person\/ae03ee10afd833ca9c1e2ac0b466ca3a\",\"name\":\"alexey.neskuba\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.intellectsoft.net\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0fd87c59392b2b87bc307d93273bb69294422d31219352dd94935d59fcd0bfd3?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0fd87c59392b2b87bc307d93273bb69294422d31219352dd94935d59fcd0bfd3?s=96&d=mm&r=g\",\"caption\":\"alexey.neskuba\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Essentials: The Difference Between UI and UX Design","description":"Is it correct to name a service UI\/UX design? Revisit Intellectsoft\u2019s classic post about the difference between user experience design and user interface design.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/","og_locale":"en_US","og_type":"article","og_title":"Essentials: The Difference Between UI and UX Design","og_description":"Is it correct to name a service UI\/UX design? Revisit Intellectsoft\u2019s classic post about the difference between user experience design and user interface design.","og_url":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/","og_site_name":"Intellectsoft Blog","article_published_time":"2018-05-30T13:00:50+00:00","article_modified_time":"2018-10-09T15:56:45+00:00","og_image":[{"width":1300,"height":600,"url":"https:\/\/www.intellectsoft.net\/blog\/wp-content\/uploads\/Digital-Design.jpg","type":"image\/jpeg"}],"author":"alexey.neskuba","twitter_card":"summary_large_image","twitter_misc":{"Written by":"alexey.neskuba","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/","url":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/","name":"Essentials: The Difference Between UI and UX Design","isPartOf":{"@id":"https:\/\/www.intellectsoft.net\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#primaryimage"},"image":{"@id":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#primaryimage"},"thumbnailUrl":"https:\/\/www.intellectsoft.net\/blog\/wp-content\/uploads\/Digital-Design.jpg","datePublished":"2018-05-30T13:00:50+00:00","dateModified":"2018-10-09T15:56:45+00:00","author":{"@id":"https:\/\/www.intellectsoft.net\/blog\/#\/schema\/person\/ae03ee10afd833ca9c1e2ac0b466ca3a"},"description":"Is it correct to name a service UI\/UX design? Revisit Intellectsoft\u2019s classic post about the difference between user experience design and user interface design.","breadcrumb":{"@id":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#primaryimage","url":"https:\/\/www.intellectsoft.net\/blog\/wp-content\/uploads\/Digital-Design.jpg","contentUrl":"https:\/\/www.intellectsoft.net\/blog\/wp-content\/uploads\/Digital-Design.jpg","width":1300,"height":600,"caption":"UI\/UX design"},{"@type":"BreadcrumbList","@id":"https:\/\/www.intellectsoft.net\/blog\/the-difference-between-ui-and-ux-design\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.intellectsoft.net\/blog\/"},{"@type":"ListItem","position":2,"name":"ESSENTIALS: THE DIFFERENCE BETWEEN UX & UI DESIGN"}]},{"@type":"WebSite","@id":"https:\/\/www.intellectsoft.net\/blog\/#website","url":"https:\/\/www.intellectsoft.net\/blog\/","name":"Intellectsoft Blog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.intellectsoft.net\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.intellectsoft.net\/blog\/#\/schema\/person\/ae03ee10afd833ca9c1e2ac0b466ca3a","name":"alexey.neskuba","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.intellectsoft.net\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0fd87c59392b2b87bc307d93273bb69294422d31219352dd94935d59fcd0bfd3?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0fd87c59392b2b87bc307d93273bb69294422d31219352dd94935d59fcd0bfd3?s=96&d=mm&r=g","caption":"alexey.neskuba"}}]}},"_links":{"self":[{"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/posts\/4965","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/users\/25"}],"replies":[{"embeddable":true,"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/comments?post=4965"}],"version-history":[{"count":0,"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/posts\/4965\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/media\/4969"}],"wp:attachment":[{"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/media?parent=4965"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/categories?post=4965"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.intellectsoft.net\/blog\/wp-json\/wp\/v2\/tags?post=4965"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}