Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Designing Interactions

Well done!

You have completed Designing Interactions!

Sign up for Treehouse Back to Library

Cognitive Psychology: Mental Models

4:47 with Hope Armstrong

Now it's time for a bit of cognitive psychology. We'll look at how the human brain processes information and how users approach the user interface with set expectations.

New Terms:

  • Cognitive psychology: the scientific study of mental processes
  • Mental model: an explanation of someone's thought process about how something works in the real world.

Processes:

  • attention
  • language use
  • memory
  • perception
  • problem-solving
  • creativity
  • thinking

Alan Dix's four golden rules of navigation:

  • Knowing where you are
  • Knowing what you can do
  • Knowing where you are going - or what will happen
  • Knowing where you've been - or what you've done

Further Reading:

Resources:

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    In the next few videos, we'll explore topics that overlap with psychology. 0:00
    Let's start with a quick psychology lesson. 0:05
    Cognitive psychology is the scientific study of mental processes. 0:08
    The American Psychological Association breaks it down into these processes. 0:14
    Attention, [SOUND] language use, [SOUND] memory, 0:20
    [SOUND] perception, [SOUND] problem solving, 0:25
    [SOUND] creativity, [SOUND] and thinking. 0:30
    This is a broad field. 0:34
    So I'll just touch on the areas that are most relevant to UX design. 0:36
    In this video, we'll take a look at mental models. 0:41
    So we know that products are designed with interactions, 0:45
    but how do they relate to one another? 0:49
    As you know, patterns and relationships are important in design. 0:52
    People will come to your product with their own past experiences and 0:57
    expectations of how your product will work, 1:01
    even if they have no prior experience with the product. 1:05
    And of course, 1:08
    current users will have memories of prior interactions with your product. 1:09
    These are called mental models. 1:14
    A mental model is an explanation of someone's thought process about how 1:17
    something works in the real world. 1:22
    Think of your favorite app. 1:25
    Do you notice any patterns in the way that the interactions are designed 1:27
    even across several screens? 1:32
    For example, in a note taking app, 1:34
    you may notice a consistency in the editing interactions across the app. 1:37
    To edit a field, you can edit the text directly and it auto saves. 1:42
    This works in the same manner no matter if you're editing a note or 1:47
    changing a profile settings. 1:52
    The consistency of this interaction across the app forms a mental model in 1:54
    your brain and allows you to have a predictable seamless experience. 1:59
    An example of a broken mental model would be if the profile settings 2:03
    page had a different editing interaction than the note taking screen. 2:08
    Perhaps you'd have to click Edit to enter to edit mode and then click Save. 2:12
    That'd be confusing if you're expecting the other more direct auto save option. 2:18
    It'd be much harder to learn how to use an app with inconsistent mental models. 2:24
    And even worse, inconsistencies make users question the underlying 2:29
    logic of the product and the integrity of the brand. 2:34
    That's why apps tend to share similar mental models. 2:37
    Products are designed to match people's mental models of what they expect to find 2:42
    on your website and how they expect to interact with it. 2:47
    For example, people expect to find the navigation bar at the top or 2:50
    bottom of a screen, and icons for common screens such as a user profile or 2:55
    settings usually looks similar to make them easy to identify and 3:01
    reduce cognitive load. 3:06
    For more information about interface and 3:08
    behavioral design patterns, check out the teacher's notes. 3:10
    Let's delve into a mental model. 3:14
    Alan Dix is an expert in human computer interaction, and 3:17
    he defined the four golden rules of navigation. 3:22
    Number one is knowing where you are. 3:26
    This can be in the form of breadcrumbs, which are links that show the current 3:29
    page in relation to where it fits with the other site content. 3:34
    Number two is knowing what you can do. 3:38
    This can be a back button that allows users to return to the previous page. 3:41
    [SOUND] Number three is knowing where you are going or what will happen. 3:46
    For example, if the user is filling out a form that spans multiple pages, 3:52
    there should be an indication to show how many pages remain. 3:57
    [SOUND] Number four is knowing where you've been- or what you've done. 4:01
    Continuing on with that last example, 4:06
    the form should indicate the previous data has been saved. 4:09
    A simple feedback message to show the data has been saved will ease 4:13
    any tension about losing data if they stopped midway. 4:18
    Since those are the best practices, chances are that most users have been 4:22
    exposed to navigation that operates in those ways. 4:27
    Therefore they carry that set of expectations when they visit a new 4:31
    website. 4:35
    That wraps up mental models. 4:36
    The next time you use an app, think about its mental models. 4:39
    I'll see you in the next video where I'll explain affordances. 4:43

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up