<span class="span-reading-time rt-reading-time" style="display: block;"><span class="rt-label rt-prefix">Reading Time: </span> <span class="rt-time"> 5</span> <span class="rt-label rt-postfix">minutes</span></span>
<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="1024" height="576" src="https://octet-gatsby.in2.cdn-alpha.com/wp-content/uploads/2024/07/Image-1-1-1-1024x576.webp" alt="" class="wp-image-9224" srcset="https://octet-gatsby.in2.cdn-alpha.com/wp-content/uploads/2024/07/Image-1-1-1-1024x576.webp 1024w, https://octet-gatsby.in2.cdn-alpha.com/wp-content/uploads/2024/07/Image-1-1-1-300x169.webp 300w, https://octet-gatsby.in2.cdn-alpha.com/wp-content/uploads/2024/07/Image-1-1-1-768x432.webp 768w, https://octet-gatsby.in2.cdn-alpha.com/wp-content/uploads/2024/07/Image-1-1-1-1536x864.webp 1536w, https://octet-gatsby.in2.cdn-alpha.com/wp-content/uploads/2024/07/Image-1-1-1.webp 1920w" sizes="auto, (max-width: 1024px) 100vw, 1024px" /></figure>



<p>In the world of <a href="https://octet.design/ui-ux-designing/" target="_blank" rel="noreferrer noopener">UX design</a>, understanding how users perceive and organize information is crucial for creating effective interfaces. For instance, a <strong>card sorting example</strong> might involve asking users to categorize items from a website to see how they naturally group them. One of the most valuable techniques for gaining this insight is <a href="https://octet.design/journal/card-sorting/" target="_blank" rel="noreferrer noopener">card sorting</a>.&nbsp;</p>



<p>Card sorting is not a one-size-fits-all approach. Various methods explore different aspects of user organization, each providing unique insights. Whether you’re refining the navigation of an <a href="https://ecommerceguide.com/top/top-10-ecommerce-sites-in-india/" target="_blank" rel="noreferrer noopener nofollow">e-commerce site</a> or structuring content for an educational platform, card sorting offers valuable guidance.</p>



<p>In this blog of Octet<a href="https://octet.design/journal/" target="_blank" rel="noreferrer noopener"> Design Journal</a>, we’ll delve into some card sorting examples that can significantly enhance your <a href="https://octet.design/user-research/" target="_blank" rel="noreferrer noopener">UX research</a>. From open and closed card sorting to more advanced techniques like remote and comparative sorting, each example will illustrate how this technique can be applied to real-world scenarios. </p>



<p>Understand the mental models of users through card sorting </p>



<h2 class="wp-block-heading">1. Organizing an e-commerce website with open card sorting</h2>



<p>Imagine you are designing an <a href="https://octet.design/ecommerce-design-agency/" target="_blank" rel="noreferrer noopener">e-commerce website</a>. You provide participants with a set of product names, such as &#8220;Running Shoes,&#8221; &#8220;Formal Shirts,&#8221; &#8220;Laptops,&#8221; and &#8220;Coffee Makers.&#8221;&nbsp;</p>



<p>In an open card sorting activity, participants are asked to organize these items into groups that make sense to them and to create their own category names for these groups.</p>



<p>This method allows users to define categories in their own words, providing valuable insights into their <a href="https://jamesclear.com/mental-models" target="_blank" rel="noreferrer noopener nofollow">mental models</a> and vocabulary. </p>



<p>For instance, users might group &#8220;Running Shoes&#8221; and &#8220;Laptops&#8221; separately but may place &#8220;Formal Shirts&#8221; under a broader &#8220;Apparel&#8221; category.&nbsp;</p>



<p>This helps in creating a navigation structure that relates to your <a href="https://www.adobe.com/express/learn/blog/target-audience" target="_blank" rel="noreferrer noopener nofollow">target audience</a>, ensuring that the categories and labels are intuitive and user-friendly.</p>



<h2 class="wp-block-heading">2. Structuring a news website with closed card sorting</h2>



<p>For a news <a href="https://octet.design/website-design-agency/" target="_blank" rel="noreferrer noopener">website</a>, you might have predefined categories such as <a href="https://edition.cnn.com/world" target="_blank" rel="noreferrer noopener nofollow">World News</a>, Sports, Technology, and Entertainment. </p>



<p>Participants are given a set of <a href="https://www.nbcnews.com/" target="_blank" rel="noreferrer noopener nofollow">news headlines</a>, such as &#8220;<a href="https://www.businesspost.ie/global-economic-summit/" target="_blank" rel="noreferrer noopener nofollow">Global Economic Summit</a>,&#8221; &#8220;Champions League Final,&#8221; &#8220;Latest Smartphone Release,&#8221; and &#8220;Celebrity Awards Night,&#8221; and are asked to sort these headlines into predefined categories.</p>



<p>Closed card sorting helps validate an existing structure or compare different structures. It ensures that your categories align with users&#8217; expectations and improves the overall user experience.&nbsp;</p>



<p>For example, if most participants place &#8220;Global Economic Summit&#8221; under World News and &#8220;Latest Smartphone Release&#8221; under Technology, it confirms that your <a href="https://www.iucnredlist.org/resources/categories-and-criteria" target="_blank" rel="noreferrer noopener nofollow">categorization </a>matches user expectations.</p>



<h2 class="wp-block-heading">3. Designing a library database with hybrid card sorting</h2>



<p>If you are designing a library database, you can use a hybrid card sorting activity. Provide participants with some predefined categories like &#8220;Fiction&#8221; and &#8220;Non-Fiction&#8221; and a list of book titles.&nbsp;</p>



<p>Allow them to create additional categories if they feel it’s necessary. For instance, they might add categories like &#8220;Science Fiction,&#8221; &#8220;Biographies,&#8221; or &#8220;Historical Fiction.&#8221;</p>



<p>This approach combines the benefits of open and closed card sorting. It provides a structured framework while still capturing unique <a href="https://userpilot.com/blog/user-insights/" target="_blank" rel="noreferrer noopener nofollow">user insights</a> and preferences. </p>



<p>It allows you to see how users <a href="https://discourse.mcneel.com/t/how-to-group-items-by-index-categories/85590" target="_blank" rel="noreferrer noopener nofollow">group items</a> when given some direction but also lets them introduce their own categorizations, leading to a more comprehensive understanding of user needs.</p>



<h2 class="wp-block-heading">4. Refining a travel booking site with reverse card sorting</h2>



<p>For a travel booking website, you present participants with a <a href="https://developers.google.com/search/docs/crawling-indexing/sitemaps/build-sitemap" target="_blank" rel="noreferrer noopener nofollow">completed site map</a> and ask them to reassign pages to different categories based on what makes the most sense to them. </p>



<p>For example, you might have pages like &#8220;<a href="https://www.goibibo.com/flights/" target="_blank" rel="noreferrer noopener nofollow">Flight Booking</a>,&#8221; &#8220;Hotel Reservations,&#8221; &#8220;Travel Insurance,&#8221; and &#8220;Car Rentals&#8221; currently grouped under &#8220;Services.&#8221;</p>



<p>Reverse card sorting helps identify any mismatches between your current structure and user expectations.&nbsp;</p>



<p>Participants might reassign &#8220;Travel Insurance&#8221; to a new category called &#8220;Extras,&#8221; revealing potential improvements in your <a href="https://careerfoundry.com/en/blog/ux-design/a-beginners-guide-to-information-architecture/" target="_blank" rel="noreferrer noopener nofollow">information architecture</a> that might not be apparent through traditional card sorting. This method can help you fine-tune your navigation and make it more <a href="https://www.iberdrola.com/innovation/what-is-user-centric" target="_blank" rel="noreferrer noopener nofollow">user-centric</a>.</p>



<h2 class="wp-block-heading">5. Categorizing courses with multiple classification card sorting</h2>



<p>Consider an <a href="https://octet.design/edtech-design-agency/" target="_blank" rel="noreferrer noopener">educational website</a> where you ask participants to sort the same set of course titles into different categories based on various criteria.&nbsp;</p>



<p>For instance, you could ask them to sort courses like &#8220;Introduction to Psychology,&#8221; &#8220;<a href="https://www.quantstart.com/articles/How-to-Learn-Advanced-Mathematics-Without-Heading-to-University-Part-1/" target="_blank" rel="noreferrer noopener nofollow">Advanced Mathematics</a>,&#8221; &#8220;Modern History,&#8221; and &#8220;Creative Writing&#8221; by subject, difficulty level, or popularity.</p>



<p>This method highlights how users perceive relationships between items from multiple perspectives.&nbsp;</p>



<p>Users might categorize &#8220;Introduction to Psychology&#8221; and &#8220;Modern History&#8221; under &#8220;Humanities&#8221; by subject but place &#8220;Advanced Mathematics&#8221; under &#8220;Challenging&#8221; by difficulty.&nbsp;</p>



<p>It helps you understand the different ways users might navigate your site, leading to a more flexible and <a href="https://www.uxpin.com/studio/blog/user-friendly-what-does-it-mean-and-how-to-apply-it/" target="_blank" rel="noreferrer noopener nofollow">user-friendly design</a>.</p>



<h2 class="wp-block-heading">6. Conducting remote sorting for a corporate intranet</h2>



<p>If you are redesigning a large corporate intranet, you can conduct a remote card sorting activity using <a href="https://www.lambdatest.com/free-online-tools/sorting-list" target="_blank" rel="noreferrer noopener nofollow">online tools</a>. </p>



<p>Participants from different locations sort cards digitally, providing insights without <a href="https://www.upperinc.com/glossary/route-optimization/geographical-constraints" target="_blank" rel="noreferrer noopener nofollow">geographical constraints</a>. </p>



<p>For example, you might ask employees from various departments to <a href="https://www.docsumo.com/blogs/ocr/document-classification" target="_blank" rel="noreferrer noopener nofollow">categorize documents</a>, tools, and resources into sections like &#8220;HR,&#8221; &#8220;IT Support,&#8221; &#8220;Finance,&#8221; and &#8220;General Resources.&#8221;</p>



<p>Remote card sorting allows you to gather data from a <a href="https://www.canva.dev/blog/engineering/understanding-a-diverse-user-base-with-frequency-segmentation-at-scale/" target="_blank" rel="noreferrer noopener nofollow">diverse user base</a>. It’s especially useful when working with distributed teams or when targeting a <a href="https://www.forbes.com/councils/forbescommunicationscouncil/2024/04/16/expanding-to-a-global-audience-10-tips-for-getting-it-right/" target="_blank" rel="noreferrer noopener nofollow">global audience</a>. </p>



<p>By involving employees from different locations, you can ensure that the intranet structure meets the needs of all users, regardless of their physical location.</p>



<h2 class="wp-block-heading">7. Comparing navigation structures for a fitness app</h2>



<p>For a <a href="https://www.google.com/url?q=https://zapier.com/blog/best-fitness-tracking-apps" target="_blank" rel="noreferrer noopener nofollow">fitness app</a>, you could conduct a comparative card sorting activity by presenting two different navigation structures and asking participants to sort cards into the one they find more intuitive. </p>



<p>For example, one structure might group &#8220;Workout Plans,&#8221; &#8220;<a href="https://www.healthline.com/nutrition/how-to-eat-healthy-guide" target="_blank" rel="noreferrer noopener nofollow">Nutrition Guides</a>,&#8221; and &#8220;Progress Tracking&#8221; under &#8220;Features,&#8221; while another might use categories like &#8220;Exercise,&#8221; &#8220;Diet,&#8221; and &#8220;Progress.&#8221;</p>



<p>This approach helps you compare the effectiveness of different designs directly. It provides clear data on which structure better aligns with <a href="https://www.interaction-design.org/literature/article/how-to-manage-the-users-expectations-when-designing-smart-products" target="_blank" rel="noreferrer noopener nofollow">user expectations</a> and preferences. </p>



<p>If most users prefer the second structure, you gain valuable insights into organizing your <a href="https://octet.design/mobile-app-design-agency/" target="_blank" rel="noreferrer noopener">app </a>to make it more user-friendly.</p>



<h2 class="wp-block-heading">Conclusion</h2>



<p>Card sorting is an invaluable tool in the <a href="https://octet.design/hire-ui-ux-designers/" target="_blank" rel="noreferrer noopener">UX designer</a>’s toolkit. By leveraging these card sorting examples, you can gain deep insights into your users&#8217; mental models and improve the website&#8217;s <a href="https://octet.design/usability-testing/" target="_blank" rel="noreferrer noopener">usability</a>.&nbsp;</p>



<p>At <a href="https://octet.design/" target="_blank" rel="noreferrer noopener">Octet Design Studio</a>, we specialize in conducting comprehensive card-sorting activities tailored to your unique needs.&nbsp;</p>



<p>Our <a href="https://www.cocoon-inc.com/blog/the-difference-between-an-expert-team-and-a-team-of-experts" target="_blank" rel="noreferrer noopener nofollow">expert team</a> can help you uncover critical insights and implement them to <a href="https://www.fastly.com/blog/8-ways-to-improve-user-experience-for-web-applications" target="_blank" rel="noreferrer noopener nofollow">enhance your user experience</a>.</p>



<h2 class="wp-block-heading">Frequently asked questions</h2>



<h3 class="wp-block-heading">How to do card sorting?</h3>



<p>To perform card sorting , start by defining your objectives, such as understanding how users organize content or testing <a href="https://octet.design/journal/mobile-navigation-design-examples-and-complete-guide/" target="_blank" rel="noreferrer noopener">navigation structures</a>. Prepare cards with distinct items or concepts. Based on your goals, choose the type of card sorting. Recruit a representative group of participants, then conduct the physical or <a href="https://freetech4teach.classwork.com/2020/01/how-to-create-online-sorting-activity/" target="_blank" rel="noreferrer noopener nofollow">digital sorting activity</a>. Analyze the results to identify patterns and use these insights to refine your design.</p>



<h3 class="wp-block-heading">What are the two types of card sorting?</h3>



<p>The two main types of card sorting are open and closed. Open card sorting involves participants creating their groups and names for cards, revealing their <a href="https://octet.design/journal/mental-model/" target="_blank" rel="noreferrer noopener">mental models</a>. Closed card sorting has predefined categories, with participants sorting cards into these existing groups to validate or refine an existing structure.</p>



<h3 class="wp-block-heading">Why use card sorting?</h3>



<p>Card sorting in UX helps understand how users naturally categorize and label information, leading to more <a href="https://www.nutcache.com/blog/intuitive-navigation-structure/" target="_blank" rel="noreferrer noopener nofollow">intuitive navigation</a> and organization. It validates or refines existing structures, ensuring they align with user expectations and improving the <a href="https://www.nngroup.com/articles/definition-user-experience/" target="_blank" rel="noreferrer noopener nofollow">overall user experience</a>.</p>



<h3 class="wp-block-heading">What is the sample size for card sorting?</h3>



<p>The typical <a href="https://www.usertesting.com/blog/ux-research-sample-size" target="_blank" rel="noreferrer noopener nofollow">sample size</a> for card sorting in UX is between 15 to 20 participants. This range provides enough data to identify <a href="https://octet.design/journal/top-10-ui-ux-design-trends-to-watch-for-in-2024/" target="_blank" rel="noreferrer noopener">trends</a> and patterns while being manageable regarding time and resources. For larger projects, you may include more participants to gain deeper insights.</p>



<p></p>
<footer class="author-bio-section" ><div class="author-flex"><div class="author-image"><img loading="lazy" decoding="async" width="90" height="90" src="https://octet-gatsby.in2.cdn-alpha.com/wp-content/uploads/2023/08/priyanka-150x150.webp" class="attachment-90x90 size-90x90" alt="" /></div><div class="author-info"><div class="author-name"><strong>Priyanka Gathraj</strong></div><p class="author-bio">As the Senior HR Manager at Octet Design Studio, Priyanka Gathraj specializes in the UI UX design industry. With extensive experience in human resources and talent management, she brings a comprehensive understanding of end-to-end HR processes, including hiring, onboarding, performance evaluations, and exit procedures. 

&lt;br /&gt;&lt;br /&gt;

She is skilled at fostering a positive work environment through effective employee engagement initiatives and conflict resolution strategies. Her passion lies in establishing clear communication channels and continuously seeking feedback to drive improvement. She is committed to nurturing a culture of growth, innovation, and excellence within the organization.
</p></div> </div><div class="authorbox-social-icons"> <a href="mailto:priyanka@octet.design" target="_blank" rel="nofollow" title="E-mail" class="tooltip"><i class="fa fa-envelope-square fa-2x"></i> </a></div></footer>

Card sorting examples to help you with UX research  

Learn the mistakes to avoid when you hire mobile app designers and tips to ensure smooth collaboration and create a user friendly mobile app.

Mistakes to Avoid When You Hire Mobile App Designers

Top Mistakes to Avoid When You Hire Mobile App Designers

Education platforms succeed when they remember people come before technology.

Major UX Strategies that Enhance Education Platforms

Learn the top reasons to hire SaaS designers and how SaaS UI UX design drives product success and user retention.

Top Reasons to Hire SaaS Designers for Your Product Success

Discover why you should hire mobile app designers in early stages to save costs and create a seamless user experience from day one.

Why You Should Hire Mobile App Designers In Early Stages?

Decide between in-house or agency UI UX designers and hire the right team for faster, better product design.

In-House vs. Agency: The Smarter Way to Hire UI UX Designers

Color psychology in branding is more than just a design choice, it’s a strategic tool.

Card sorting examples to help you with UX research

Tags:

Priyanka Gathraj

Inspire the next generation of designers

Read Next