{"id":1359,"date":"2024-04-29T08:00:57","date_gmt":"2024-04-29T08:00:57","guid":{"rendered":"https:\/\/pageflows.com\/resources\/?p=1359"},"modified":"2024-10-26T00:15:15","modified_gmt":"2024-10-26T07:15:15","slug":"cognitive-walkthrough-a-simple-guide","status":"publish","type":"post","link":"https:\/\/pageflows.com\/resources\/cognitive-walkthrough-a-simple-guide\/","title":{"rendered":"Cognitive Walkthrough: A Simple Guide for UX Designers"},"content":{"rendered":"\n<p>A cognitive walkthrough is one of the many ways to <a href=\"https:\/\/pageflows.com\/resources\/user-experience-testing\/\">test your UX design<\/a>. In the world of <a href=\"https:\/\/pageflows.com\/resources\/experience-design-how-to-make-products-users-love\/\">user experience<\/a>, testing is vital. The more methods you use, the more accurate your results are likely to be.<\/p>\n\n\n\n<p>Cognitive walkthroughs, in particular, tell you if new users can easily carry out tasks. In this guide, we\u2019ll cover everything you need to know, including how to perform a walkthrough.<\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"427\" src=\"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/jason-goodman-Oalh2MojUuk-unsplash-2.jpg\" alt=\"A woman places sticky notes on a whiteboard. A group of other people sit around a table with open laptops.\n\" class=\"wp-image-1360\" srcset=\"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/jason-goodman-Oalh2MojUuk-unsplash-2.jpg 640w, https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/jason-goodman-Oalh2MojUuk-unsplash-2-300x200.jpg 300w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n<\/div>\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What Is a Cognitive Walkthrough?<\/strong><\/h2>\n\n\n\n<p>Firstly, what is a cognitive walkthrough? Essentially, this <a href=\"https:\/\/pageflows.com\/resources\/usability-testing-methods-an-introductory-guide\/\">usability testing<\/a> technique determines if new users can pick up tasks easily. Unlike other user tests, it does not involve \u2018users.\u2019 Instead, it\u2019s important that the participant has no prior experience.<\/p>\n\n\n\n<p>In a cognitive walkthrough, UX designers assign a specific task to a group of participants. This group consists of cross-functional reviewers who walk through each step of a <a href=\"https:\/\/pageflows.com\/resources\/task-flow-vs-user-flow-explained-for-ux-designers\/\">task flow<\/a>. At each stage, they answer a set of questions. The goal is to identify the parts of the user interface that might present challenges for new users.<\/p>\n\n\n\n<p>Typically, this takes place in a workshop setting. The UX researchers determine which tasks they will evaluate beforehand. Then, they gather participants. The team may include UX specialists, product owners, domain experts, and engineers.<\/p>\n\n\n\n<p>There are different types of participants:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>The facilitator: <\/strong>Performs the task and stops at each step to ask the questions.&nbsp;<\/li>\n\n\n\n<li><strong>The evaluators: <\/strong>These participants provide feedback on how a particular type of user would perceive the interface. They base this on <a href=\"https:\/\/pageflows.com\/resources\/what-is-a-user-persona\/\">user personas<\/a>, which researchers put together during earlier UX research.&nbsp;<\/li>\n\n\n\n<li><strong>The recorder:<\/strong> The recorder documents the answers to each question and the likelihood of success or failure of the task.&nbsp;<\/li>\n<\/ul>\n\n\n\n<p><\/p>\n\n\n\n<p>We\u2019ll cover the questions in more detail later. For now, when should you use this technique?<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>When Are Cognitive Walkthroughs Useful?<\/strong><\/h2>\n\n\n\n<p>Cognitive walkthroughs aren\u2019t necessary for every interface you design. Instead, they\u2019re useful for design teams creating complex or new workflows or functionalities. Innovation in the design world is exciting, but you need to check that novel designs actually work in practice. That\u2019s what these walkthroughs are for.<\/p>\n\n\n\n<p>So, if you\u2019re designing a website that the general public will use, you\u2019ll probably follow standard design conventions. As a result, you won\u2019t need to perform a cognitive walkthrough. The vast majority of users will have enough previous experience and knowledge to operate the site. If you\u2019ve designed it well, it should conform to their <a href=\"https:\/\/pageflows.com\/resources\/user-mental-model-explained-how-to-use-it-in-ux\/\">mental models<\/a>.<\/p>\n\n\n\n<p>However, if you\u2019re designing a complex system with <a href=\"https:\/\/pageflows.com\/resources\/what-is-interaction-design-discover-the-basics\/\">new interactions<\/a>, you might need a walkthrough. At this point, walkthroughs can alert you if there are any problems with the system. Or, at the very least, they can uncover room for improvement or opportunities to add tooltips.<\/p>\n\n\n\n<p>You should always use this technique in conjunction with other research methods. For example, you\u2019ll still need regular usability testing.<\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"427\" src=\"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/volodymyr-hryshchenko-ZT9gjcJog6U-unsplash.jpg\" alt=\"A hand pins a black piece of paper on a corkboard, surrounded by a variety of other pinned notes and objects.\n\" class=\"wp-image-1361\" srcset=\"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/volodymyr-hryshchenko-ZT9gjcJog6U-unsplash.jpg 640w, https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/volodymyr-hryshchenko-ZT9gjcJog6U-unsplash-300x200.jpg 300w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n<\/div>\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Cognitive Walkthrough vs. Heuristic Evaluation<\/strong><\/h2>\n\n\n\n<p>Sometimes, people confuse this method with heuristic evaluations. This also involves a group of people evaluating a user interface. However, the two methods are unique, so here\u2019s a breakdown of cognitive walkthrough vs heuristic evaluation.<\/p>\n\n\n\n<p>In a cognitive walkthrough, the new users stop at each interaction and answer a set of questions. Meanwhile, in heuristic evaluations, there are no set questions. Furthermore, analysts and UX specialists in heuristic evaluations may already be familiar with the product.<\/p>\n\n\n\n<p>Heuristic evaluations also seek to identify strengths and weaknesses. However, they evaluate the UI against set <a href=\"https:\/\/pageflows.com\/resources\/usability-heuristics-10-principles-to-guide-design\/\">usability guidelines<\/a> and <a href=\"https:\/\/pageflows.com\/resources\/ui-design-principles-optimizing-user-interface-design\/\">best practices<\/a>. As a result, they don\u2019t dive into user perspectives and opinions.<\/p>\n\n\n\n<p>Both tests are useful for evaluating usability. So, some design teams employ both techniques during the testing phase for one product. That way, you gain a holistic understanding of how the system works from different perspectives.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"424\" src=\"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/ux-indonesia-2NDWFiD0UMM-unsplash-2.jpg\" alt=\"A person gestures toward a turned-on laptop, facing another person. Beside them, on the table, there is an open notebook.\" class=\"wp-image-1362\" srcset=\"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/ux-indonesia-2NDWFiD0UMM-unsplash-2.jpg 640w, https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/ux-indonesia-2NDWFiD0UMM-unsplash-2-300x199.jpg 300w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n<\/div>\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>How To Conduct a Cognitive Walkthrough<\/strong><\/h2>\n\n\n\n<p>Now, it\u2019s time to learn how to conduct a cognitive walkthrough. First, you need to define the task(s) that the users need to carry out. It\u2019s important to choose the right tasks. Make sure you select task flows that are novel or complex, as per what we said above. For other task flows, you don\u2019t normally need to do cognitive walkthroughs.<\/p>\n\n\n\n<p>Then, divide the tasks into a workflow that the team goes through one at a time. You can write this out as a step-by-step list. Or, for more complex tasks, draw a diagram that makes it simple for the test participants.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Cognitive Walkthroughs: Four Questions<\/strong><\/h3>\n\n\n\n<p>Next, you need your questions. <a href=\"https:\/\/www.researchgate.net\/publication\/221514534_Cognitive_walkthrough_for_the_Web\" rel=\"nofollow noopener\" target=\"_blank\">Blackmon, Polson, et al.<\/a> provided four questions for a good cognitive walkthrough. Although the study is from 2002, these are the questions UX researchers use to this day.\u00a0<\/p>\n\n\n\n<p>The questions are:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Will the user instinctively try to reach the desired outcome?<\/li>\n\n\n\n<li>Is the correct action obvious to the user? Will they notice it?<\/li>\n\n\n\n<li>When the user takes the action, will they associate it with the outcome that actually occurs?<\/li>\n\n\n\n<li>If the user takes the correct action, can they see that progress is occurring toward the goal?<\/li>\n<\/ol>\n\n\n\n<p><\/p>\n\n\n\n<p>So, at each stage of the interaction, the facilitator asks these questions for the evaluators to answer. Let\u2019s cover the questions in more detail.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>1. Question One<\/strong><\/h3>\n\n\n\n<p><em>\u201cWill the user instinctively try to reach the desired outcome?\u201d<\/em><\/p>\n\n\n\n<p>The first task is to see if the interface makes any assumptions about the user\u2019s experience or prior knowledge. It also assesses their mental models, identifying if the action that occurs is what the user expected.<\/p>\n\n\n\n<p>If the user has another point of reference, they may feel confused. For example, let\u2019s say you design an email app. If you add a paper airplane icon, users might assume they click it to send. If, however, that icon schedules the email to send in a week\u2019s time, the user will become confused.<\/p>\n\n\n\n<p>In this case, users will likely abandon their task and not use your product again.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>2. Question Two<\/strong><\/h3>\n\n\n\n<p><em>\u201cIs the correct action obvious to the user? Will they notice it?\u201d<\/em><\/p>\n\n\n\n<p>A user interface is only useful if the user can navigate it. This is why simple interfaces are important\u2013with clutter, it\u2019s easier for the user to become confused. Furthermore, it\u2019s important not to hide or bury actions.&nbsp;<\/p>\n\n\n\n<p>While it\u2019s tempting to clean up your interface, don\u2019t do it at the risk of hiding an action. For example, if you have a clothes e-commerce site, don\u2019t hide the \u2018Women\u2019 and \u2018Men\u2019 sections within three menus. Instead, place them at the top of the navigation bar.<\/p>\n\n\n\n<p>Think about TV remotes. Learning how to use a new one can be confusing. There are so many buttons, and you don\u2019t know where they are.&nbsp;<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>3. Question Three<\/strong><\/h3>\n\n\n\n<p><em>\u201cWhen the user takes the action, will they associate it with the outcome that actually occurs?\u201d<\/em><\/p>\n\n\n\n<p>Ideally, the user should know what to expect when they take an action. For example, if they hover over an icon and it says, \u2018next\u2019, they expect to go to a new page. This doesn\u2019t just apply to clicking buttons, though. It also applies to keyboard shortcuts.<\/p>\n\n\n\n<p>So, in part, this question also refers to staying in line with the user\u2019s mental models. Ideally, the user shouldn\u2019t need to think too much. They should automatically know what will happen when they take a specific action.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>4. Question Four<\/strong><\/h3>\n\n\n\n<p><em>\u201cIf the user takes the correct action, can they see that progress is occurring toward the goal?\u201d<\/em><\/p>\n\n\n\n<p>Every good system needs feedback. Sometimes, there might be a lag between taking an action and the result occurring. During this time, the user needs to know that something is happening. This is a basic tenet of UX, though, so what\u2019s the point of this question?<\/p>\n\n\n\n<p>Well, the group members can debate how well the feedback works. The feedback needs to effectively tell the user what\u2019s happening, which means wording it well. Alternatively, you can use loading bars to show the progress.<\/p>\n\n\n\n<p>Then, what happens when the action is complete? How does the user know? Are there instructions about what to do next? The group can explore all of this during the fourth question.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>What To Do with Your Answers<\/strong><\/h3>\n\n\n\n<p>Then, the question remains of what to do next. Usually, the participants will have found some issues or areas for improvement during the walkthrough. They should record these throughout. At the end, the assessors can all discuss their findings, and the recorder can compile them into a comprehensive report. From there, the design team can prioritize issues to fix them.<\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"427\" src=\"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/john-schnobrich-FlPc9_VocJ4-unsplash-1.jpg\" alt=\"A person uses a laptop while another person points at the screen.\" class=\"wp-image-1363\" srcset=\"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/john-schnobrich-FlPc9_VocJ4-unsplash-1.jpg 640w, https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2024\/04\/john-schnobrich-FlPc9_VocJ4-unsplash-1-300x200.jpg 300w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n<\/div>\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Learn More About UX With Page Flows<\/strong><\/h2>\n\n\n\n<p>A cognitive walkthrough can be a valuable tool for <a href=\"https:\/\/pageflows.com\/resources\/what-is-ui-ux-design-the-guide-to-ui-vs-ux\/\">UX\/UI design<\/a> teams. When used correctly, it can tell you a lot about your system. It\u2019s a valuable part of the iterative process. By combining it with other techniques, you can ensure that you make your product as good as possible.<\/p>\n\n\n\n<p>But, before you test, you have to ideate and build your product. If you\u2019re looking for innovative, exciting design inspiration, look no further. Page Flows is a helpful resource for finding UX and UI design ideas. <a href=\"https:\/\/pageflows.com\/\" data-type=\"link\" data-id=\"https:\/\/pageflows.com\/\">Get started today<\/a> to access our growing library of user flow recordings and finally stay up-to-date with current design trends.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A cognitive walkthrough is one of the many ways to test your UX design. In the world of user experience, testing is vital. The more methods you use, the more accurate your results are likely &#8230; <a title=\"Cognitive Walkthrough: A Simple Guide for UX Designers\" class=\"read-more\" href=\"https:\/\/pageflows.com\/resources\/cognitive-walkthrough-a-simple-guide\/\" aria-label=\"Read more about Cognitive Walkthrough: A Simple Guide for UX Designers\">Read more<\/a><\/p>\n","protected":false},"author":7,"featured_media":1362,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"ppma_author":[10],"class_list":["post-1359","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized"],"authors":[{"term_id":10,"user_id":7,"is_guest":0,"slug":"page-flows-team","display_name":"Page Flows Team","avatar_url":{"url":"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2023\/12\/cropped-logo@2x.png","url2x":"https:\/\/pageflows.com\/resources\/wp-content\/uploads\/2023\/12\/cropped-logo@2x.png"},"author_category":"","first_name":"Page Flows","last_name":"Team","user_url":"","job_title":"","description":"The Page Flows Team is a collective of passionate UX design professionals dedicated to delivering insightful content on user experience and design principles. With diverse backgrounds and expertise, our contributing writers bring you the latest trends, tips, and research in the UX field. Each article is crafted with a focus on empathy, innovation, and a commitment to enhancing user interactions.\r\nOutside of writing, our team members draw inspiration from various pursuits such as outdoor activities, art, and continuous learning, fueling their creativity and drive to push the boundaries of UX design. The Page Flows Team is committed to providing valuable resources and engaging content to help you stay ahead in the ever-evolving world of user experience."}],"_links":{"self":[{"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/posts\/1359","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/comments?post=1359"}],"version-history":[{"count":3,"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/posts\/1359\/revisions"}],"predecessor-version":[{"id":2607,"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/posts\/1359\/revisions\/2607"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/media\/1362"}],"wp:attachment":[{"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/media?parent=1359"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/categories?post=1359"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/tags?post=1359"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/pageflows.com\/resources\/wp-json\/wp\/v2\/ppma_author?post=1359"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}