Tweet
Tweet

Slide 1

Slide 1 text

SER594 Human-Computer Interaction Lecture 05 User Experience Javier Gonzalez-Sanchez, PhD [email protected] javiergs.engineering.asu.edu Office Hours: By appointment

Slide 2

Slide 2 text

User Experience A user’s perceptions and response resulting from the use and/or anticipated use of a product, system or service experience interaction

Slide 3

Slide 3 text

User Experience consequence of 1. brand image, 2. presentation, 3. functionality, 4. system performance, 5. interactive behavior and 6. assistive capabilities 7. user’s prior experiences, 8. user’s attitudes, skills and personality, and 9. the context of use.

Slide 4

Slide 4 text

Presentation | GUI 1 4

Slide 5

Slide 5 text

Your Projects

Slide 6

Slide 6 text

Your Projects

Slide 7

Slide 7 text

Your Projects

Slide 8

Slide 8 text

Your Projects

Slide 9

Slide 9 text

Presentation | Colors 2 9

Slide 10

Slide 10 text

Case 1

Slide 11

Slide 11 text

Case 2

Slide 12

Slide 12 text

Case 3

Slide 13

Slide 13 text

Color Wheel

Slide 14

Slide 14 text

Color Wheel • Color Harmony –arrangement of colors in an attractive and effective way. • Pleased and calm vs chaos and disgust. • Users make their impression by the first look, and colors have the big influence. • 4 approaches: monochromatic, analogous, complementary, and triadic.

Slide 15

Slide 15 text

Monochromatic One color with various tones and shades of it. a winning choice since it’s hard to make a mistake https://www.sessions.edu/color-calculator/

Slide 16

Slide 16 text

Analogous Colors located right next to each other on the color wheel. When no contrast is needed https://www.sessions.edu/color-calculator/

Slide 17

Slide 17 text

Complementary Mix of colors placed in front of each other on the color wheel. Produce high contrast https://www.sessions.edu/color-calculator/

Slide 18

Slide 18 text

Triadic When the design requires more colors you can try triadic scheme –colors are equidistant on the color wheel https://www.sessions.edu/color-calculator/

Slide 19

Slide 19 text

Colors to Use

Slide 20

Slide 20 text

Colors to Use

Slide 21

Slide 21 text

Interactive Behavior 3 2 1

Slide 22

Slide 22 text

User Experience consequence of 1. brand image, 2. presentation, 3. functionality, 4. system performance, 5. interactive behavior and 6. assistive capabilities 7. user’s prior experiences, 8. user’s attitudes, skills and personality, and 9. the context of use.

Slide 23

Slide 23 text

Interactive Behavior • Humanizing a Computerized System, be careful with the micro- interactions • Add a little personality to the site or app. experience interaction What is the Problem? What I do next?

Slide 24

Slide 24 text

Interactive Behavior

Slide 25

Slide 25 text

Homework What about your servers and client User Interfaces? 1. Simple but complete 2. Consistent 3. Use colors strategically 4. Always Communicate what is happening 5. Default input make sense

Slide 26

Slide 26 text

Homework What about your servers and client Interaction Design? 1. Easy to Understand What it Do 2. Easy to Learn How to use 3. Handling Problems (Errors) 4. Solving or recovering from problems (Errors)

Slide 27

Slide 27 text

SER594 – Human Computer Interaction Javier Gonzalez-Sanchez [email protected] Spring 2019 Disclaimer. These slides can only be used as study material for the SER594 course at ASU. They cannot be distributed or used for another purpose.