User Tools
design:search_filter
Differences
This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
| design:search_filter [2020/12/10 12:19] – 10.91.120.28 | design:search_filter [2021/06/25 10:09] (current) – external edit 127.0.0.1 | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| + | ====== Search & Filter ====== | ||
| + | |||
| + | Author: Michelle | ||
| + | |||
| + | ===== Searching ===== | ||
| + | |||
| + | ==== What Is Search? ==== | ||
| + | |||
| + | * When you search, you start from a blank screen (like Google) and enter a search term to return a list of results based on that search term. | ||
| + | * This is a more general way of finding data as the results returned will display all data that match your search query. | ||
| + | * If your design conflicts with a user's preconceived mental models for searching, they will have a hard time interacting with your system. | ||
| + | |||
| + | ==== What Are The Components Of A Search Feature? ==== | ||
| + | |||
| + | A Search Feature is made up of 3 components: | ||
| + | - An input box where words can be typed | ||
| + | - A search button that is selected to run the search | ||
| + | - A list of search results. | ||
| + | |||
| + | * Search should typically be found on the top right of the screen and should be in the form of a search box, not a link. | ||
| + | * The search box should be wide enough to accommodate a search term otherwise this affects usability. | ||
| + | |||
| + | ==== When Is Search Used? ==== | ||
| + | |||
| + | === To get users to what they' | ||
| + | |||
| + | * Search lets users bypass the intended navigation of a site. In most cases, a user simply wants to find the thing they are looking for. This is the paradox of the active user in action. | ||
| + | * The paradox of the active user is basically that the user never reads the manual, they would rather get started using something immediately. | ||
| + | * This is a paradox because the user would end up saving themselves lots of time in the long run if they spend some time at the start reading the manual or watching training videos. | ||
| + | * With this paradox in mind, it's important for designers to design for the way users actually behave; i.e. in an irrational way. | ||
| + | |||
| + | === To allow users to escape if they get lost === | ||
| + | |||
| + | * Search is also used as an escape option for a user if they get lost on your site. This is why it's important to have a search feature on every screen. | ||
| + | |||
| + | === Make Search Easy For The User === | ||
| + | |||
| + | * Typical users are not great at query reformulation. If they don't get the results they are looking for on the first try, chances are they will give up and go somewhere else. This is why it's important to increase the chances that a user will find what they' | ||
| + | * Users will almost never scan beyond the first page of web results. This is why prioritizing the search results is important to consider. Examine the most common queries in your logs to determine the best strategy for this. | ||
| + | * Offer advanced search only if the user needs it. " | ||
| + | |||
| + | |||
| + | ---- | ||
| + | |||
| + | |||
| + | ===== Filtering ===== | ||
| + | |||
| + | ==== What Is Filtering? ==== | ||
| + | |||
| + | * When you are filtering, you are refining/ | ||
| + | * This is a more accurate way of finding data as the filters are selected by the user from an existing list of filters which helps to refine the data especially if the user doesn' | ||
| + | * Filters eliminate results that do not specifically match the selected criteria. | ||
| + | |||
| + | ==== Using Different Types Of Filters ==== | ||
| + | |||
| + | This depends on user intent and page speed: | ||
| + | |||
| + | * By being able to determine the user's intent when looking for something, you can determine the most efficient type of filter to use (interactive or batch filtering). This creates a smooth experience and allows the user to find what they' | ||
| + | * Page speed is also a factor in determining which type of filter to use. | ||
| + | |||
| + | === Interactive Filtering === | ||
| + | |||
| + | * Interactive filtering occurs when you select one filter and the list of results immediately updates. This is good for users who are in an exploratory mindset and want to learn about the search space/data available to them. | ||
| + | * If used incorrectly i.e. if the user has a different mindset as in they know what they want to filter for or if the site is slow to retrieve the data, then this can become disruptive for the user as the results will refresh each time a filter is selected. | ||
| + | * A disadvantage of interactive filtering is that continuous page updates can become visually distracting. To overcome this, dim the results set and show a progress indicator before displaying the new results. | ||
| + | |||
| + | === Batch Filtering === | ||
| + | |||
| + | * Batch filtering occurs when you select a number of filters before the list of results updates. This is of benefit to users that have a clearly defined set of criteria. | ||
| + | * This is also good for slow sites where data retrieval may take some time. | ||
| + | * This is the best option to implement on mobile devices. | ||
| + | * Batch filtering is the safest option as it allows the users to tell you when they' | ||
| + | |||
| + | === Wait For System Response === | ||
| + | |||
| + | * Another way of implementing filters is by allowing the system to wait 1-2 seconds and if there has been no user input in that time, then refresh the results. | ||
| + | * With that in mind, the system should still indicate with a progress indicator that the first input has been received (immediate feedback to the user). | ||
| + | |||
| + | ---- | ||
| + | |||
| + | ===== Example That Describes The Difference Between Search & Filter ===== | ||
| + | |||
| + | * Imagine you are looking for a pair of Bose Noise Cancelling Headphones. | ||
| + | * You will probably go to Amazon and type in "Bose Noise Cancelling Headphones" | ||
| + | * The results returned will match Bose, Noise Cancelling, and Headphones. The first page or so will return the most accurate products. | ||
| + | * However as you progress through more pages, you'll find different brands of headphones other than Bose, or headphones that aren't noise cancelling. | ||
| + | * If you were to perform a filter based on the category headphones, the brand Bose, and select Noise-Cancelling as a feature, you'll find a more accurate set of results that match those filters. | ||
| + | |||
| + | ---- | ||
| + | |||
| + | ===== Useful Articles ===== | ||
| + | |||
| + | * https:// | ||
| + | * https:// | ||
| + | * https:// | ||
| + | * https:// | ||
| + | * https:// | ||