SlideShare a Scribd company logo
1 of 22
UX & UI
THE DIFFERENCES BETWEEN TWO ABBREVIATIONS
JESSICA KAINU
UX DESIGNER
KROGER CLT
Senior
Junior
Heavyweight
Middleweight
Principal
Chief
Lead
Usability
User Centered Design
User Experience
User Interface
Human Factors
Visual
Content
Information
Interaction
Analyst
Architect
Champion
Designer
Developer
Director
Expert
Manager
Practitioner
Professional
Researcher
Specialist
Strategist
THE UX JOB TITLE GENERATOR
Seniority Practice Role
@userfocus
UX deals with purpose, while UI
deals with appearance and
functionality.
-Adobe
“I don't know what user interface design is, but the way I'd
describe your job is that you're the person who makes using a
website intuitive and easy to navigate. I'd say that you base your
choices on both user feedback and statistics.”
-Friend
WE CAN AGREE
THAT
UX & UI are related
They need to work together to
make a great product.
There is some overlap
UI decisions are informed by UX
research and testing.
They are not interchangeable
UX and UI are not the same.
WE CAN AGREE
THAT
UX & UI are related
They need to work together to
make a great product.
There is some overlap
UI decisions are informed by UX
research and testing.
They are not interchangeable
UX and UI are not the same.
WE CAN AGREE
THAT
UX & UI are related
They need to work together to
make a great product.
There is some overlap
UI decisions are informed by UX
research and testing.
They are not interchangeable
UX and UI are not the same.
WE CAN AGREE
THAT
UX & UI are related
They need to work together to
make a great product.
There is some overlap
UI decisions are informed by UX
research and testing.
They are not interchangeable
UX and UI are not the same.
WHY DOES THIS
MATTER?
11
1
Project needs
Decide on project goals and what
types of people are needed to reach
them.
Skill sets need to be clear
If you believe you need a UX
Designer, you should understand
what they can do for your project.
A designer’s time is important
As a designer, understanding a new
position and performing a role where
it ends up not being what you
thought is frustrating.
Wasting business resources
Hiring a designer that looks like
they’ll help your project when they
don’t have the right skillset
wastes time and resources.
Between a business and a designer, it’s important that both are informed
about role function and to be on the same page about it.
UX PROCESS
What is it?
Collecting data on the problem you’re trying
to solve
How to
User research methods include: Usability
testing, user interviews, competitive
analysis, tree testing, card sorting, among
many many others.
RESEARCH &
DISCOVERY
What is it?
Parsing through the data you collected and
making sense of it.
How to
Think of who you are presenting your
results to and how they digest information.
You can use extended research reports,
presentations, or executive summaries.
FRAMING
RESEARCH
RESULTS
What is it?
Sketching and prototyping a design that
solves the problem based on the UX
research previously performed.
How to
Sketch out wires and get feedback. Try out
10 + 10 as a sketching exercise or try a
design sprint for a collaborative approach.
DESIGN
BASED ON
RESEARCH
What is it?
Taking an interactive prototype, whether
that be paper or digital and testing with
screened users.
How to
Start with a test script and have personas of
who your users are. When recruiting,
screen your users. Decide on unmoderated
or moderated testing and run through user
tasks.
TESTING
What is it?
Communicating design changes that came
from research and test results.
How to
You can use redlining, InVision, style guides
and pattern libraries, or present the design
with annotated slides.
COMMUNICATING TO
STAKEHOLDERS
THAT’S GREAT BUT WHAT ABOUT
WORKING IN AGILE?
CASE
STUDY
Be iterative and get constant
feedback
It is okay if your design isn’t perfect. Iterative
testing will allow you to fix any flaws.
Designing a voice product for Smart Display
Test smaller features more frequently when possible.
Plan far in advance for large features.
Questions?
(Thanks!)

More Related Content

What's hot

UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiMatin Maleki
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideBabajide Aroyewun
 
What is a User Experience?
What is a User Experience? What is a User Experience?
What is a User Experience? Dotinum
 
An Easy Explanation of UX (User Experience) By Think 360 Studio
An Easy Explanation of UX (User Experience) By Think 360 Studio An Easy Explanation of UX (User Experience) By Think 360 Studio
An Easy Explanation of UX (User Experience) By Think 360 Studio Think 360 Studio
 
Brand Identity in UI/UX Design
Brand Identity in UI/UX DesignBrand Identity in UI/UX Design
Brand Identity in UI/UX DesignAdryan Putra
 
[UX Series] 1 - UX Introduction
[UX Series] 1 - UX Introduction[UX Series] 1 - UX Introduction
[UX Series] 1 - UX IntroductionPhuong Hoang Vu
 
What the #$%@ is UX Design?
What the #$%@ is UX Design?What the #$%@ is UX Design?
What the #$%@ is UX Design?Matthew Magain
 
Understanding Product Design UX / UI / v.3
Understanding Product Design UX / UI / v.3Understanding Product Design UX / UI / v.3
Understanding Product Design UX / UI / v.3Eduardo Wydler
 
Usability and User Experience
Usability and User ExperienceUsability and User Experience
Usability and User ExperienceShawn Calvert
 
User interface and user experience ui ux design basics
User interface  and user experience ui ux design basicsUser interface  and user experience ui ux design basics
User interface and user experience ui ux design basicsRavi Bhadauria
 
UX & UI Design behind SDL’s Customer Experience Cloud
UX & UI Design behind SDL’s Customer Experience CloudUX & UI Design behind SDL’s Customer Experience Cloud
UX & UI Design behind SDL’s Customer Experience CloudPhilipp Engel
 
How to Find a Good UI/UX Designer (or be one!)
How to Find a Good UI/UX Designer (or be one!)How to Find a Good UI/UX Designer (or be one!)
How to Find a Good UI/UX Designer (or be one!)Emerentiana Meicy
 

What's hot (20)

UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin Maleki
 
UX Best Practices
UX Best PracticesUX Best Practices
UX Best Practices
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun Babajide
 
What is UX?
What is UX?What is UX?
What is UX?
 
What is a User Experience?
What is a User Experience? What is a User Experience?
What is a User Experience?
 
An Easy Explanation of UX (User Experience) By Think 360 Studio
An Easy Explanation of UX (User Experience) By Think 360 Studio An Easy Explanation of UX (User Experience) By Think 360 Studio
An Easy Explanation of UX (User Experience) By Think 360 Studio
 
UX/UI Design 101
UX/UI Design 101UX/UI Design 101
UX/UI Design 101
 
Look at UI/UX Design Process
Look at UI/UX Design ProcessLook at UI/UX Design Process
Look at UI/UX Design Process
 
Brand Identity in UI/UX Design
Brand Identity in UI/UX DesignBrand Identity in UI/UX Design
Brand Identity in UI/UX Design
 
Ux design process
Ux design processUx design process
Ux design process
 
[UX Series] 1 - UX Introduction
[UX Series] 1 - UX Introduction[UX Series] 1 - UX Introduction
[UX Series] 1 - UX Introduction
 
Ui vs UX design
Ui vs UX designUi vs UX design
Ui vs UX design
 
What the #$%@ is UX Design?
What the #$%@ is UX Design?What the #$%@ is UX Design?
What the #$%@ is UX Design?
 
Ui design
Ui designUi design
Ui design
 
Understanding Product Design UX / UI / v.3
Understanding Product Design UX / UI / v.3Understanding Product Design UX / UI / v.3
Understanding Product Design UX / UI / v.3
 
Usability and User Experience
Usability and User ExperienceUsability and User Experience
Usability and User Experience
 
User interface and user experience ui ux design basics
User interface  and user experience ui ux design basicsUser interface  and user experience ui ux design basics
User interface and user experience ui ux design basics
 
UI UX in depth
UI UX in depthUI UX in depth
UI UX in depth
 
UX & UI Design behind SDL’s Customer Experience Cloud
UX & UI Design behind SDL’s Customer Experience CloudUX & UI Design behind SDL’s Customer Experience Cloud
UX & UI Design behind SDL’s Customer Experience Cloud
 
How to Find a Good UI/UX Designer (or be one!)
How to Find a Good UI/UX Designer (or be one!)How to Find a Good UI/UX Designer (or be one!)
How to Find a Good UI/UX Designer (or be one!)
 

Similar to UX & UI: The differences between two abbreviations

A Look Into My Life As A UX Designer
A Look Into My Life As A UX DesignerA Look Into My Life As A UX Designer
A Look Into My Life As A UX DesignerMaite Dalila
 
User Centered Design
User Centered DesignUser Centered Design
User Centered DesignShawn Calvert
 
UX Research Methods: Behind the Scenes At Process Street
UX Research Methods: Behind the Scenes At Process StreetUX Research Methods: Behind the Scenes At Process Street
UX Research Methods: Behind the Scenes At Process StreetQuekelsBaro
 
Embry-Riddle Campus Solutions UX Design
Embry-Riddle Campus Solutions UX Design Embry-Riddle Campus Solutions UX Design
Embry-Riddle Campus Solutions UX Design paulodavila
 
UX? WTF? - Intro To User Experience Design Pt. 1
UX? WTF? - Intro To User Experience Design Pt. 1UX? WTF? - Intro To User Experience Design Pt. 1
UX? WTF? - Intro To User Experience Design Pt. 1Sebastian Tory-Pratt
 
UX for start-ups, presented to start-ups in Wayra, London
UX for start-ups, presented to start-ups in Wayra, LondonUX for start-ups, presented to start-ups in Wayra, London
UX for start-ups, presented to start-ups in Wayra, LondonKarl Saynor
 
FINAL NL-UX-WPPR_1_18_15
FINAL NL-UX-WPPR_1_18_15FINAL NL-UX-WPPR_1_18_15
FINAL NL-UX-WPPR_1_18_15Wim Bertram ?
 
LOOKING FOR A UX DESIGNER? BUT STILL WONDERING WHAT UX IS?
LOOKING FOR A UX DESIGNER? BUT STILL WONDERING WHAT UX IS? LOOKING FOR A UX DESIGNER? BUT STILL WONDERING WHAT UX IS?
LOOKING FOR A UX DESIGNER? BUT STILL WONDERING WHAT UX IS? Kathleen Milbier
 
Demystifying User Experience
Demystifying User ExperienceDemystifying User Experience
Demystifying User ExperienceCake and Arrow
 
Prototyping is the panacea
Prototyping is the panaceaPrototyping is the panacea
Prototyping is the panaceaMichael Meikson
 
How to Become a UX/UI Designer from Scratch
How to Become a UX/UI Designer from ScratchHow to Become a UX/UI Designer from Scratch
How to Become a UX/UI Designer from ScratchAurora Sen
 
Topics that every UX beginner should be aware.pptx
Topics that every UX beginner should be aware.pptxTopics that every UX beginner should be aware.pptx
Topics that every UX beginner should be aware.pptxDigital Academy 360
 
Going from Here to There: Transitioning into a UX Career
Going from Here to There: Transitioning into a UX CareerGoing from Here to There: Transitioning into a UX Career
Going from Here to There: Transitioning into a UX Careerdpanarelli
 
Building for People: 5 Practical Tip for Greating Great UX
Building for People: 5 Practical Tip for Greating Great UXBuilding for People: 5 Practical Tip for Greating Great UX
Building for People: 5 Practical Tip for Greating Great UXqixingz
 
A brief overview of the history and practice of user experience by Ian Westbrook
A brief overview of the history and practice of user experience by Ian WestbrookA brief overview of the history and practice of user experience by Ian Westbrook
A brief overview of the history and practice of user experience by Ian WestbrookAlex Cachia
 
User Experience and Prototyping
User Experience and PrototypingUser Experience and Prototyping
User Experience and PrototypingKshitiz Anand
 
UX Designer Portfolio 2018
UX Designer Portfolio 2018UX Designer Portfolio 2018
UX Designer Portfolio 2018Arun Antony
 

Similar to UX & UI: The differences between two abbreviations (20)

A Look Into My Life As A UX Designer
A Look Into My Life As A UX DesignerA Look Into My Life As A UX Designer
A Look Into My Life As A UX Designer
 
User Centered Design
User Centered DesignUser Centered Design
User Centered Design
 
UX Research Methods: Behind the Scenes At Process Street
UX Research Methods: Behind the Scenes At Process StreetUX Research Methods: Behind the Scenes At Process Street
UX Research Methods: Behind the Scenes At Process Street
 
Embry-Riddle Campus Solutions UX Design
Embry-Riddle Campus Solutions UX Design Embry-Riddle Campus Solutions UX Design
Embry-Riddle Campus Solutions UX Design
 
UX? WTF? - Intro To User Experience Design Pt. 1
UX? WTF? - Intro To User Experience Design Pt. 1UX? WTF? - Intro To User Experience Design Pt. 1
UX? WTF? - Intro To User Experience Design Pt. 1
 
Collaborating with UX
Collaborating with UXCollaborating with UX
Collaborating with UX
 
Fundamentals of UX Design
Fundamentals of UX DesignFundamentals of UX Design
Fundamentals of UX Design
 
UX for start-ups, presented to start-ups in Wayra, London
UX for start-ups, presented to start-ups in Wayra, LondonUX for start-ups, presented to start-ups in Wayra, London
UX for start-ups, presented to start-ups in Wayra, London
 
FINAL NL-UX-WPPR_1_18_15
FINAL NL-UX-WPPR_1_18_15FINAL NL-UX-WPPR_1_18_15
FINAL NL-UX-WPPR_1_18_15
 
LOOKING FOR A UX DESIGNER? BUT STILL WONDERING WHAT UX IS?
LOOKING FOR A UX DESIGNER? BUT STILL WONDERING WHAT UX IS? LOOKING FOR A UX DESIGNER? BUT STILL WONDERING WHAT UX IS?
LOOKING FOR A UX DESIGNER? BUT STILL WONDERING WHAT UX IS?
 
UX101
UX101UX101
UX101
 
Demystifying User Experience
Demystifying User ExperienceDemystifying User Experience
Demystifying User Experience
 
Prototyping is the panacea
Prototyping is the panaceaPrototyping is the panacea
Prototyping is the panacea
 
How to Become a UX/UI Designer from Scratch
How to Become a UX/UI Designer from ScratchHow to Become a UX/UI Designer from Scratch
How to Become a UX/UI Designer from Scratch
 
Topics that every UX beginner should be aware.pptx
Topics that every UX beginner should be aware.pptxTopics that every UX beginner should be aware.pptx
Topics that every UX beginner should be aware.pptx
 
Going from Here to There: Transitioning into a UX Career
Going from Here to There: Transitioning into a UX CareerGoing from Here to There: Transitioning into a UX Career
Going from Here to There: Transitioning into a UX Career
 
Building for People: 5 Practical Tip for Greating Great UX
Building for People: 5 Practical Tip for Greating Great UXBuilding for People: 5 Practical Tip for Greating Great UX
Building for People: 5 Practical Tip for Greating Great UX
 
A brief overview of the history and practice of user experience by Ian Westbrook
A brief overview of the history and practice of user experience by Ian WestbrookA brief overview of the history and practice of user experience by Ian Westbrook
A brief overview of the history and practice of user experience by Ian Westbrook
 
User Experience and Prototyping
User Experience and PrototypingUser Experience and Prototyping
User Experience and Prototyping
 
UX Designer Portfolio 2018
UX Designer Portfolio 2018UX Designer Portfolio 2018
UX Designer Portfolio 2018
 

Recently uploaded

Rise of Digital Textiles__Published in PrintAction
Rise of Digital Textiles__Published in PrintActionRise of Digital Textiles__Published in PrintAction
Rise of Digital Textiles__Published in PrintActionVictoria Gaitskell
 
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理thubko
 
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证ugzga
 
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证ugzga
 
BIT Khushi gandhi project.pdf graphic design
BIT Khushi gandhi project.pdf graphic designBIT Khushi gandhi project.pdf graphic design
BIT Khushi gandhi project.pdf graphic designKhushiGandhi15
 
如何办理(RUG毕业证书)格罗宁根大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(RUG毕业证书)格罗宁根大学毕业证成绩单本科硕士学位证留信学历认证如何办理(RUG毕业证书)格罗宁根大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(RUG毕业证书)格罗宁根大学毕业证成绩单本科硕士学位证留信学历认证ugzga
 
Branding in the Psychedelic Landscape Report.pdf
Branding in the Psychedelic Landscape Report.pdfBranding in the Psychedelic Landscape Report.pdf
Branding in the Psychedelic Landscape Report.pdfAlexandra Plesner
 
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...Amil baba
 
Jual obat aborsi Saudi ( 085657271886 ) Cytote pil telat bulan penggugur kand...
Jual obat aborsi Saudi ( 085657271886 ) Cytote pil telat bulan penggugur kand...Jual obat aborsi Saudi ( 085657271886 ) Cytote pil telat bulan penggugur kand...
Jual obat aborsi Saudi ( 085657271886 ) Cytote pil telat bulan penggugur kand...Klinik kandungan
 
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证ugzga
 
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证ugzga
 
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...Amil baba
 
Spring Summer 26 Colors Trend Book Peclers Paris
Spring Summer 26 Colors Trend Book Peclers ParisSpring Summer 26 Colors Trend Book Peclers Paris
Spring Summer 26 Colors Trend Book Peclers ParisPeclers Paris
 
Levi's Advertisement and camapign design
Levi's Advertisement and camapign designLevi's Advertisement and camapign design
Levi's Advertisement and camapign designAkankshaD3
 
Bit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolioBit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfoliodhrumibshah13
 
The concept of motion graphics and its applications.
The concept of motion graphics and its applications.The concept of motion graphics and its applications.
The concept of motion graphics and its applications.WeatherOfficialProdu
 
Morgenbooster: Storytelling in Identity Design
Morgenbooster: Storytelling in Identity DesignMorgenbooster: Storytelling in Identity Design
Morgenbooster: Storytelling in Identity Design1508 A/S
 
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...drmarathore
 
如何办理(Birmingham毕业证书)伯明翰大学学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(Birmingham毕业证书)伯明翰大学学院毕业证成绩单本科硕士学位证留信学历认证如何办理(Birmingham毕业证书)伯明翰大学学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(Birmingham毕业证书)伯明翰大学学院毕业证成绩单本科硕士学位证留信学历认证ugzga
 
Spring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers ParisSpring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers ParisPeclers Paris
 

Recently uploaded (20)

Rise of Digital Textiles__Published in PrintAction
Rise of Digital Textiles__Published in PrintActionRise of Digital Textiles__Published in PrintAction
Rise of Digital Textiles__Published in PrintAction
 
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
一模一样英国德比大学毕业证(derby毕业证书)本科学历-国外大学文凭办理
 
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(Columbia College毕业证书)纽约市哥伦比亚大学毕业证成绩单本科硕士学位证留信学历认证
 
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
如何办理(UCI毕业证书)加利福尼亚大学尔湾分校毕业证成绩单本科硕士学位证留信学历认证
 
BIT Khushi gandhi project.pdf graphic design
BIT Khushi gandhi project.pdf graphic designBIT Khushi gandhi project.pdf graphic design
BIT Khushi gandhi project.pdf graphic design
 
如何办理(RUG毕业证书)格罗宁根大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(RUG毕业证书)格罗宁根大学毕业证成绩单本科硕士学位证留信学历认证如何办理(RUG毕业证书)格罗宁根大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(RUG毕业证书)格罗宁根大学毕业证成绩单本科硕士学位证留信学历认证
 
Branding in the Psychedelic Landscape Report.pdf
Branding in the Psychedelic Landscape Report.pdfBranding in the Psychedelic Landscape Report.pdf
Branding in the Psychedelic Landscape Report.pdf
 
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
NO1 Best Vashikaran Specialist in Uk Black Magic Specialist in Uk Black Magic...
 
Jual obat aborsi Saudi ( 085657271886 ) Cytote pil telat bulan penggugur kand...
Jual obat aborsi Saudi ( 085657271886 ) Cytote pil telat bulan penggugur kand...Jual obat aborsi Saudi ( 085657271886 ) Cytote pil telat bulan penggugur kand...
Jual obat aborsi Saudi ( 085657271886 ) Cytote pil telat bulan penggugur kand...
 
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(ArtEZ毕业证书)ArtEZ艺术学院毕业证成绩单本科硕士学位证留信学历认证
 
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
如何办理(UoB毕业证书)伯明翰大学毕业证成绩单本科硕士学位证留信学历认证
 
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
NO1 Best Best Black Magic Specialist Near Me Spiritual Healer Powerful Love S...
 
Spring Summer 26 Colors Trend Book Peclers Paris
Spring Summer 26 Colors Trend Book Peclers ParisSpring Summer 26 Colors Trend Book Peclers Paris
Spring Summer 26 Colors Trend Book Peclers Paris
 
Levi's Advertisement and camapign design
Levi's Advertisement and camapign designLevi's Advertisement and camapign design
Levi's Advertisement and camapign design
 
Bit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolioBit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolio
 
The concept of motion graphics and its applications.
The concept of motion graphics and its applications.The concept of motion graphics and its applications.
The concept of motion graphics and its applications.
 
Morgenbooster: Storytelling in Identity Design
Morgenbooster: Storytelling in Identity DesignMorgenbooster: Storytelling in Identity Design
Morgenbooster: Storytelling in Identity Design
 
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
Abortion pills in Kuwait 🚚+966505195917 but home delivery available in Kuwait...
 
如何办理(Birmingham毕业证书)伯明翰大学学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(Birmingham毕业证书)伯明翰大学学院毕业证成绩单本科硕士学位证留信学历认证如何办理(Birmingham毕业证书)伯明翰大学学院毕业证成绩单本科硕士学位证留信学历认证
如何办理(Birmingham毕业证书)伯明翰大学学院毕业证成绩单本科硕士学位证留信学历认证
 
Spring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers ParisSpring Summer 2026 Inspirations trend book Peclers Paris
Spring Summer 2026 Inspirations trend book Peclers Paris
 

UX & UI: The differences between two abbreviations

  • 1. UX & UI THE DIFFERENCES BETWEEN TWO ABBREVIATIONS JESSICA KAINU UX DESIGNER KROGER CLT
  • 2. Senior Junior Heavyweight Middleweight Principal Chief Lead Usability User Centered Design User Experience User Interface Human Factors Visual Content Information Interaction Analyst Architect Champion Designer Developer Director Expert Manager Practitioner Professional Researcher Specialist Strategist THE UX JOB TITLE GENERATOR Seniority Practice Role @userfocus
  • 3. UX deals with purpose, while UI deals with appearance and functionality. -Adobe
  • 4. “I don't know what user interface design is, but the way I'd describe your job is that you're the person who makes using a website intuitive and easy to navigate. I'd say that you base your choices on both user feedback and statistics.” -Friend
  • 5. WE CAN AGREE THAT UX & UI are related They need to work together to make a great product. There is some overlap UI decisions are informed by UX research and testing. They are not interchangeable UX and UI are not the same.
  • 6. WE CAN AGREE THAT UX & UI are related They need to work together to make a great product. There is some overlap UI decisions are informed by UX research and testing. They are not interchangeable UX and UI are not the same.
  • 7.
  • 8. WE CAN AGREE THAT UX & UI are related They need to work together to make a great product. There is some overlap UI decisions are informed by UX research and testing. They are not interchangeable UX and UI are not the same.
  • 9.
  • 10. WE CAN AGREE THAT UX & UI are related They need to work together to make a great product. There is some overlap UI decisions are informed by UX research and testing. They are not interchangeable UX and UI are not the same.
  • 11.
  • 12.
  • 13. WHY DOES THIS MATTER? 11 1 Project needs Decide on project goals and what types of people are needed to reach them. Skill sets need to be clear If you believe you need a UX Designer, you should understand what they can do for your project. A designer’s time is important As a designer, understanding a new position and performing a role where it ends up not being what you thought is frustrating. Wasting business resources Hiring a designer that looks like they’ll help your project when they don’t have the right skillset wastes time and resources. Between a business and a designer, it’s important that both are informed about role function and to be on the same page about it.
  • 15. What is it? Collecting data on the problem you’re trying to solve How to User research methods include: Usability testing, user interviews, competitive analysis, tree testing, card sorting, among many many others. RESEARCH & DISCOVERY
  • 16. What is it? Parsing through the data you collected and making sense of it. How to Think of who you are presenting your results to and how they digest information. You can use extended research reports, presentations, or executive summaries. FRAMING RESEARCH RESULTS
  • 17. What is it? Sketching and prototyping a design that solves the problem based on the UX research previously performed. How to Sketch out wires and get feedback. Try out 10 + 10 as a sketching exercise or try a design sprint for a collaborative approach. DESIGN BASED ON RESEARCH
  • 18. What is it? Taking an interactive prototype, whether that be paper or digital and testing with screened users. How to Start with a test script and have personas of who your users are. When recruiting, screen your users. Decide on unmoderated or moderated testing and run through user tasks. TESTING
  • 19. What is it? Communicating design changes that came from research and test results. How to You can use redlining, InVision, style guides and pattern libraries, or present the design with annotated slides. COMMUNICATING TO STAKEHOLDERS
  • 20. THAT’S GREAT BUT WHAT ABOUT WORKING IN AGILE?
  • 21. CASE STUDY Be iterative and get constant feedback It is okay if your design isn’t perfect. Iterative testing will allow you to fix any flaws. Designing a voice product for Smart Display Test smaller features more frequently when possible. Plan far in advance for large features.

Editor's Notes

  1. Intro: Hi, I’m Jessica Kainu and I’m the UX Designer for the voice team where we work on the Kroger action for Google Home and Smart Display. There are a lot of misconceptions out in the wild that UX is the same thing as UI as the two are used interchangeably. I’ve seen job postings requesting a UI/UX Designer or even some sort of mythical creature called a UI/UX Developer. When I see these types of titles and read further descriptions it makes me wary of what the company is expecting from this role as they crammed 3 jobs into 1. For the company, you have to wonder if they understand why they might need a UX or UI professional and if they know what the roles entail. For example, in the past as a UX Designer I participated in a hackathon where I was told the Developers wanted a UX Designer involved. When I got there, they only wanted me to create assets for their projects. There was nothing about reviewing architecture, if the project fulfilled a user need, or if the flows of their app made sense. Now these events are under a time constraint but it didn’t appear that they wanted UX involved, they needed a production artist. In the working world, I’ve also been in meetings where I was given a whiteboard marker and told to start sketching wires, as if that was my only job function. In these situations I wasn’t being utilized for testing, research, or any strategy which was a bit disheartening.
  2. While doing research for this lunch and learn I found something called the UX job title generator and it’s a bit tongue and cheek. Dr. Davis Travis from User Focus created this table based on the responses of 51 people’s job titles. How it works is that you choose a seniority, add your practice, and then pick a role. This table will generate 882 different job titles for UX. My favorite that I’ve pulled from this is “Principal Visual Champion,” though my gut tells me that isn’t a real thing. User experience is a spectrum. From the moment a user enters your app to the time they exit, everything they see, touch, feel - anything they can sense is part of the experience and needs to be designed with intention. We can see here there are hundreds of ways to make up a UX title. There are a lot of different parts to the user experience but there doesn’t appear to be a simple way to tell these apart. Speaking to UI and UX specifically, when these terms are used interchangeably their functions become muddied. There are countless articles from countless designers on this topic, which is evidence that this is a question that needs to get answered. What the heck is the difference between UI and UX?
  3. Let’s start high level, Adobe states that “UX deals with purpose, while UI deals with appearance and functionality.” They are not mutually exclusive and you need both to create a great product. In your own words, what do you think UX and UI designers do?
  4. I asked my friend, who is a jeweler, what the difference between UI and UX was and she surprised me with a pretty interesting answer. “I don't know what user interface design is, but the way I'd describe your job is that you're the person who makes using a website intuitive and easy to navigate. I'd say that you base your choices on both user feedback and statistics.” It’s very affirming that my friend actually listens to me when I talk about what I do for work. My friend has a good idea about UX. What we can surmise is that UX is based in data, analytics, and user research while UI has a creative component. UI deals with the visuals and what the user will interact with.
  5. With that in mind, there are a few things we can all agree on. We know that UX and UI are related in some way, there is some overlap between the fields, and they are certainly not interchangeable.
  6. In the spectrum of UX, having an accessible interface is a piece of the puzzle. Tripin Studio states, “Part of the confusion might lie in the name: UX design. For many people, the word ‘design’ is associated with creativity, colors and graphics, when really its true definition lies in functionality, as well as the process behind making products that provide a seamless experience for the people who use them.”
  7. I’m a visual learner, so let’s consider a the hazard light in a vehicle. We’ve got a Honda, Chevy, and a Fiat here. It’s a rarely used button yet it is front and center. Each is styled a little bit differently, sure, but they all have the same prominence; big, red and right in the middle of the dashboard. This is a good UX decision because in a panic the driver is going to need this button and they’re not not going to want to look for it. The last thing you want to think when you’re in an emergency is, “Where are the stupid flashers?! How do you turn them on?!” The context was thought through for hazard lights with the user in mind, that is the UX. The UI piece would be how the button is styled. How large is the button? Is there some sort of feedback like a click? These decisions are visual and interactive in nature and informed by UX.
  8. The overlap between these two terms happens because the UI is informed by user testing and user research. If UI was designed without data to back up design decisions, there’s a big chance you will end up with a beautiful design that is frustrating to interact with.
  9. Adobe uses a cafe to explain the differences between UX and UI. “Picture yourself in a cafe. Think of the cup, the table, the chair, the coffee beans as the UI of the place. Now, think of the way the coffee is made, the ambience, the service, the music as the UX aspect. UX is literally everything that has impact on your overall experience as a user of something.’” To elaborate further, if there wasn’t a clear idea of where to order or if the menu was confusing, you aren’t sure where to pick up your drink, or worse, you pick up your drink but there is a sea of college kids on their laptops blocking pathways and it isn’t easy to find a seat... But the store looks aesthetically pleasing, this would be UI that’s uninformed by UX. You may go to this cafe once but after that never come back because of the frustration you had the first time. I particularly like this cafe because although there is a clear ordering station and you can easily view the food items as you order though I’m unsure of where I would pick up my drink. It may be the angle of the photograph but this could be a potential pain point. If I had to guess, a customer would order and continue moving from left to right behind the black glass to an assumed counter space. This would be logical since we read left to right; start to finish. What could be frustrating however is that it would be difficult to read the menus as you would be standing in line directly under them. Another question I have for this cafe is where their entrance and exit is located. Do I have to walk against the flow of traffic to get in line? Is there an entrance and an exit or are they the same door? Is there a circular flow where I can go to a creamer station and leave immediately after? Although the colors, photos, and menus all appear to have a local cafe feel, if the pathing and accessibility to the menu is cumbersome, this may deter customers from returning.
  10. Having these two terms used interchangeably is a major frustration. It leads others to believe a UX Designer will design the visual aspect of a product and call it good. UX is so much more than than visual design.
  11. If you haven’t seen this poster before, it is from a blog post by Erik Flowers at Practical Service Design. This sums up what UX is capable of against how it’s commonly perceived. I have experienced this as I’m sure others of you have as well. A lot of what a UX Designer can do involves research, planning, and strategic thinking; none of which are necessarily visual in nature.
  12. In his blog post, he showed a visual of the UX umbrella by Dan Willis. UX encompases so many parts that on a project for instance, there may be an instance where I may be doing user research and testing the navigation scheme or designing how content is interacted with. If you look at the umbrella though, UX and UI aren’t represented. Erik Flowers states... User experience design is omitted [from the umbrella] because it is the loose term that encompasses all of the various disciplines. You’re never really doing any “user experience design” that isn’t just a combination of one or more of the things under the umbrella. User interface design is omitted because it is the crossover between visual design (look and feel) and the interaction design (how the look and feel work). Combine those two and you have an interface. The interface is the result of the “solution design” that came before it. A skillful interface designer understands the importance of providing the user with a solution to a defined problem.
  13. This isn’t simply a semantics issue, it’s a two-way street between designer and business. When the right people aren’t in the appropriate roles, the user ends up with a junky experience. Now this may sound a bit business-heavy but it’s important for everyone to understand what UX and UI are in order to avoid wasting time and resources. Imagine you’re a business and hire the wrong person or a UX Designer who ends up being pushed to do production work or heavy development. This may just be me venting from my experiences as a UX Designer, prior to working at Kroger, and coming to find out the business didn’t understand my role, but it’s happened more frequently than I thought it would. Let’s say you’re a product owner, a manager, or someone running a business. You should understand your project goals and who would be beneficial to bring on to accomplish it. With this starting point in mind, think about how you would you define success and who could help you get there. You should understand the differences between UX and UI for your own benefit. How much research will need to be done on your project? How many designers will this take? What sort of interface are you looking for? Is this an in-and-out interaction or do you need your user to stay in your app and explore? It’s not a good feeling to hire a UX Designer to find out they’ve never performed usability tests, any field research, and have the wrong background for your needs. Being informed about UI and UX roles is crucial because at the end of the day the business and designer need to have a good partnership. Whether you have interviewed for a position that turned out to be a UI/UX Developer Unicorn or moved to a different team within a company, remember that your time as a designer is valuable. It feels great when your skills are used appropriately on a project and terrible when everything is unrelated to what you’ve worked to achieve.
  14. Like articles about UI vs UX, I’ve run across of variations on explaining the UX process. Overall they have the same point but everyone has their spin on it. This will give the general steps you should take as a UX Designer when you are put on a project. This follows what I learned in my masters program and try to do on the voice team as best as I can. I’m sure those of you in Cincinnati may follow something similar.
  15. This is your research phrase or data collection phase. No need to worry about analysis at this point. When your stakeholders approach you about a design problem it’s time to start learning about it via user research. Utilizing user research methods like competitive analysis, user interviews, user testing via the product in its current state, will help validate the problem and provide a direction of where design needs to go. My go-tos are usability testing, user interviews, and competitive analysis. What has been great with Kroger is utilizing 8451 for their researching ability. They’ve aided me with voice research which has allowed me to focus more on other aspects of the voice product. I’ve found those to yield the best results to figure out a design needs to be changed.
  16. You’ve gathered your data and now you need to make it meaningful. If you performed user testing on your current product, you can pull out user quotes or video clips that showcase pain points and success. There is so much meat in user testing that it could be its own presentation. As for interviews, this can involve stakeholders or others related to the product. Who is using your product? What common tasks are they trying to perform? Are there different ways users complete tasks? My last go-to is with competitive analysis which can show industry trends but one thing to keep in mind is if these trends enhance the user experience. For example, just because a company has a chatbot doesn’t mean it is implemented correctly and is it something your project even needs? Never take an idea from someone else without understanding how it will affect the product. You can put a report together from testing, interviews, analysis but it all depends what is the best way to present this information to your stakeholders. I’ve been in situations where I’ve written a 30 page report and others where I wrote an executive summary and was expected to continue moving forward with my findings.
  17. My favorite part of the UX process is UX research, so I may get a little too into the weeds about it. However, once you’ve gotten your design direction that has been informed by research you can start to whiteboard ideas. I’ve done this collaboratively and on my own. Collaboratively is great with a couple other people as they can be challenging you as problems arise. If you’ve ever heard of Google Ventures, you could implement a design sprint if the design problem calls for it. You can read more about this from Jake Knapp’s book. The quick and dirty however is that you and a few others related to the project are in a room for a week doing rounds of sketching and working on building a prototype that can be tested by the end of the week. This allows everyone to have a say in the project and gather different viewpoints. 10+10 is a great sketching exercise which you can do alone or in a group. You write down your problem, say “As a user I would like to add milk to my cart using my voice,” and sketch out 10 different ways a user might do that. Think outside the box, think of something that may not work, think of something boring and realistic. The point is to get 10 different ideas out whether they’re good or bad. Once you’ve drawn them out, get some feedback and figure out which is the best out of the 10. Take that idea and sketch out 10 more iterations of it. This will allow you to get more detailed. By the end of this exercise you will have a good design direction and can work on designing an actual prototype.
  18. You’ve come a long way. You finally have a prototype that you can test. The initial problem that was presented to you has come to fruition in some sort of interactive prototype that you can test with your users. Testing will validate your design decisions and if they solve the problem that was initially presented. When user testing is performed on prototypes, any issues with the design can be discovered and resolved before it is handed off to development. This is all quite a bit of work but it will ultimately save development resources and create a product that is user friendly.
  19. The UX Designer should be able to communicate the changes in the design to their stakeholders, developers and others. This could be done via redlining (slide with example) A document handed off to developers to ensure that designs are made according to specifications. “Redline” refers to the literal guides, which are often red lines, within a document that communicate exact spacing, margin, etc. You could use InVision with the commenting feature or utilizing JIRA to create tickets for developers, though there is a bit more to it than that. However you go about it, your design needs to be clearly communicated so when it is handed off, the developer, stakeholder, or whomever understands what is happening.
  20. A chunk of this process is research and it takes a lot of time to complete, especially if you are testing and interviewing since you have to work with others’ schedules. How can this fit in with an agile team? On the voice team, what I’ve found is that when features are broken up into much smaller pieces, like testing how to add an item to your cart vs how does the Kroger action holistically function, allows for smaller returns but over time the product gets tested without interruption to sprints.
  21. As an example, when designing how the Kroger voice action will work on a Smart Display, we tested features weekly. The features include add to cart, remove from cart, search cart, and clipping coupons. We first had to consider what the major feature was makes this action function, which would be adding items to the cart. From there we could prioritize which other features to test. We took what we knew about how the voice product worked, guidelines of designing for smart display, and created a prototype. By receiving fresh and constant feedback on weekly tests, we could make small changes easily. Testing took up about one day with 4-5 users recruited internally with tests lasting 20-30 minutes. It would be ideal to get out to stores and test with users in their context. Though this is time consuming with travel and scheduling, it yields great results. If you are going to do something like this, it would be advantageous to plan as far ahead as possible so you don’t block your team from other work.
  22. Questions?