SlideShare una empresa de Scribd logo
1 de 29
Descargar para leer sin conexión
Intelligent UX in
Human Centered Design
September 13, 2018
| 2
Sections
● UX Design
● Choice Overload
● What is Human Centered Design?
● Empathy leading to User Insights
● Using Cognitive Bias to Inform UI patterns
● Bento Box in Search Functionality
| 3
Mediacurrent is a full-service digital agency that
implements world class open source software
development, strategy and design to achieve defined
goals for enterprise organizations seeking a better
return on investment.
| 4
| 5
As Creative Director at Mediacurrent, Sheree
provides clients with an immersive and
engaging user experience through empathy
and behavioral science.
With 15 years of award winning agency
experience, Sheree has been privileged to
work with iconic brands including
Harley-Davidson, AT&T, Kellogg’s Special K,
Tupperware, Budweiser, The Home Depot,
Toyota Scion, Listerine, Dancing with the Stars,
American Idol, Southeastern Conference
Sports, NCAA and Sony Pictures.
Her work in higher education includes
University of Southern California, Alvernia,
Georgia Tech and Emory University’s School of
Business.
Sheree Hill
Creative Director
linkedin/in/shereehill/
@flutter
sheree.hill@mediacurrent.com
| 6
UX Design is the planning and testing phase of digital product
design. This practice is informed by human behavior and
experienced throughout the decision making processes.
| 7
Choice Overload: Behavioral economists have shown that in
some instances presenting consumers with many choices
can lead to reduced motivation to make a decision and
decreased satisfaction with choices they end up making.
| 8
Source: Unsplash
| 9
Choice Architecture: Designing options in a way that
leads users towards desired behaviors without limiting choice.
| 10
| 11
People’s choice’s are pervasively influenced by
design elements selected by choice architects.
| 12
Source: Unsplash
| 13
Why did YOU choose to come here today?
| 14
Human Centered Design
begins by building
empathy with the people
for whom we design
| 15
Empathize
DefineTest
Prototype Ideate
Empathy
HUMAN CENTERED DESIGN
| 16
User Personas
Empathy is used in developing user personas (or ideal customer profiles) and
documenting the typical user flow to inform content maps that corresponds to
the each user’s needs within a journey--ultimately creating higher levels of
engagement and conversion.
Typically, persona research includes:
● Background and Demographic Information - Who are they?
● Psychographics - What do they value? What are their goals?
● Marketing Specifics - Where do they search for information?
What do they want from your site?
● Decision Influencers - When are they likely to utilize the site?
What are their current beliefs, problems & common objections?
?
HUMAN CENTERED DESIGN
| 17
Maslow’s Hierarchy of Needs
Level Need
Self-Actualization
Realization or fulfillment of one's talents and
potentialities
Creativity, Spontaneity, Traveling, Self Growth
Esteem
Dignity, Independence
Recognition, Social Status, Education, Achievements, Mastery,
Prestige
Love & Belonging
Emotional Support / Affiliating
Friends, Family, Community, Intimacy, Relationships, Belonging
Safety
Preservation / Stability / Control
Safety, Financial Security, Health, Protection from Elements
Physiological
Lifeforce Energy
Air, Water, Food, Rest
| 18●●●●●
| 19
Define
HUMAN CENTERED DESIGN
Empathize
DefineTest
Prototype Ideate
| 20User Personas USC Libraries
CASE STUDY:
USC Libraries
Age: 25
Job Title: Graduate
Student
● Safety: Execute their main task of
searching and obtaining results as
quickly and painlessly as possible.
● Self Actualization: Desire full USC
Library experience while having the
freedom to work and learn remotely
Goals
● Belonging: Personalized content for a
quick access and usability of system
● Esteem/Belonging: To be a part of a
reputable and trusted university
Values
| 21
Ideate
HUMAN CENTERED DESIGN
Empathize
DefineTest
Prototype Ideate
| 22Strategic Digital Analysis USC Libraries
Medium-Fidelity
This stage allows the illustration
of interaction without losing too
much time to visual details.
UX DESIGN
Wireframes are annotated digital
blueprints, that inform page layout,
interaction elements, and navigation.
They do not contain detailed UI
elements as they are used in the
iterative cycle. We use a cloud based
system to show how each elements
would work in the live environment.
Live Wireframe
Prototyping
Low-Fidelity
High-Fidelity
| 23
Personalization
User Dashboard
1. Authenticated user nav/toolbar - Provides quick access to
dashboard, the ability to customize dashboard and discovery
settings, manage lists, view checkouts and room reservations.
2. Helpful messaging area - Space for USC Libraries to welcome
guests, provide general instructions, or link to a tour or tutorial
video.
3. My Research tiles - Personalized list of relevant/recent content
whose display the user can customize.
4. Discover tiles- Personalized list of related/recommended
content, also with customizable display capabilities.
CASE STUDY: USC LIBRARIES
1
2
3
4
| 24
| 25
Prototype
HUMAN CENTERED DESIGN
Empathize
DefineTest
Prototype Ideate
| 26
The site should be easy
to use and fulfill a need.
Design Values
Color, images, and
other design elements
are used to evoke
emotion.
Strive for equal access
for all people by
designing with
accessible design
methodologies.
Useful & Useable Evocative Accessible
| 27Strategic Digital Analysis USC Libraries
Bento Box Search
Component Highlights
Bento box UI pattern
1. In-page Navigation - Helps users navigate category listings
2. Category Tiles - Allow users to see search results across
multiple databases and immediately dive into resources by
category or type, or to just go directly to an item of interest
3. Filter/Sort, Tooltip, Quick Info, and Item Tools - Additional
tile functionality is being discussed to make the search results
page a better discovery tool, to integrate the bookmarking
system, and to allow authenticated users to save items,
searches, and settings.
CASE STUDY: USC LIBRARIES
1
2 3
| 28
Thank you!
@Mediacurrent Mediacurrent.comfacebook.com/mediacurrent

Más contenido relacionado

Similar a InteractUSG: Intelligent UX in Human Centered Design

UofC Digital Marketing Lecture 2
UofC Digital Marketing Lecture 2UofC Digital Marketing Lecture 2
UofC Digital Marketing Lecture 2John Hutchings
 
Incorporating user personas in software engineering and design processes
Incorporating user personas in software engineering and design processesIncorporating user personas in software engineering and design processes
Incorporating user personas in software engineering and design processesOmotayo Madein
 
Andrew_An_Resume
Andrew_An_ResumeAndrew_An_Resume
Andrew_An_ResumeAndrew An
 
Andrew_An_Resume
Andrew_An_ResumeAndrew_An_Resume
Andrew_An_ResumeAndrew An
 
Andrew_An_Resume
Andrew_An_ResumeAndrew_An_Resume
Andrew_An_ResumeAndrew An
 
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
 
Requirements Engineering for the Humanities
Requirements Engineering for the HumanitiesRequirements Engineering for the Humanities
Requirements Engineering for the HumanitiesShawn Day
 
Ictktn online business essentials 2012 may
Ictktn online business essentials   2012 mayIctktn online business essentials   2012 may
Ictktn online business essentials 2012 mayMargaret Gold
 
Melanie O'Donnell | UX Design Portfolio March 2015
Melanie O'Donnell | UX Design Portfolio March 2015Melanie O'Donnell | UX Design Portfolio March 2015
Melanie O'Donnell | UX Design Portfolio March 2015Melanie O'Donnell
 
User Empathy: Prioritizing Users in your UX Process
User Empathy: Prioritizing Users in your UX ProcessUser Empathy: Prioritizing Users in your UX Process
User Empathy: Prioritizing Users in your UX ProcessMary Fran Wiley
 
Gamify Your Team Design Thinking : Experimental Study on a Co-Evolution Theor...
Gamify Your Team Design Thinking : Experimental Study on a Co-Evolution Theor...Gamify Your Team Design Thinking : Experimental Study on a Co-Evolution Theor...
Gamify Your Team Design Thinking : Experimental Study on a Co-Evolution Theor...Junie Kwon
 
Eason ux design_portfolio
Eason ux design_portfolioEason ux design_portfolio
Eason ux design_portfolioShelda Eason
 
Intranet design strategies2011 (nx power lite)
Intranet design strategies2011 (nx power lite)Intranet design strategies2011 (nx power lite)
Intranet design strategies2011 (nx power lite)Sara Durning, MDes
 

Similar a InteractUSG: Intelligent UX in Human Centered Design (20)

UofC Digital Marketing Lecture 2
UofC Digital Marketing Lecture 2UofC Digital Marketing Lecture 2
UofC Digital Marketing Lecture 2
 
Incorporating user personas in software engineering and design processes
Incorporating user personas in software engineering and design processesIncorporating user personas in software engineering and design processes
Incorporating user personas in software engineering and design processes
 
Andrew_An_Resume
Andrew_An_ResumeAndrew_An_Resume
Andrew_An_Resume
 
Andrew_An_Resume
Andrew_An_ResumeAndrew_An_Resume
Andrew_An_Resume
 
Andrew_An_Resume
Andrew_An_ResumeAndrew_An_Resume
Andrew_An_Resume
 
Myth & fact - Designing for UX
Myth & fact - Designing for UXMyth & fact - Designing for UX
Myth & fact - Designing for UX
 
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
 
SR-capabilities-2015
SR-capabilities-2015SR-capabilities-2015
SR-capabilities-2015
 
SR-capabilities-2015
SR-capabilities-2015SR-capabilities-2015
SR-capabilities-2015
 
Requirements Engineering for the Humanities
Requirements Engineering for the HumanitiesRequirements Engineering for the Humanities
Requirements Engineering for the Humanities
 
Ictktn online business essentials 2012 may
Ictktn online business essentials   2012 mayIctktn online business essentials   2012 may
Ictktn online business essentials 2012 may
 
User Experience Process
User Experience Process User Experience Process
User Experience Process
 
UX Maturity Models
UX Maturity ModelsUX Maturity Models
UX Maturity Models
 
Mobile UX-COE
Mobile UX-COEMobile UX-COE
Mobile UX-COE
 
Melanie O'Donnell | UX Design Portfolio March 2015
Melanie O'Donnell | UX Design Portfolio March 2015Melanie O'Donnell | UX Design Portfolio March 2015
Melanie O'Donnell | UX Design Portfolio March 2015
 
User Empathy: Prioritizing Users in your UX Process
User Empathy: Prioritizing Users in your UX ProcessUser Empathy: Prioritizing Users in your UX Process
User Empathy: Prioritizing Users in your UX Process
 
Gamify Your Team Design Thinking : Experimental Study on a Co-Evolution Theor...
Gamify Your Team Design Thinking : Experimental Study on a Co-Evolution Theor...Gamify Your Team Design Thinking : Experimental Study on a Co-Evolution Theor...
Gamify Your Team Design Thinking : Experimental Study on a Co-Evolution Theor...
 
Eason ux design_portfolio
Eason ux design_portfolioEason ux design_portfolio
Eason ux design_portfolio
 
Intranet design strategies2011 (nx power lite)
Intranet design strategies2011 (nx power lite)Intranet design strategies2011 (nx power lite)
Intranet design strategies2011 (nx power lite)
 
User centric design (ucd)
User centric design (ucd)User centric design (ucd)
User centric design (ucd)
 

Más de Mediacurrent

Penn State News: Pivoting to Decoupled Drupal with Gatsby
Penn State News: Pivoting to Decoupled Drupal with GatsbyPenn State News: Pivoting to Decoupled Drupal with Gatsby
Penn State News: Pivoting to Decoupled Drupal with GatsbyMediacurrent
 
Evolving How We Measure Digital Success in Higher Ed
Evolving How We Measure Digital Success in Higher EdEvolving How We Measure Digital Success in Higher Ed
Evolving How We Measure Digital Success in Higher EdMediacurrent
 
Penn State scales static Drupal to new heights
Penn State scales static Drupal to new heightsPenn State scales static Drupal to new heights
Penn State scales static Drupal to new heightsMediacurrent
 
Delivering Meaningful Digital Experiences in Higher Ed
Delivering Meaningful Digital Experiences in Higher EdDelivering Meaningful Digital Experiences in Higher Ed
Delivering Meaningful Digital Experiences in Higher EdMediacurrent
 
Content Strategy: Building Connections with Your Audience
Content Strategy: Building Connections with Your AudienceContent Strategy: Building Connections with Your Audience
Content Strategy: Building Connections with Your AudienceMediacurrent
 
Decoupled Drupal and Gatsby in the Real World
Decoupled Drupal and Gatsby in the Real WorldDecoupled Drupal and Gatsby in the Real World
Decoupled Drupal and Gatsby in the Real WorldMediacurrent
 
A Better Way to Build and Manage Sites with Rain for Drupal 9
A Better Way to Build and Manage Sites with Rain for Drupal 9A Better Way to Build and Manage Sites with Rain for Drupal 9
A Better Way to Build and Manage Sites with Rain for Drupal 9Mediacurrent
 
Drupal Security: What You Need to Know
Drupal Security: What You Need to KnowDrupal Security: What You Need to Know
Drupal Security: What You Need to KnowMediacurrent
 
Leveraging Design Systems to Streamline Web Projects
Leveraging Design Systems to Streamline Web ProjectsLeveraging Design Systems to Streamline Web Projects
Leveraging Design Systems to Streamline Web ProjectsMediacurrent
 
Reimagining Your Higher Ed Web Strategy
Reimagining Your Higher Ed Web StrategyReimagining Your Higher Ed Web Strategy
Reimagining Your Higher Ed Web StrategyMediacurrent
 
How to Digitally Transform Higher Ed with Drupal
How to Digitally Transform Higher Ed with DrupalHow to Digitally Transform Higher Ed with Drupal
How to Digitally Transform Higher Ed with DrupalMediacurrent
 
Is my website accessible? Common mistakes (and how to fix them)
Is my website accessible? Common mistakes (and how to fix them)Is my website accessible? Common mistakes (and how to fix them)
Is my website accessible? Common mistakes (and how to fix them)Mediacurrent
 
Managing Images In Large Scale Drupal 8 & 9 Websites
Managing Images In Large Scale Drupal 8 & 9 WebsitesManaging Images In Large Scale Drupal 8 & 9 Websites
Managing Images In Large Scale Drupal 8 & 9 WebsitesMediacurrent
 
Paragraphs v Layout Builder - The Final Showdown
Paragraphs v Layout Builder - The Final ShowdownParagraphs v Layout Builder - The Final Showdown
Paragraphs v Layout Builder - The Final ShowdownMediacurrent
 
MagMutual.com: On the JAMStack with Gatsby and Drupal 8
 MagMutual.com: On the JAMStack with Gatsby and Drupal 8 MagMutual.com: On the JAMStack with Gatsby and Drupal 8
MagMutual.com: On the JAMStack with Gatsby and Drupal 8Mediacurrent
 
Creating an Organizational Culture of Giving Back to Drupal
Creating an Organizational Culture of Giving Back to DrupalCreating an Organizational Culture of Giving Back to Drupal
Creating an Organizational Culture of Giving Back to DrupalMediacurrent
 
Level Up Your Team: Front-End Development Best Practices
Level Up Your Team: Front-End Development Best PracticesLevel Up Your Team: Front-End Development Best Practices
Level Up Your Team: Front-End Development Best PracticesMediacurrent
 
Best Practices for Moving to Drupal 9
Best Practices for Moving to Drupal 9Best Practices for Moving to Drupal 9
Best Practices for Moving to Drupal 9Mediacurrent
 
How to Prove Marketing ROI: Overcoming Digital Marketing Challenges
How to Prove Marketing ROI: Overcoming Digital Marketing ChallengesHow to Prove Marketing ROI: Overcoming Digital Marketing Challenges
How to Prove Marketing ROI: Overcoming Digital Marketing ChallengesMediacurrent
 
Prepare Your Drupal 9 Action Plan
Prepare Your Drupal 9 Action Plan Prepare Your Drupal 9 Action Plan
Prepare Your Drupal 9 Action Plan Mediacurrent
 

Más de Mediacurrent (20)

Penn State News: Pivoting to Decoupled Drupal with Gatsby
Penn State News: Pivoting to Decoupled Drupal with GatsbyPenn State News: Pivoting to Decoupled Drupal with Gatsby
Penn State News: Pivoting to Decoupled Drupal with Gatsby
 
Evolving How We Measure Digital Success in Higher Ed
Evolving How We Measure Digital Success in Higher EdEvolving How We Measure Digital Success in Higher Ed
Evolving How We Measure Digital Success in Higher Ed
 
Penn State scales static Drupal to new heights
Penn State scales static Drupal to new heightsPenn State scales static Drupal to new heights
Penn State scales static Drupal to new heights
 
Delivering Meaningful Digital Experiences in Higher Ed
Delivering Meaningful Digital Experiences in Higher EdDelivering Meaningful Digital Experiences in Higher Ed
Delivering Meaningful Digital Experiences in Higher Ed
 
Content Strategy: Building Connections with Your Audience
Content Strategy: Building Connections with Your AudienceContent Strategy: Building Connections with Your Audience
Content Strategy: Building Connections with Your Audience
 
Decoupled Drupal and Gatsby in the Real World
Decoupled Drupal and Gatsby in the Real WorldDecoupled Drupal and Gatsby in the Real World
Decoupled Drupal and Gatsby in the Real World
 
A Better Way to Build and Manage Sites with Rain for Drupal 9
A Better Way to Build and Manage Sites with Rain for Drupal 9A Better Way to Build and Manage Sites with Rain for Drupal 9
A Better Way to Build and Manage Sites with Rain for Drupal 9
 
Drupal Security: What You Need to Know
Drupal Security: What You Need to KnowDrupal Security: What You Need to Know
Drupal Security: What You Need to Know
 
Leveraging Design Systems to Streamline Web Projects
Leveraging Design Systems to Streamline Web ProjectsLeveraging Design Systems to Streamline Web Projects
Leveraging Design Systems to Streamline Web Projects
 
Reimagining Your Higher Ed Web Strategy
Reimagining Your Higher Ed Web StrategyReimagining Your Higher Ed Web Strategy
Reimagining Your Higher Ed Web Strategy
 
How to Digitally Transform Higher Ed with Drupal
How to Digitally Transform Higher Ed with DrupalHow to Digitally Transform Higher Ed with Drupal
How to Digitally Transform Higher Ed with Drupal
 
Is my website accessible? Common mistakes (and how to fix them)
Is my website accessible? Common mistakes (and how to fix them)Is my website accessible? Common mistakes (and how to fix them)
Is my website accessible? Common mistakes (and how to fix them)
 
Managing Images In Large Scale Drupal 8 & 9 Websites
Managing Images In Large Scale Drupal 8 & 9 WebsitesManaging Images In Large Scale Drupal 8 & 9 Websites
Managing Images In Large Scale Drupal 8 & 9 Websites
 
Paragraphs v Layout Builder - The Final Showdown
Paragraphs v Layout Builder - The Final ShowdownParagraphs v Layout Builder - The Final Showdown
Paragraphs v Layout Builder - The Final Showdown
 
MagMutual.com: On the JAMStack with Gatsby and Drupal 8
 MagMutual.com: On the JAMStack with Gatsby and Drupal 8 MagMutual.com: On the JAMStack with Gatsby and Drupal 8
MagMutual.com: On the JAMStack with Gatsby and Drupal 8
 
Creating an Organizational Culture of Giving Back to Drupal
Creating an Organizational Culture of Giving Back to DrupalCreating an Organizational Culture of Giving Back to Drupal
Creating an Organizational Culture of Giving Back to Drupal
 
Level Up Your Team: Front-End Development Best Practices
Level Up Your Team: Front-End Development Best PracticesLevel Up Your Team: Front-End Development Best Practices
Level Up Your Team: Front-End Development Best Practices
 
Best Practices for Moving to Drupal 9
Best Practices for Moving to Drupal 9Best Practices for Moving to Drupal 9
Best Practices for Moving to Drupal 9
 
How to Prove Marketing ROI: Overcoming Digital Marketing Challenges
How to Prove Marketing ROI: Overcoming Digital Marketing ChallengesHow to Prove Marketing ROI: Overcoming Digital Marketing Challenges
How to Prove Marketing ROI: Overcoming Digital Marketing Challenges
 
Prepare Your Drupal 9 Action Plan
Prepare Your Drupal 9 Action Plan Prepare Your Drupal 9 Action Plan
Prepare Your Drupal 9 Action Plan
 

Último

How to Create a Productive Workspace Trends and Tips.pdf
How to Create a Productive Workspace Trends and Tips.pdfHow to Create a Productive Workspace Trends and Tips.pdf
How to Create a Productive Workspace Trends and Tips.pdfOffice Furniture Plus - Irving
 
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...gajnagarg
 
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证wpkuukw
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...instagramfab782445
 
Gamestore case study UI UX by Amgad Ibrahim
Gamestore case study UI UX by Amgad IbrahimGamestore case study UI UX by Amgad Ibrahim
Gamestore case study UI UX by Amgad Ibrahimamgadibrahim92
 
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样awasv46j
 
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证eeanqy
 
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...HyderabadDolls
 
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for FriendshipRaebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for FriendshipNitya salvi
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Websitemark11275
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789CristineGraceAcuyan
 
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证eqaqen
 
The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024Ilham Brata
 
How to Turn a Picture Into a Line Drawing in Photoshop
How to Turn a Picture Into a Line Drawing in PhotoshopHow to Turn a Picture Into a Line Drawing in Photoshop
How to Turn a Picture Into a Line Drawing in PhotoshopZenith Clipping
 
Sweety Planet Packaging Design Process Book.pptx
Sweety Planet Packaging Design Process Book.pptxSweety Planet Packaging Design Process Book.pptx
Sweety Planet Packaging Design Process Book.pptxbingyichin04
 
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...Amil baba
 
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...gajnagarg
 
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime PondicherryPondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherrymeghakumariji156
 
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...gajnagarg
 
Q4-W4-SCIENCE-5 power point presentation
Q4-W4-SCIENCE-5 power point presentationQ4-W4-SCIENCE-5 power point presentation
Q4-W4-SCIENCE-5 power point presentationZenSeloveres
 

Último (20)

How to Create a Productive Workspace Trends and Tips.pdf
How to Create a Productive Workspace Trends and Tips.pdfHow to Create a Productive Workspace Trends and Tips.pdf
How to Create a Productive Workspace Trends and Tips.pdf
 
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Mysore [ 7014168258 ] Call Me For Genuine Models We...
 
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
一比一定(购)滑铁卢大学毕业证(UW毕业证)成绩单学位证
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
 
Gamestore case study UI UX by Amgad Ibrahim
Gamestore case study UI UX by Amgad IbrahimGamestore case study UI UX by Amgad Ibrahim
Gamestore case study UI UX by Amgad Ibrahim
 
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
一比一原版(WLU毕业证)罗瑞尔大学毕业证成绩单留信学历认证原版一模一样
 
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
怎样办理伯明翰大学学院毕业证(Birmingham毕业证书)成绩单留信认证
 
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
 
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for FriendshipRaebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
 
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
 
The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024
 
How to Turn a Picture Into a Line Drawing in Photoshop
How to Turn a Picture Into a Line Drawing in PhotoshopHow to Turn a Picture Into a Line Drawing in Photoshop
How to Turn a Picture Into a Line Drawing in Photoshop
 
Sweety Planet Packaging Design Process Book.pptx
Sweety Planet Packaging Design Process Book.pptxSweety Planet Packaging Design Process Book.pptx
Sweety Planet Packaging Design Process Book.pptx
 
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
 
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
 
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime PondicherryPondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
 
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
 
Q4-W4-SCIENCE-5 power point presentation
Q4-W4-SCIENCE-5 power point presentationQ4-W4-SCIENCE-5 power point presentation
Q4-W4-SCIENCE-5 power point presentation
 

InteractUSG: Intelligent UX in Human Centered Design

  • 1. Intelligent UX in Human Centered Design September 13, 2018
  • 2. | 2 Sections ● UX Design ● Choice Overload ● What is Human Centered Design? ● Empathy leading to User Insights ● Using Cognitive Bias to Inform UI patterns ● Bento Box in Search Functionality
  • 3. | 3 Mediacurrent is a full-service digital agency that implements world class open source software development, strategy and design to achieve defined goals for enterprise organizations seeking a better return on investment.
  • 4. | 4
  • 5. | 5 As Creative Director at Mediacurrent, Sheree provides clients with an immersive and engaging user experience through empathy and behavioral science. With 15 years of award winning agency experience, Sheree has been privileged to work with iconic brands including Harley-Davidson, AT&T, Kellogg’s Special K, Tupperware, Budweiser, The Home Depot, Toyota Scion, Listerine, Dancing with the Stars, American Idol, Southeastern Conference Sports, NCAA and Sony Pictures. Her work in higher education includes University of Southern California, Alvernia, Georgia Tech and Emory University’s School of Business. Sheree Hill Creative Director linkedin/in/shereehill/ @flutter sheree.hill@mediacurrent.com
  • 6. | 6 UX Design is the planning and testing phase of digital product design. This practice is informed by human behavior and experienced throughout the decision making processes.
  • 7. | 7 Choice Overload: Behavioral economists have shown that in some instances presenting consumers with many choices can lead to reduced motivation to make a decision and decreased satisfaction with choices they end up making.
  • 9. | 9 Choice Architecture: Designing options in a way that leads users towards desired behaviors without limiting choice.
  • 10. | 10
  • 11. | 11 People’s choice’s are pervasively influenced by design elements selected by choice architects.
  • 13. | 13 Why did YOU choose to come here today?
  • 14. | 14 Human Centered Design begins by building empathy with the people for whom we design
  • 16. | 16 User Personas Empathy is used in developing user personas (or ideal customer profiles) and documenting the typical user flow to inform content maps that corresponds to the each user’s needs within a journey--ultimately creating higher levels of engagement and conversion. Typically, persona research includes: ● Background and Demographic Information - Who are they? ● Psychographics - What do they value? What are their goals? ● Marketing Specifics - Where do they search for information? What do they want from your site? ● Decision Influencers - When are they likely to utilize the site? What are their current beliefs, problems & common objections? ? HUMAN CENTERED DESIGN
  • 17. | 17 Maslow’s Hierarchy of Needs Level Need Self-Actualization Realization or fulfillment of one's talents and potentialities Creativity, Spontaneity, Traveling, Self Growth Esteem Dignity, Independence Recognition, Social Status, Education, Achievements, Mastery, Prestige Love & Belonging Emotional Support / Affiliating Friends, Family, Community, Intimacy, Relationships, Belonging Safety Preservation / Stability / Control Safety, Financial Security, Health, Protection from Elements Physiological Lifeforce Energy Air, Water, Food, Rest
  • 19. | 19 Define HUMAN CENTERED DESIGN Empathize DefineTest Prototype Ideate
  • 20. | 20User Personas USC Libraries CASE STUDY: USC Libraries Age: 25 Job Title: Graduate Student ● Safety: Execute their main task of searching and obtaining results as quickly and painlessly as possible. ● Self Actualization: Desire full USC Library experience while having the freedom to work and learn remotely Goals ● Belonging: Personalized content for a quick access and usability of system ● Esteem/Belonging: To be a part of a reputable and trusted university Values
  • 21. | 21 Ideate HUMAN CENTERED DESIGN Empathize DefineTest Prototype Ideate
  • 22. | 22Strategic Digital Analysis USC Libraries Medium-Fidelity This stage allows the illustration of interaction without losing too much time to visual details. UX DESIGN Wireframes are annotated digital blueprints, that inform page layout, interaction elements, and navigation. They do not contain detailed UI elements as they are used in the iterative cycle. We use a cloud based system to show how each elements would work in the live environment. Live Wireframe Prototyping Low-Fidelity High-Fidelity
  • 23. | 23 Personalization User Dashboard 1. Authenticated user nav/toolbar - Provides quick access to dashboard, the ability to customize dashboard and discovery settings, manage lists, view checkouts and room reservations. 2. Helpful messaging area - Space for USC Libraries to welcome guests, provide general instructions, or link to a tour or tutorial video. 3. My Research tiles - Personalized list of relevant/recent content whose display the user can customize. 4. Discover tiles- Personalized list of related/recommended content, also with customizable display capabilities. CASE STUDY: USC LIBRARIES 1 2 3 4
  • 24. | 24
  • 25. | 25 Prototype HUMAN CENTERED DESIGN Empathize DefineTest Prototype Ideate
  • 26. | 26 The site should be easy to use and fulfill a need. Design Values Color, images, and other design elements are used to evoke emotion. Strive for equal access for all people by designing with accessible design methodologies. Useful & Useable Evocative Accessible
  • 27. | 27Strategic Digital Analysis USC Libraries Bento Box Search Component Highlights Bento box UI pattern 1. In-page Navigation - Helps users navigate category listings 2. Category Tiles - Allow users to see search results across multiple databases and immediately dive into resources by category or type, or to just go directly to an item of interest 3. Filter/Sort, Tooltip, Quick Info, and Item Tools - Additional tile functionality is being discussed to make the search results page a better discovery tool, to integrate the bookmarking system, and to allow authenticated users to save items, searches, and settings. CASE STUDY: USC LIBRARIES 1 2 3
  • 28. | 28