SlideShare a Scribd company logo
User Interface Design: Best Practices
Design Language Comics




© 2007, Stacie Gomm, Utah State University
Design Language Comics




             Design Language Comics




© 2007, Stacie Gomm, Utah State University
Imbedded User Languages

                  Stacie Gomm
                  Utah State University
                  May 2007




© 2007, Stacie Gomm, Utah State University
How do these relate?




 How do you know that?
© 2007, Stacie Gomm, Utah State University
The design of the key and
                      keyhole concept is implicit
                        and it is has a language
                       which “speaks” to users
                      and let’s users know what
                       they are supposed to do.



© 2007, Stacie Gomm, Utah State University
Does this “speak” to you?




© 2007, Stacie Gomm, Utah State University
Imbedded User Languages

         This imbedded language is
           often overlooked or its
         existence is not realized as
       users develop products which
       are used in our everyday lives.
© 2007, Stacie Gomm, Utah State University
Imbedded User Languages

   The user language imbedded in
      every designed product
   communicates to the users the
       use for/of that product.


© 2007, Stacie Gomm, Utah State University
Design of Everyday Things
                                             by Donald Norman
   The human mind is exquisitely tailored to make sense of the
   world. Give it the slightest clue and off it goes, providing
   explanation, rationalization, understanding. Consider the
   objects – nooks, radios, kitchen, appliances, office machines,
   and light switches – that make up our everyday lives. Well-
   designed objects are easy to interpret and understand. They
   contain visible clues to their operation. Poorly designed objects
   can be difficult and frustrating to use. They provide no clues –
   or sometimes false clues. They trap the user and thwart the
   normal processing interpretation and understanding (Norman, p.
   2, italics added).

© 2007, Stacie Gomm, Utah State University
Design of Everyday Things
                                             by Donald Norman
   Included in every design are the
   affordances, mappings, visibility,
   and feedback and each of these
      has it own implicit language
       which speaks to the user.
© 2007, Stacie Gomm, Utah State University
Design of Everyday Things
                                             by Donald Norman
        Affordances are the “perceived and actual properties
         of the thing, primarily those fundamental properties
         that determine just how the thing could possibly be
                          used” (Norman, p. 9).


                  Mapping is a technical term meaning the
                “relationship between two things, in this case
             between the controls and their movements and the
            results in the world. … Natural mapping … leads to
                 immediate understanding” (Norman, p. 23).
© 2007, Stacie Gomm, Utah State University
Design of Everyday Things
                                             by Donald Norman
       In good design things are visible. “There are good
     mappings, natural relationships, between the controls and
          the things that are controlled” (Norman, p. 22).




           Feedback is the notion of sending back to the user
        information about what action has actually been done --
          what result has been accomplished (Norman, p. 27).


© 2007, Stacie Gomm, Utah State University
Design of Everyday Things
                                              by Donald Norman
       Norman suggests that when developing a product ALL of the
       following should be included in its user language:
       •Visibility – By looking the user can tell the state of the device and
       the alternatives for action.
       •Affordances – The designer provides a good conceptual model
       for the user, with consistency in the presentation of operations and
       results and a coherent, consistent system image.
       •Good mappings – It is possible to determine the relationship
       between actions and results, between the controls and their
       effects, and between the system state and what is visible.
       •Feedback – The user receives full and continuous feedback about
       the results of actions. (Norman, p.53)
© 2007, Stacie Gomm, Utah State University
Netest
      A testing system developed at Utah
      State University that is used to
      administer the Computer and
      Information Literacy (CIL) tests.


      Lack of communication could
      interfere with the user being able to
      pass a test.
© 2007, Stacie Gomm, Utah State University
Netest – Trainee Interface



                                                 Visibility

                                                 This screen
                                                 shows all of the
                                                 options available
                                                 to trainees.




© 2007, Stacie Gomm, Utah State University
Netest – Trainee Interface



                                                 Affordances

                                                 It is obvious which
                                                 buttons perform
                                                 which tasks.




© 2007, Stacie Gomm, Utah State University
Netest – Trainee Interface



                                                 Mappings

                                                 Mapping buttons to
                                                 their action is done
                                                 well in this
                                                 program.




© 2007, Stacie Gomm, Utah State University
Netest – Trainee Interface



                                                 Feedback

                                                 The buttons
                                                 actually do what is
                                                 expected.




© 2007, Stacie Gomm, Utah State University
Netest – Testing Interface



                                                     Norman
                                                     contends that
                                                     when simple
                                                     things need
                                                     pictures,
                                                     labels, or
                                                     instructions,
                                                     the design
                                                     has failed
                                                     (p.9).




© 2007, Stacie Gomm, Utah State University
Implications for Portal Design




         When building a portal there exists a
         language that communicates to the user the
         actions which are expected by the user.
         When a designer designs the portal, there is
         a built in user language. The designer must
         realize this fact in order for his design to be
         able to communicate effectively with its
         users. This language is used by the user to
         communicate with the portal system.
© 2007, Stacie Gomm, Utah State University
Implications for Portal




         Show sample Portals
         Identify commonalities and
         what the user expects



© 2007, Stacie Gomm, Utah State University
Design of Everyday Things


                                             by Donald Norman


                 When developing instructional products,
                 according to Norman, this is what
                 instructional designers should do:


       1. Understand the causes of error and
          design and to minimize those causes.



© 2007, Stacie Gomm, Utah State University
Design of Everyday Things


                                             by Donald Norman


       2. Make it possible to reverse actions –
          to “undo” them – or to make it harder
          to do what cannot be reversed.
       3. Make it easier to discover the errors
          that do occur, and make them easier
          to correct.



© 2007, Stacie Gomm, Utah State University
Design of Everyday Things


                                             by Donald Norman


       4. Change the attitude toward errors.
          Think of an object’s user as
          attempting to do a task, getting there
          by imperfect approximations. Don’t
          think of the user as making errors;
          think of the actions as approximations
          of what is desired. (p. 131)



© 2007, Stacie Gomm, Utah State University
Imbedded User Languages




          “Good” designers have a
      realization and understanding of
        the user language contained
      within their products and insure
       complete communication takes
       place between the product and
                     user.
© 2007, Stacie Gomm, Utah State University
Imbedded User Languages




                        Questions / Comments?




                                             Contact Info:
                         Stacie.Gomm@usu.edu

© 2007, Stacie Gomm, Utah State University

More Related Content

Viewers also liked

Usability Best Practices for Adopting Responsive Design
Usability Best Practices for Adopting Responsive DesignUsability Best Practices for Adopting Responsive Design
Usability Best Practices for Adopting Responsive Design
UXPA International
 
Mobile User Experience - @iRajLal
Mobile User Experience - @iRajLalMobile User Experience - @iRajLal
Mobile User Experience - @iRajLal
Raj Lal
 
Establishing best practices to improve usefulness and usability of web interf...
Establishing best practices to improve usefulness and usability of web interf...Establishing best practices to improve usefulness and usability of web interf...
Establishing best practices to improve usefulness and usability of web interf...
DRIscience
 
UID_AZY_COMP1650
UID_AZY_COMP1650UID_AZY_COMP1650
UID_AZY_COMP1650Aung Zay Ya
 
13 si(systems analysis and design )
13 si(systems analysis and design )13 si(systems analysis and design )
13 si(systems analysis and design )
Nurdin Al-Azies
 
His hers yours mine
His hers yours mineHis hers yours mine
His hers yours mineElmo Hado
 
Abdullah turan 20283806 mis ass#1
Abdullah turan 20283806 mis ass#1Abdullah turan 20283806 mis ass#1
Abdullah turan 20283806 mis ass#1
Abdullah46
 
Engineering desing process
Engineering desing processEngineering desing process
Engineering desing process
cwyatt01
 
Mappa alberi instagram
Mappa alberi   instagramMappa alberi   instagram
Mappa alberi instagram
City Planner
 
Cer power point
Cer power pointCer power point
Cer power point
cwyatt01
 
Usability & User Experience 101 - #UX101
Usability & User Experience 101 - #UX101Usability & User Experience 101 - #UX101
Usability & User Experience 101 - #UX101
Become Customer-Centric
 
Principles of ui design
Principles of ui designPrinciples of ui design
Principles of ui design
Iaroslava Rizova
 
Visual Usability: principles & practices for designing great web and mobile a...
Visual Usability: principles & practices for designing great web and mobile a...Visual Usability: principles & practices for designing great web and mobile a...
Visual Usability: principles & practices for designing great web and mobile a...
Tania Schlatter
 
User Interface Testing | Best Practices
User Interface Testing | Best Practices User Interface Testing | Best Practices
User Interface Testing | Best Practices
David Tzemach
 
Forms usability design best practices experience dynamics web seminar
Forms usability design best practices  experience dynamics web seminarForms usability design best practices  experience dynamics web seminar
Forms usability design best practices experience dynamics web seminar
Experience Dynamics
 
User Interface
User InterfaceUser Interface
User Interface
Sarthak Kaura
 
Mobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best PracticesMobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best Practices
OXD
 
Automotive User Interface Design: Innovative UI design in a slow moving indus...
Automotive User Interface Design: Innovative UI design in a slow moving indus...Automotive User Interface Design: Innovative UI design in a slow moving indus...
Automotive User Interface Design: Innovative UI design in a slow moving indus...
UXPA International
 
Chapter 5 software design
Chapter 5 software designChapter 5 software design
Chapter 5 software designPiyush Gogia
 

Viewers also liked (20)

Usability Best Practices for Adopting Responsive Design
Usability Best Practices for Adopting Responsive DesignUsability Best Practices for Adopting Responsive Design
Usability Best Practices for Adopting Responsive Design
 
Mobile User Experience - @iRajLal
Mobile User Experience - @iRajLalMobile User Experience - @iRajLal
Mobile User Experience - @iRajLal
 
Establishing best practices to improve usefulness and usability of web interf...
Establishing best practices to improve usefulness and usability of web interf...Establishing best practices to improve usefulness and usability of web interf...
Establishing best practices to improve usefulness and usability of web interf...
 
UID_AZY_COMP1650
UID_AZY_COMP1650UID_AZY_COMP1650
UID_AZY_COMP1650
 
Revit Lesson 01A
Revit Lesson 01ARevit Lesson 01A
Revit Lesson 01A
 
13 si(systems analysis and design )
13 si(systems analysis and design )13 si(systems analysis and design )
13 si(systems analysis and design )
 
His hers yours mine
His hers yours mineHis hers yours mine
His hers yours mine
 
Abdullah turan 20283806 mis ass#1
Abdullah turan 20283806 mis ass#1Abdullah turan 20283806 mis ass#1
Abdullah turan 20283806 mis ass#1
 
Engineering desing process
Engineering desing processEngineering desing process
Engineering desing process
 
Mappa alberi instagram
Mappa alberi   instagramMappa alberi   instagram
Mappa alberi instagram
 
Cer power point
Cer power pointCer power point
Cer power point
 
Usability & User Experience 101 - #UX101
Usability & User Experience 101 - #UX101Usability & User Experience 101 - #UX101
Usability & User Experience 101 - #UX101
 
Principles of ui design
Principles of ui designPrinciples of ui design
Principles of ui design
 
Visual Usability: principles & practices for designing great web and mobile a...
Visual Usability: principles & practices for designing great web and mobile a...Visual Usability: principles & practices for designing great web and mobile a...
Visual Usability: principles & practices for designing great web and mobile a...
 
User Interface Testing | Best Practices
User Interface Testing | Best Practices User Interface Testing | Best Practices
User Interface Testing | Best Practices
 
Forms usability design best practices experience dynamics web seminar
Forms usability design best practices  experience dynamics web seminarForms usability design best practices  experience dynamics web seminar
Forms usability design best practices experience dynamics web seminar
 
User Interface
User InterfaceUser Interface
User Interface
 
Mobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best PracticesMobile UI Design – User Centered Design and UI Best Practices
Mobile UI Design – User Centered Design and UI Best Practices
 
Automotive User Interface Design: Innovative UI design in a slow moving indus...
Automotive User Interface Design: Innovative UI design in a slow moving indus...Automotive User Interface Design: Innovative UI design in a slow moving indus...
Automotive User Interface Design: Innovative UI design in a slow moving indus...
 
Chapter 5 software design
Chapter 5 software designChapter 5 software design
Chapter 5 software design
 

Similar to User Interface Design Best Practices

Seii unit5 ui_design
Seii unit5 ui_designSeii unit5 ui_design
Seii unit5 ui_design
Ahmad sohail Kakar
 
Audacity for Listening and Speaking Material Development
Audacity for Listening and Speaking Material DevelopmentAudacity for Listening and Speaking Material Development
Audacity for Listening and Speaking Material DevelopmentDilip Barad
 
Evaluating Touch Gesture Usability -- D4M 2010
Evaluating Touch Gesture Usability -- D4M 2010Evaluating Touch Gesture Usability -- D4M 2010
Evaluating Touch Gesture Usability -- D4M 2010
Kevin Arthur
 
An agile approach to iPhone design: Paper prototyping + user testing
An agile approach to iPhone design:  Paper prototyping + user testingAn agile approach to iPhone design:  Paper prototyping + user testing
An agile approach to iPhone design: Paper prototyping + user testing
Ginsburg Design
 
Webinar: The Workforce of Tomorrow
Webinar: The Workforce of TomorrowWebinar: The Workforce of Tomorrow
Webinar: The Workforce of Tomorrow
Yankee Group
 
TCC TAM applied to online education
TCC TAM applied to online educationTCC TAM applied to online education
TCC TAM applied to online education
National University
 
The Elements Of User Experience
The Elements Of User ExperienceThe Elements Of User Experience
The Elements Of User Experience
John Chen, Jun
 
Unit iii(part c - user interface design)
Unit   iii(part c - user interface design)Unit   iii(part c - user interface design)
Unit iii(part c - user interface design)
BALAJI A
 
Mobile speech and advanced natural language solutions
Mobile speech and advanced natural language solutionsMobile speech and advanced natural language solutions
Mobile speech and advanced natural language solutionsSpringer
 

Similar to User Interface Design Best Practices (9)

Seii unit5 ui_design
Seii unit5 ui_designSeii unit5 ui_design
Seii unit5 ui_design
 
Audacity for Listening and Speaking Material Development
Audacity for Listening and Speaking Material DevelopmentAudacity for Listening and Speaking Material Development
Audacity for Listening and Speaking Material Development
 
Evaluating Touch Gesture Usability -- D4M 2010
Evaluating Touch Gesture Usability -- D4M 2010Evaluating Touch Gesture Usability -- D4M 2010
Evaluating Touch Gesture Usability -- D4M 2010
 
An agile approach to iPhone design: Paper prototyping + user testing
An agile approach to iPhone design:  Paper prototyping + user testingAn agile approach to iPhone design:  Paper prototyping + user testing
An agile approach to iPhone design: Paper prototyping + user testing
 
Webinar: The Workforce of Tomorrow
Webinar: The Workforce of TomorrowWebinar: The Workforce of Tomorrow
Webinar: The Workforce of Tomorrow
 
TCC TAM applied to online education
TCC TAM applied to online educationTCC TAM applied to online education
TCC TAM applied to online education
 
The Elements Of User Experience
The Elements Of User ExperienceThe Elements Of User Experience
The Elements Of User Experience
 
Unit iii(part c - user interface design)
Unit   iii(part c - user interface design)Unit   iii(part c - user interface design)
Unit iii(part c - user interface design)
 
Mobile speech and advanced natural language solutions
Mobile speech and advanced natural language solutionsMobile speech and advanced natural language solutions
Mobile speech and advanced natural language solutions
 

More from Satyajit Roy

Iot healthcare
Iot healthcareIot healthcare
Iot healthcare
Satyajit Roy
 
Ux strategy design digital transformation
Ux strategy design digital transformationUx strategy design digital transformation
Ux strategy design digital transformation
Satyajit Roy
 
Gamified Tv Ads with Augmented Reality
Gamified Tv Ads with Augmented RealityGamified Tv Ads with Augmented Reality
Gamified Tv Ads with Augmented Reality
Satyajit Roy
 
Mobile UX-COE
Mobile UX-COEMobile UX-COE
Mobile UX-COE
Satyajit Roy
 
Appification vs gamification
Appification vs gamificationAppification vs gamification
Appification vs gamification
Satyajit Roy
 
Healthcare Gamification
Healthcare GamificationHealthcare Gamification
Healthcare Gamification
Satyajit Roy
 
Gamification HR
Gamification HRGamification HR
Gamification HR
Satyajit Roy
 
Fine docs product presentation latest
Fine docs product presentation latestFine docs product presentation latest
Fine docs product presentation latestSatyajit Roy
 

More from Satyajit Roy (9)

Iot healthcare
Iot healthcareIot healthcare
Iot healthcare
 
Ux strategy design digital transformation
Ux strategy design digital transformationUx strategy design digital transformation
Ux strategy design digital transformation
 
Gamified Tv Ads with Augmented Reality
Gamified Tv Ads with Augmented RealityGamified Tv Ads with Augmented Reality
Gamified Tv Ads with Augmented Reality
 
Mobile UX-COE
Mobile UX-COEMobile UX-COE
Mobile UX-COE
 
Appification vs gamification
Appification vs gamificationAppification vs gamification
Appification vs gamification
 
Healthcare Gamification
Healthcare GamificationHealthcare Gamification
Healthcare Gamification
 
Gamification HR
Gamification HRGamification HR
Gamification HR
 
Portfolio 1
Portfolio 1Portfolio 1
Portfolio 1
 
Fine docs product presentation latest
Fine docs product presentation latestFine docs product presentation latest
Fine docs product presentation latest
 

Recently uploaded

ikea_woodgreen_petscharity_dog-alogue_digital.pdf
ikea_woodgreen_petscharity_dog-alogue_digital.pdfikea_woodgreen_petscharity_dog-alogue_digital.pdf
ikea_woodgreen_petscharity_dog-alogue_digital.pdf
agatadrynko
 
Tata Group Dials Taiwan for Its Chipmaking Ambition in Gujarat’s Dholera
Tata Group Dials Taiwan for Its Chipmaking Ambition in Gujarat’s DholeraTata Group Dials Taiwan for Its Chipmaking Ambition in Gujarat’s Dholera
Tata Group Dials Taiwan for Its Chipmaking Ambition in Gujarat’s Dholera
Avirahi City Dholera
 
VAT Registration Outlined In UAE: Benefits and Requirements
VAT Registration Outlined In UAE: Benefits and RequirementsVAT Registration Outlined In UAE: Benefits and Requirements
VAT Registration Outlined In UAE: Benefits and Requirements
uae taxgpt
 
falcon-invoice-discounting-a-premier-platform-for-investors-in-india
falcon-invoice-discounting-a-premier-platform-for-investors-in-indiafalcon-invoice-discounting-a-premier-platform-for-investors-in-india
falcon-invoice-discounting-a-premier-platform-for-investors-in-india
Falcon Invoice Discounting
 
Project File Report BBA 6th semester.pdf
Project File Report BBA 6th semester.pdfProject File Report BBA 6th semester.pdf
Project File Report BBA 6th semester.pdf
RajPriye
 
What are the main advantages of using HR recruiter services.pdf
What are the main advantages of using HR recruiter services.pdfWhat are the main advantages of using HR recruiter services.pdf
What are the main advantages of using HR recruiter services.pdf
HumanResourceDimensi1
 
Enterprise Excellence is Inclusive Excellence.pdf
Enterprise Excellence is Inclusive Excellence.pdfEnterprise Excellence is Inclusive Excellence.pdf
Enterprise Excellence is Inclusive Excellence.pdf
KaiNexus
 
Exploring Patterns of Connection with Social Dreaming
Exploring Patterns of Connection with Social DreamingExploring Patterns of Connection with Social Dreaming
Exploring Patterns of Connection with Social Dreaming
Nicola Wreford-Howard
 
The effects of customers service quality and online reviews on customer loyal...
The effects of customers service quality and online reviews on customer loyal...The effects of customers service quality and online reviews on customer loyal...
The effects of customers service quality and online reviews on customer loyal...
balatucanapplelovely
 
Attending a job Interview for B1 and B2 Englsih learners
Attending a job Interview for B1 and B2 Englsih learnersAttending a job Interview for B1 and B2 Englsih learners
Attending a job Interview for B1 and B2 Englsih learners
Erika906060
 
LA HUG - Video Testimonials with Chynna Morgan - June 2024
LA HUG - Video Testimonials with Chynna Morgan - June 2024LA HUG - Video Testimonials with Chynna Morgan - June 2024
LA HUG - Video Testimonials with Chynna Morgan - June 2024
Lital Barkan
 
RMD24 | Debunking the non-endemic revenue myth Marvin Vacquier Droop | First ...
RMD24 | Debunking the non-endemic revenue myth Marvin Vacquier Droop | First ...RMD24 | Debunking the non-endemic revenue myth Marvin Vacquier Droop | First ...
RMD24 | Debunking the non-endemic revenue myth Marvin Vacquier Droop | First ...
BBPMedia1
 
Business Valuation Principles for Entrepreneurs
Business Valuation Principles for EntrepreneursBusiness Valuation Principles for Entrepreneurs
Business Valuation Principles for Entrepreneurs
Ben Wann
 
Maksym Vyshnivetskyi: PMO Quality Management (UA)
Maksym Vyshnivetskyi: PMO Quality Management (UA)Maksym Vyshnivetskyi: PMO Quality Management (UA)
Maksym Vyshnivetskyi: PMO Quality Management (UA)
Lviv Startup Club
 
Cree_Rey_BrandIdentityKit.PDF_PersonalBd
Cree_Rey_BrandIdentityKit.PDF_PersonalBdCree_Rey_BrandIdentityKit.PDF_PersonalBd
Cree_Rey_BrandIdentityKit.PDF_PersonalBd
creerey
 
Unveiling the Secrets How Does Generative AI Work.pdf
Unveiling the Secrets How Does Generative AI Work.pdfUnveiling the Secrets How Does Generative AI Work.pdf
Unveiling the Secrets How Does Generative AI Work.pdf
Sam H
 
Cracking the Workplace Discipline Code Main.pptx
Cracking the Workplace Discipline Code Main.pptxCracking the Workplace Discipline Code Main.pptx
Cracking the Workplace Discipline Code Main.pptx
Workforce Group
 
CADAVER AS OUR FIRST TEACHER anatomt in your.pptx
CADAVER AS OUR FIRST TEACHER anatomt in your.pptxCADAVER AS OUR FIRST TEACHER anatomt in your.pptx
CADAVER AS OUR FIRST TEACHER anatomt in your.pptx
fakeloginn69
 
RMD24 | Retail media: hoe zet je dit in als je geen AH of Unilever bent? Heid...
RMD24 | Retail media: hoe zet je dit in als je geen AH of Unilever bent? Heid...RMD24 | Retail media: hoe zet je dit in als je geen AH of Unilever bent? Heid...
RMD24 | Retail media: hoe zet je dit in als je geen AH of Unilever bent? Heid...
BBPMedia1
 
April 2024 Nostalgia Products Newsletter
April 2024 Nostalgia Products NewsletterApril 2024 Nostalgia Products Newsletter
April 2024 Nostalgia Products Newsletter
NathanBaughman3
 

Recently uploaded (20)

ikea_woodgreen_petscharity_dog-alogue_digital.pdf
ikea_woodgreen_petscharity_dog-alogue_digital.pdfikea_woodgreen_petscharity_dog-alogue_digital.pdf
ikea_woodgreen_petscharity_dog-alogue_digital.pdf
 
Tata Group Dials Taiwan for Its Chipmaking Ambition in Gujarat’s Dholera
Tata Group Dials Taiwan for Its Chipmaking Ambition in Gujarat’s DholeraTata Group Dials Taiwan for Its Chipmaking Ambition in Gujarat’s Dholera
Tata Group Dials Taiwan for Its Chipmaking Ambition in Gujarat’s Dholera
 
VAT Registration Outlined In UAE: Benefits and Requirements
VAT Registration Outlined In UAE: Benefits and RequirementsVAT Registration Outlined In UAE: Benefits and Requirements
VAT Registration Outlined In UAE: Benefits and Requirements
 
falcon-invoice-discounting-a-premier-platform-for-investors-in-india
falcon-invoice-discounting-a-premier-platform-for-investors-in-indiafalcon-invoice-discounting-a-premier-platform-for-investors-in-india
falcon-invoice-discounting-a-premier-platform-for-investors-in-india
 
Project File Report BBA 6th semester.pdf
Project File Report BBA 6th semester.pdfProject File Report BBA 6th semester.pdf
Project File Report BBA 6th semester.pdf
 
What are the main advantages of using HR recruiter services.pdf
What are the main advantages of using HR recruiter services.pdfWhat are the main advantages of using HR recruiter services.pdf
What are the main advantages of using HR recruiter services.pdf
 
Enterprise Excellence is Inclusive Excellence.pdf
Enterprise Excellence is Inclusive Excellence.pdfEnterprise Excellence is Inclusive Excellence.pdf
Enterprise Excellence is Inclusive Excellence.pdf
 
Exploring Patterns of Connection with Social Dreaming
Exploring Patterns of Connection with Social DreamingExploring Patterns of Connection with Social Dreaming
Exploring Patterns of Connection with Social Dreaming
 
The effects of customers service quality and online reviews on customer loyal...
The effects of customers service quality and online reviews on customer loyal...The effects of customers service quality and online reviews on customer loyal...
The effects of customers service quality and online reviews on customer loyal...
 
Attending a job Interview for B1 and B2 Englsih learners
Attending a job Interview for B1 and B2 Englsih learnersAttending a job Interview for B1 and B2 Englsih learners
Attending a job Interview for B1 and B2 Englsih learners
 
LA HUG - Video Testimonials with Chynna Morgan - June 2024
LA HUG - Video Testimonials with Chynna Morgan - June 2024LA HUG - Video Testimonials with Chynna Morgan - June 2024
LA HUG - Video Testimonials with Chynna Morgan - June 2024
 
RMD24 | Debunking the non-endemic revenue myth Marvin Vacquier Droop | First ...
RMD24 | Debunking the non-endemic revenue myth Marvin Vacquier Droop | First ...RMD24 | Debunking the non-endemic revenue myth Marvin Vacquier Droop | First ...
RMD24 | Debunking the non-endemic revenue myth Marvin Vacquier Droop | First ...
 
Business Valuation Principles for Entrepreneurs
Business Valuation Principles for EntrepreneursBusiness Valuation Principles for Entrepreneurs
Business Valuation Principles for Entrepreneurs
 
Maksym Vyshnivetskyi: PMO Quality Management (UA)
Maksym Vyshnivetskyi: PMO Quality Management (UA)Maksym Vyshnivetskyi: PMO Quality Management (UA)
Maksym Vyshnivetskyi: PMO Quality Management (UA)
 
Cree_Rey_BrandIdentityKit.PDF_PersonalBd
Cree_Rey_BrandIdentityKit.PDF_PersonalBdCree_Rey_BrandIdentityKit.PDF_PersonalBd
Cree_Rey_BrandIdentityKit.PDF_PersonalBd
 
Unveiling the Secrets How Does Generative AI Work.pdf
Unveiling the Secrets How Does Generative AI Work.pdfUnveiling the Secrets How Does Generative AI Work.pdf
Unveiling the Secrets How Does Generative AI Work.pdf
 
Cracking the Workplace Discipline Code Main.pptx
Cracking the Workplace Discipline Code Main.pptxCracking the Workplace Discipline Code Main.pptx
Cracking the Workplace Discipline Code Main.pptx
 
CADAVER AS OUR FIRST TEACHER anatomt in your.pptx
CADAVER AS OUR FIRST TEACHER anatomt in your.pptxCADAVER AS OUR FIRST TEACHER anatomt in your.pptx
CADAVER AS OUR FIRST TEACHER anatomt in your.pptx
 
RMD24 | Retail media: hoe zet je dit in als je geen AH of Unilever bent? Heid...
RMD24 | Retail media: hoe zet je dit in als je geen AH of Unilever bent? Heid...RMD24 | Retail media: hoe zet je dit in als je geen AH of Unilever bent? Heid...
RMD24 | Retail media: hoe zet je dit in als je geen AH of Unilever bent? Heid...
 
April 2024 Nostalgia Products Newsletter
April 2024 Nostalgia Products NewsletterApril 2024 Nostalgia Products Newsletter
April 2024 Nostalgia Products Newsletter
 

User Interface Design Best Practices

  • 1. User Interface Design: Best Practices
  • 2. Design Language Comics © 2007, Stacie Gomm, Utah State University
  • 3. Design Language Comics Design Language Comics © 2007, Stacie Gomm, Utah State University
  • 4. Imbedded User Languages Stacie Gomm Utah State University May 2007 © 2007, Stacie Gomm, Utah State University
  • 5. How do these relate? How do you know that? © 2007, Stacie Gomm, Utah State University
  • 6. The design of the key and keyhole concept is implicit and it is has a language which “speaks” to users and let’s users know what they are supposed to do. © 2007, Stacie Gomm, Utah State University
  • 7. Does this “speak” to you? © 2007, Stacie Gomm, Utah State University
  • 8. Imbedded User Languages This imbedded language is often overlooked or its existence is not realized as users develop products which are used in our everyday lives. © 2007, Stacie Gomm, Utah State University
  • 9. Imbedded User Languages The user language imbedded in every designed product communicates to the users the use for/of that product. © 2007, Stacie Gomm, Utah State University
  • 10. Design of Everyday Things by Donald Norman The human mind is exquisitely tailored to make sense of the world. Give it the slightest clue and off it goes, providing explanation, rationalization, understanding. Consider the objects – nooks, radios, kitchen, appliances, office machines, and light switches – that make up our everyday lives. Well- designed objects are easy to interpret and understand. They contain visible clues to their operation. Poorly designed objects can be difficult and frustrating to use. They provide no clues – or sometimes false clues. They trap the user and thwart the normal processing interpretation and understanding (Norman, p. 2, italics added). © 2007, Stacie Gomm, Utah State University
  • 11. Design of Everyday Things by Donald Norman Included in every design are the affordances, mappings, visibility, and feedback and each of these has it own implicit language which speaks to the user. © 2007, Stacie Gomm, Utah State University
  • 12. Design of Everyday Things by Donald Norman Affordances are the “perceived and actual properties of the thing, primarily those fundamental properties that determine just how the thing could possibly be used” (Norman, p. 9). Mapping is a technical term meaning the “relationship between two things, in this case between the controls and their movements and the results in the world. … Natural mapping … leads to immediate understanding” (Norman, p. 23). © 2007, Stacie Gomm, Utah State University
  • 13. Design of Everyday Things by Donald Norman In good design things are visible. “There are good mappings, natural relationships, between the controls and the things that are controlled” (Norman, p. 22). Feedback is the notion of sending back to the user information about what action has actually been done -- what result has been accomplished (Norman, p. 27). © 2007, Stacie Gomm, Utah State University
  • 14. Design of Everyday Things by Donald Norman Norman suggests that when developing a product ALL of the following should be included in its user language: •Visibility – By looking the user can tell the state of the device and the alternatives for action. •Affordances – The designer provides a good conceptual model for the user, with consistency in the presentation of operations and results and a coherent, consistent system image. •Good mappings – It is possible to determine the relationship between actions and results, between the controls and their effects, and between the system state and what is visible. •Feedback – The user receives full and continuous feedback about the results of actions. (Norman, p.53) © 2007, Stacie Gomm, Utah State University
  • 15. Netest A testing system developed at Utah State University that is used to administer the Computer and Information Literacy (CIL) tests. Lack of communication could interfere with the user being able to pass a test. © 2007, Stacie Gomm, Utah State University
  • 16. Netest – Trainee Interface Visibility This screen shows all of the options available to trainees. © 2007, Stacie Gomm, Utah State University
  • 17. Netest – Trainee Interface Affordances It is obvious which buttons perform which tasks. © 2007, Stacie Gomm, Utah State University
  • 18. Netest – Trainee Interface Mappings Mapping buttons to their action is done well in this program. © 2007, Stacie Gomm, Utah State University
  • 19. Netest – Trainee Interface Feedback The buttons actually do what is expected. © 2007, Stacie Gomm, Utah State University
  • 20. Netest – Testing Interface Norman contends that when simple things need pictures, labels, or instructions, the design has failed (p.9). © 2007, Stacie Gomm, Utah State University
  • 21. Implications for Portal Design When building a portal there exists a language that communicates to the user the actions which are expected by the user. When a designer designs the portal, there is a built in user language. The designer must realize this fact in order for his design to be able to communicate effectively with its users. This language is used by the user to communicate with the portal system. © 2007, Stacie Gomm, Utah State University
  • 22. Implications for Portal Show sample Portals Identify commonalities and what the user expects © 2007, Stacie Gomm, Utah State University
  • 23. Design of Everyday Things by Donald Norman When developing instructional products, according to Norman, this is what instructional designers should do: 1. Understand the causes of error and design and to minimize those causes. © 2007, Stacie Gomm, Utah State University
  • 24. Design of Everyday Things by Donald Norman 2. Make it possible to reverse actions – to “undo” them – or to make it harder to do what cannot be reversed. 3. Make it easier to discover the errors that do occur, and make them easier to correct. © 2007, Stacie Gomm, Utah State University
  • 25. Design of Everyday Things by Donald Norman 4. Change the attitude toward errors. Think of an object’s user as attempting to do a task, getting there by imperfect approximations. Don’t think of the user as making errors; think of the actions as approximations of what is desired. (p. 131) © 2007, Stacie Gomm, Utah State University
  • 26. Imbedded User Languages “Good” designers have a realization and understanding of the user language contained within their products and insure complete communication takes place between the product and user. © 2007, Stacie Gomm, Utah State University
  • 27. Imbedded User Languages Questions / Comments? Contact Info: Stacie.Gomm@usu.edu © 2007, Stacie Gomm, Utah State University