Editing 2141: UI vs UX

Jump to: navigation, search

Warning: You are not logged in. Your IP address will be publicly visible if you make any edits. If you log in or create an account, your edits will be attributed to your username, along with other benefits.

The edit can be undone. Please check the comparison below to verify that this is what you want to do, and then save the changes below to finish undoing the edit.
Latest revision Your text
Line 8: Line 8:
  
 
==Explanation==
 
==Explanation==
 +
{{incomplete|Created by a UX DESIGNER. Each U{x} needs its own section. Do NOT delete this tag too soon.}}
 +
 
[https://www.google.com/search?q=UI+vs+UX UI vs UX] is a discussion in software engineering of the differences between {{w|User_interface_design|user interface}} design (UI) and {{w|user experience}} design (UX). As explained in the comic, UI design is typically concerned with the elements of the interface that a user encounters, while UX design is more concerned about the user's overall experience in using such interface. UX design can be seen as more holistic & abstract than UI. This comic extends the idea, adding increasingly all-encompassing, abstract & fanciful design perspectives.
 
[https://www.google.com/search?q=UI+vs+UX UI vs UX] is a discussion in software engineering of the differences between {{w|User_interface_design|user interface}} design (UI) and {{w|user experience}} design (UX). As explained in the comic, UI design is typically concerned with the elements of the interface that a user encounters, while UX design is more concerned about the user's overall experience in using such interface. UX design can be seen as more holistic & abstract than UI. This comic extends the idea, adding increasingly all-encompassing, abstract & fanciful design perspectives.
  
  
To start, the two real categories are:
+
To start, the the two real categories are:
 +
 
 +
*UI - '''Elements of the interface that the user encounters'''
 +
 
 +
This standard software engineering practice involves trying to come up with a user interface - icons, colors, placement or text and elements, etc. that works well together, that isn't confusing, and that hopefully makes it easy for the user to view the information they need to digest, as well as make whatever choices the user is expected to make.  They also look at things like how long it takes to move from one screen or task to another, etc.
 +
 
 +
*UX - '''The user's experience of using the interface to achieve goals'''
 +
 
 +
Sometimes a UI designer makes choices that they think are easy for the user, but it turns out not to be as easy as expected when it comes to real users and practical situations. So the UX designer focuses on observing how a user uses a product, both how they use the user interface as well as other less technical aspects of their experience such as how they come to find out about the product, what they tell others about the product, etc.
  
;UI - '''Elements of the interface that the user encounters'''
 
:This standard software engineering practice involves trying to come up with a user interface - icons, colors, placement or text and elements, etc. that works well together, that isn't confusing, and that hopefully makes it easy for the user to view the information they need to digest, as well as make whatever choices the user is expected to make.  They also look at things like how long it takes to move from one screen or task to another, etc.
 
;UX - '''The user's experience of using the interface to achieve goals'''
 
:Sometimes a UI designer makes choices that they think are easy for the user, but it turns out not to be as easy as expected when it comes to real users and practical situations. So the UX designer focuses on observing how a user uses a product, both how they use the user interface as well as other less technical aspects of their experience such as how they come to find out about the product, what they tell others about the product, etc.
 
  
 
The comic takes this to absurd levels by adding these additional categories:
 
The comic takes this to absurd levels by adding these additional categories:
  
;UZ - '''The psychological roots of the user's motivation for seeking out the interaction'''
+
*UZ - '''The psychological roots of the user's motivation for seeking out the interaction'''
:The comic says that UZ is the investigation of the psychological roots of why the user even wants to use the interface. This is not normally something that computer programmers do{{Citation needed}}, and is usually best left in the hands of psychologists {{Citation needed}}.
+
 
:"The psychological roots of motivation" is a [http://playbook.amanet.org/brian-tracy-the-root-of-motivation/ buzzword phrase] from [http://www.maccoby.com/books/WhyWork.php management theory] which may not have a particularly well-defined meaning. {{w|Motivation}} is itself the psychological root of behavior. While motivations certainly have causes, they are usually not clear enough to meaningfully treat in formal or clinical contexts.
+
The comic says that UZ is the investigation of the psychological roots of why the user even wants to use the interface. This is not normally something that computer programmers do{{Citation needed}}, and is usually best left in the hands of psychologists {{Citation needed}}.
;Uα - '''The user's self-actualization'''
 
:"{{w|Self actualization}}" is the most abstract, immaterial form of motivation, meaning the need to find comfort in one's own goals and achievements. Available only when more material needs such as those for food, shelter, warmth, security, and a sense of belonging are met, it forms the pinnacle of {{w|Maslow's hierarchy of needs}}.
 
:''α'' is ''{{w|alpha}}'', the first letter of the Greek alphabet. It's often used to show the "beginning" or "first" of something (including in philosophical contexts). And as the first Greek letter, it can be thought of "beyond Z" in a sense; the Atlantic hurricane name list uses the Greek alphabet this way, for example (as [[944: Hurricane Names|944: Hurricane Names]] alludes to).
 
;UΩ - '''The arc of the user's life'''
 
:"The arc of one's life," means the overall thematic elements present in a person's existence. It occurs in the philosophical humor novel ''{{w|The World According to Garp}},'' which remarks on how easily the arc of any human life can turn on a single sexual relationship.
 
:Continuing the philosophical theme, ''Ω'' is ''{{w|omega}}'', the ''last'' letter of the Greek alphabet. As such, it's often used to show the "last", "end", or "ultimate" of something.
 
;U∞ - '''Life's experience of time'''
 
:"Life's experience of time" is a very rare phrase which does not seem to have a coherent meaning across the handful of times it occurs.
 
:''∞'' (U+221E) is the mathematical symbol for ''{{w|infinity}}'', again furthering the philosophical abstraction.
 
;U<small>⬤</small> - '''The arc of the moral universe'''
 
:"The arc of the moral universe is long, but it bends toward justice," is a famous line from a speech by {{w|Martin Luther King}}, referring to the slow pace at which social progress is often achieved, and paraphrasing parts of a 1853 sermon by abolitionist minister {{w|Theodore Parker}}: "I do not pretend to understand the moral universe. The arc is a long one. My eye reaches but little ways. I cannot calculate the curve and complete the figure by experience of sight. I can divine it by conscience. And from what I see I am sure it bends toward justice." President Obama had the sentence from King's speech woven into a rug in the Oval Office.
 
:The <small>⬤</small> is a filled-in circle the size of the letters around it, represented here by the Unicode "<span style="font-variant: small-caps; text-transform: lowercase;">black large circle</span>" character ({{w|Miscellaneous Symbols and Arrows|U+2B24}}). Continuing the philosophical abstraction, it comes well after the Greek alphabet and most mathematical symbols in Unicode, and is especially unlikely to be used as a text character in its own right like this.{{Citation needed}}
 
  
The title text refers to a higher power bending the moral arc, but mirrors the UI and UX categories, with the implication that the list continues in a spiral through ever more rarefied levels of higher powers, with even less likely symbols denoting them.  
+
"The psychological roots of motivation" is a [http://playbook.amanet.org/brian-tracy-the-root-of-motivation/ buzzword phrase] from [http://www.maccoby.com/books/WhyWork.php management theory] which may not have a particularly well-defined meaning. {{w|Motivation}} is itself the psychological root of behavior. While motivations certainly have causes, they are usually not clear enough to meaningfully treat in formal or clinical contexts.
 +
 
 +
*Uα - '''The user's self-actualization'''
 +
 
 +
"{{w|Self actualization}}" is the most abstract, immaterial form of motivation, meaning the need to find comfort in one's own goals and achievements. Available only when more material needs such as those for food, shelter, warmth, security, and a sense of belonging are met, it forms the pinnacle of {{w|Maslow's hierarchy of needs}}.
 +
 
 +
''α'' is ''{{w|alpha}}'', the first letter of the Greek alphabet. It's often used to show the "beginning" or "first" of something (including in philosophical contexts). And as the first Greek letter, it can be thought of "beyond Z" in a sense; the Atlantic hurricane name list uses the Greek alphabet this way, for example (as [[944: Hurricane Names|xkcd 944]] alludes to).
 +
 
 +
*UΩ - '''The arc of the user's life'''
 +
 
 +
"The arc of one's life," means the overall thematic elements present in a person's existence. It occurs in the philosophical humor novel ''{{w|The World According to Garp}},'' which remarks on how easily the arc of any human life can turn on a single sexual relationship.
 +
 
 +
Continuing the philosophical theme, ''Ω'' is ''{{w|omega}}'', the ''last'' letter of the Greek alphabet. As such, it's often used to show the "last", "end", or "ultimate" of something.
 +
 
 +
*U∞ - '''Life's experience of time'''
 +
 
 +
"Life's experience of time" is a very rare phrase which does not seem to have a coherent meaning across the handful of times it occurs.
 +
 
 +
''∞'' is the mathematical symbol for ''{{w|infinity}}'', again furthering the philosophical abstraction.
  
;U[unprintable glyph] - '''The elements a higher power uses to bend that moral arc'''
+
*U⬤ - '''The arc of the moral universe'''
:Essentially UI for the higher power's moral arc bending utility.
 
;U[even more unprintable glyph] - '''The higher power's overall experience bending that moral arc'''
 
:Essentially UX for the higher power's moral arc bending utility.
 
  
==Transcript==
+
"The arc of the moral universe is long, but it bends toward justice," is a famous line from a speech by {{w|Martin Luther King}}, referring to the slow pace at which social progress is often achieved, and paraphrasing parts of a 1853 sermon by abolitionist minister {{w|Theodore Parker}}: "I do not pretend to understand the moral universe. The arc is a long one. My eye reaches but little ways. I cannot calculate the curve and complete the figure by experience of sight. I can divine it by conscience. And from what I see I am sure it bends toward justice." President Obama had the sentence from King's speech woven into a rug in the Oval Office.
:[Two underlined headings are above two columns of text with seven lines. The left "symbol" (labelled "Designer") is explained by the text to the right (labelled "What they are responsible for").]
 
  
:UI: Elements of the interface that the user encounters
+
The ⬤ is a filled-in circle the size of the letters around it, represented here by the Unicode "<span style="font-variant: small-caps; text-transform: lowercase;">black large circle</span>" character ({{w|Miscellaneous Symbols and Arrows|U+2B24}}). Continuing the philosophical abstraction, it comes well after the Greek alphabet and most mathematical symbols in Unicode, and is especially unlikely to be used as a text character in its own right like this.{{Citation needed}}
  
:UX: The user's experience of using the interface to achieve goals
 
  
:UZ: The psychological roots of the user's motivation for seeking out the interaction
+
The title text refers to a higher power bending the moral arc, but mirrors the UI and UX categories, with the implication that the list continues in a spiral through ever more rarefied levels of higher powers, with even less likely symbols denoting them.
  
:Uα: The user's self-actualization
+
*U[unprintable glyph] - '''The elements a higher power uses to bend that moral arc'''
  
:UΩ: The arc of the user's life
+
Essentially UI for the higher power's moral arc bending utility.
  
:U∞: Life's experience of time
+
*U[even more unprintable glyph] - '''The higher power's overall experience bending that moral arc'''
  
:U<small>⬤</small>: The arc of the moral universe
+
Essentially UX for the higher power's moral arc bending utility.
  
 +
==Transcript==
 +
:[Two underlined headings are above two columns of text with seven lines. The left "symbol" is explained by the text to the right.]
 +
:<u>Designer</u> &nbsp;&nbsp;&nbsp; <u>What they are responsible for</u>
 +
:'''UI''' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    Elements of the interface that the user encounters
 +
:'''UX''' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    The user's experience of using the interface to achieve goals
 +
:'''UZ''' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    The psychological roots of the user's motivation for seeking out the interaction
 +
:'''U∝''' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    The user's self-actualization
 +
:'''UΩ''' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    The arc of the user's life
 +
:'''U∞''' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    Life's experience of time
 +
:'''U'''<small>⚫</small> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;    The arc of the moral universe
 
{{comic discussion}}
 
{{comic discussion}}
  
 
[[Category:Programming]]
 
[[Category:Programming]]

Please note that all contributions to explain xkcd may be edited, altered, or removed by other contributors. If you do not want your writing to be edited mercilessly, then do not submit it here.
You are also promising us that you wrote this yourself, or copied it from a public domain or similar free resource (see explain xkcd:Copyrights for details). Do not submit copyrighted work without permission!

To protect the wiki against automated edit spam, we kindly ask you to solve the following CAPTCHA:

Cancel | Editing help (opens in new window)