<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
		>
<channel>
	<title>Comments on: 3 Quick Design Patterns for Better Faceted Search</title>
	<atom:link href="http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html/feed" rel="self" type="application/rss+xml" />
	<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html</link>
	<description>Search User Experience</description>
	<lastBuildDate>Thu, 11 Apr 2013 08:17:18 +0000</lastBuildDate>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.4.2</generator>
	<item>
		<title>By: Advanced search in your webshop is important &#124; Servage Magazine</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-250654</link>
		<dc:creator>Advanced search in your webshop is important &#124; Servage Magazine</dc:creator>
		<pubDate>Thu, 11 Apr 2013 08:17:18 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-250654</guid>
		<description>[...] 3 Quick Design Patterns for Better Faceted Search [...]</description>
		<content:encoded><![CDATA[<p>[...] 3 Quick Design Patterns for Better Faceted Search [...]</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Advanced search on your webshop is important &#124; Servage Magazine</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-250653</link>
		<dc:creator>Advanced search on your webshop is important &#124; Servage Magazine</dc:creator>
		<pubDate>Thu, 11 Apr 2013 08:14:57 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-250653</guid>
		<description>[...] 3 Quick Design Patterns for Better Faceted Search [...]</description>
		<content:encoded><![CDATA[<p>[...] 3 Quick Design Patterns for Better Faceted Search [...]</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Principles Of Effective Search In E-Commerce Design - Goodfav Howto</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-250652</link>
		<dc:creator>Principles Of Effective Search In E-Commerce Design - Goodfav Howto</dc:creator>
		<pubDate>Tue, 05 Mar 2013 09:20:33 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-250652</guid>
		<description>[...] 3 Quick Design Patterns for Better Faceted Search [...]</description>
		<content:encoded><![CDATA[<p>[...] 3 Quick Design Patterns for Better Faceted Search [...]</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: beccaccia</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-88297</link>
		<dc:creator>beccaccia</dc:creator>
		<pubDate>Thu, 08 Dec 2011 02:50:57 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-88297</guid>
		<description>Nice article.  However, I disagree with pattern 3 (links), because I think checkboxes work better.

In theory, I agree with your argument - that checkboxes give a better indication of an OR condition, and links give a better indication of an AND condition.  However in practice, I think it&#039;s generally pretty obvious from context:  it&#039;s illogical to select cars that are both a Ford *AND* a Toyota.  That&#039;s not possible!  And so users don&#039;t need to give this a second thought.   Similarly, no user would imagine that you would select cars that have a sunroof *OR* cruise control.  It&#039;s possible, but it would be pretty strange!  I think most users would assume the *AND* condition here.

Therefore, I would tend to go with checkboxes, because they are much easier to undo (which you point out is the major drawback of links).

I think the checkbox / link distinction would be more important if the AND / OR distinction was not in fact clear from context.

An example of a site which uses exclusively checkboxes, (where the distinction is clear from context, in my experience as a user), is http://pisos.com</description>
		<content:encoded><![CDATA[<p>Nice article.  However, I disagree with pattern 3 (links), because I think checkboxes work better.</p>
<p>In theory, I agree with your argument &#8211; that checkboxes give a better indication of an OR condition, and links give a better indication of an AND condition.  However in practice, I think it&#8217;s generally pretty obvious from context:  it&#8217;s illogical to select cars that are both a Ford *AND* a Toyota.  That&#8217;s not possible!  And so users don&#8217;t need to give this a second thought.   Similarly, no user would imagine that you would select cars that have a sunroof *OR* cruise control.  It&#8217;s possible, but it would be pretty strange!  I think most users would assume the *AND* condition here.</p>
<p>Therefore, I would tend to go with checkboxes, because they are much easier to undo (which you point out is the major drawback of links).</p>
<p>I think the checkbox / link distinction would be more important if the AND / OR distinction was not in fact clear from context.</p>
<p>An example of a site which uses exclusively checkboxes, (where the distinction is clear from context, in my experience as a user), is <a href="http://pisos.com" rel="nofollow">http://pisos.com</a></p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Vegard Sandvold</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-45188</link>
		<dc:creator>Vegard Sandvold</dc:creator>
		<pubDate>Fri, 03 Jun 2011 07:41:17 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-45188</guid>
		<description>Thanks, Chris. I&#039;ll try to get it right next time :-)</description>
		<content:encoded><![CDATA[<p>Thanks, Chris. I&#8217;ll try to get it right next time <img src='http://www.thingsontop.com/wordpress/wp-includes/images/smilies/icon_smile.gif' alt=':-)' class='wp-smiley' /> </p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Chris</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-44768</link>
		<dc:creator>Chris</dc:creator>
		<pubDate>Tue, 31 May 2011 12:00:43 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-44768</guid>
		<description>Cruise Control is spelled with an s, not CruiCe Control</description>
		<content:encoded><![CDATA[<p>Cruise Control is spelled with an s, not CruiCe Control</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Vegard Sandvold</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-7926</link>
		<dc:creator>Vegard Sandvold</dc:creator>
		<pubDate>Sun, 17 Jan 2010 12:40:03 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-7926</guid>
		<description>@Lars Grammel

(1) Good point about using font size to visualize the hit counts. I&#039;m familiar with tag clouds, but I didn&#039;t think about applying that to facets. Haven&#039;t seen many examples of it either.

Before going down that path I would make sure that number of occurences is indeed a good indicator of relevance. Have a look at this post about the effect recall may have on faceted search, and share your thoughts with us:

http://www.thingsontop.com/mindless-recall-kills-faceted-search-876.html

(2) Visualizing numerical range facets as histograms is a good idea. Check out http://www.globrix.com for a good example. A timeline is the classical example.

Summarization, which is a strengt of visualization, may also be a drawback. When information is summarized in a timeline or POI (point of interest) on a map, the details are automatically hidden. The user then needs to perform an extra action to access the information, via a hover (mouse-over) action or a click. Whenever possible I try not to hide anything important from the user.

Thanks for sharing!</description>
		<content:encoded><![CDATA[<p>@Lars Grammel</p>
<p>(1) Good point about using font size to visualize the hit counts. I&#8217;m familiar with tag clouds, but I didn&#8217;t think about applying that to facets. Haven&#8217;t seen many examples of it either.</p>
<p>Before going down that path I would make sure that number of occurences is indeed a good indicator of relevance. Have a look at this post about the effect recall may have on faceted search, and share your thoughts with us:</p>
<p><a href="http://www.thingsontop.com/mindless-recall-kills-faceted-search-876.html" rel="nofollow">http://www.thingsontop.com/mindless-recall-kills-faceted-search-876.html</a></p>
<p>(2) Visualizing numerical range facets as histograms is a good idea. Check out <a href="http://www.globrix.com" rel="nofollow">http://www.globrix.com</a> for a good example. A timeline is the classical example.</p>
<p>Summarization, which is a strengt of visualization, may also be a drawback. When information is summarized in a timeline or POI (point of interest) on a map, the details are automatically hidden. The user then needs to perform an extra action to access the information, via a hover (mouse-over) action or a click. Whenever possible I try not to hide anything important from the user.</p>
<p>Thanks for sharing!</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Lars Grammel</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-7906</link>
		<dc:creator>Lars Grammel</dc:creator>
		<pubDate>Sat, 16 Jan 2010 21:34:47 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-7906</guid>
		<description>Thanks for this post - it helped me better understand design decisions and possibilities when it comes to facets. Two further facet improvements came to my mind when reading it:

(1) Scaling the font size of this different elements to visualize the number of occurrences, e.g. Ford would have the biggest font size in your example for pattern 1. This is similar to the idea behind tag clouds and has been applied in some research projects, e.g. Jadeit ( http://edelstein.pebbles.cs.cmu.edu/jadeite/index.php?api=java6 )

(2) The filter element for a facet can be a visualization, e.g. a scented widget ( http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.85.401&amp;rep=rep1&amp;type=pdf ). This is might be appropriate if the data of the facet numerical, e.g. car mileage, or a date. VisGets is a nice example for faceted search with visualizations ( pages.cpsc.ucalgary.ca/~carey/papers/2008/VisGets2008.pdf ).</description>
		<content:encoded><![CDATA[<p>Thanks for this post &#8211; it helped me better understand design decisions and possibilities when it comes to facets. Two further facet improvements came to my mind when reading it:</p>
<p>(1) Scaling the font size of this different elements to visualize the number of occurrences, e.g. Ford would have the biggest font size in your example for pattern 1. This is similar to the idea behind tag clouds and has been applied in some research projects, e.g. Jadeit ( <a href="http://edelstein.pebbles.cs.cmu.edu/jadeite/index.php?api=java6" rel="nofollow">http://edelstein.pebbles.cs.cmu.edu/jadeite/index.php?api=java6</a> )</p>
<p>(2) The filter element for a facet can be a visualization, e.g. a scented widget ( <a href="http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.85.401&#038;rep=rep1&#038;type=pdf" rel="nofollow">http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.85.401&#038;rep=rep1&#038;type=pdf</a> ). This is might be appropriate if the data of the facet numerical, e.g. car mileage, or a date. VisGets is a nice example for faceted search with visualizations ( pages.cpsc.ucalgary.ca/~carey/papers/2008/VisGets2008.pdf ).</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Lee Peterson</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-7732</link>
		<dc:creator>Lee Peterson</dc:creator>
		<pubDate>Fri, 08 Jan 2010 18:51:25 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-7732</guid>
		<description>Awesome. But...

Comic Sans!!!??

I digress.</description>
		<content:encoded><![CDATA[<p>Awesome. But&#8230;</p>
<p>Comic Sans!!!??</p>
<p>I digress.</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Principles Of Effective E-Commerce Search - Smashing Magazine</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-6801</link>
		<dc:creator>Principles Of Effective E-Commerce Search - Smashing Magazine</dc:creator>
		<pubDate>Tue, 08 Dec 2009 13:34:41 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-6801</guid>
		<description>[...]  [...]</description>
		<content:encoded><![CDATA[<p>[...]  [...]</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Vegard Sandvold</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-4711</link>
		<dc:creator>Vegard Sandvold</dc:creator>
		<pubDate>Sun, 18 Oct 2009 12:24:15 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-4711</guid>
		<description>Hi Tony!

Thanks for taking time to comment. It&#039;s good of you to speak up when I write things that are unclear or misleading. As a consequence I learn something new from all our discussions :-)

First I would like to answer your questions about links, check boxes and radio buttons for refinement and multi-selection:

You&#039;re right to point out that links don&#039;t prohibit cross-comparison between items from different categories. You give a good example of that yourself. I was making a point about check boxes having higher affordance for multi-selection, focusing on mutually exclusive categories combined with logical OR. The Subject facet in you example is a multi-select AND, which lends itself naturally to links.

I assume that links have a higher affordance for refining away options, by way of creating an expectation that clicks make something happen right away. Check boxes and radio buttons, on the other hand, create an expectation of persisting options. I&#039;m not familiar with Endeca technology, but when working with FAST ESP it&#039;s necessary to perform extra utility searches for facets when options need to persist despite of refinements. I assume this is required for both multi-select OR (check boxes) and single-select XOR (radio buttons).

I hope I have managed to answer you questions. In short, I find links to be good for repeated (multi-)selection AND, while check boxes work better for multi-select OR. Radio buttons may work for special cases of single-select XOR.

Then for your other questions:

Filling a screen with 50+ check boxes is not necessarilly in the best interest of the user. And I feel that multi-select OR with so many options is really a special kind of use case that you won&#039;t find in most e-commerce applications. If it&#039;s really necessary for &quot;experts&quot; to perform this kind of task, perhaps a dialog with a two-panel selector could work better, also combined with some kind of live search filtering?

http://www.welie.com/patterns/showPattern.php?patternID=parts-selector
http://ui-patterns.com/pattern/LiveFilter

&quot;Select All&quot; is better than &quot;Show All&quot; - thanks for point that out. The intended meaning was lost in translation from Norwegian :-)</description>
		<content:encoded><![CDATA[<p>Hi Tony!</p>
<p>Thanks for taking time to comment. It&#8217;s good of you to speak up when I write things that are unclear or misleading. As a consequence I learn something new from all our discussions <img src='http://www.thingsontop.com/wordpress/wp-includes/images/smilies/icon_smile.gif' alt=':-)' class='wp-smiley' /> </p>
<p>First I would like to answer your questions about links, check boxes and radio buttons for refinement and multi-selection:</p>
<p>You&#8217;re right to point out that links don&#8217;t prohibit cross-comparison between items from different categories. You give a good example of that yourself. I was making a point about check boxes having higher affordance for multi-selection, focusing on mutually exclusive categories combined with logical OR. The Subject facet in you example is a multi-select AND, which lends itself naturally to links.</p>
<p>I assume that links have a higher affordance for refining away options, by way of creating an expectation that clicks make something happen right away. Check boxes and radio buttons, on the other hand, create an expectation of persisting options. I&#8217;m not familiar with Endeca technology, but when working with FAST ESP it&#8217;s necessary to perform extra utility searches for facets when options need to persist despite of refinements. I assume this is required for both multi-select OR (check boxes) and single-select XOR (radio buttons).</p>
<p>I hope I have managed to answer you questions. In short, I find links to be good for repeated (multi-)selection AND, while check boxes work better for multi-select OR. Radio buttons may work for special cases of single-select XOR.</p>
<p>Then for your other questions:</p>
<p>Filling a screen with 50+ check boxes is not necessarilly in the best interest of the user. And I feel that multi-select OR with so many options is really a special kind of use case that you won&#8217;t find in most e-commerce applications. If it&#8217;s really necessary for &#8220;experts&#8221; to perform this kind of task, perhaps a dialog with a two-panel selector could work better, also combined with some kind of live search filtering?</p>
<p><a href="http://www.welie.com/patterns/showPattern.php?patternID=parts-selector" rel="nofollow">http://www.welie.com/patterns/showPattern.php?patternID=parts-selector</a><br />
<a href="http://ui-patterns.com/pattern/LiveFilter" rel="nofollow">http://ui-patterns.com/pattern/LiveFilter</a></p>
<p>&#8220;Select All&#8221; is better than &#8220;Show All&#8221; &#8211; thanks for point that out. The intended meaning was lost in translation from Norwegian <img src='http://www.thingsontop.com/wordpress/wp-includes/images/smilies/icon_smile.gif' alt=':-)' class='wp-smiley' /> </p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Tony Russell-Rose</title>
		<link>http://www.thingsontop.com/3-quick-patterns-better-facet-design-889.html#comment-4632</link>
		<dc:creator>Tony Russell-Rose</dc:creator>
		<pubDate>Fri, 16 Oct 2009 08:54:47 +0000</pubDate>
		<guid isPermaLink="false">http://www.thingsontop.com/?p=889#comment-4632</guid>
		<description>Hi Vegard,

Great stuff. Really thought provoking, as usual! Can I explore a couple the details:

&quot;Tabs or links, on the other hand, will not let you cross-compare&quot;. Is this strictly true? I may be mis-interpreting what you mean by &#039;cross-compare&#039;, but in principle I don&#039;t think using links per se precludes this. If I understand you correctly, what matters is whether you &#039;refine away&#039; the dimension once a selection has been made. Obviously for multi-select dimensions you don&#039;t want to do this, but that doesn&#039;t mean you *can&#039;t* use links. For example, check out the multi-select subject dimension here, which uses links:

http://www2.lib.ncsu.edu/catalog/?view=full&amp;Ntt=natural+language+processing&amp;Ntk=Keyword&amp;N=4294941540+4294965454

&quot;Don’t use check boxes for facet that are very large (50+) or hierarchical. Multi-selection with check boxes doesn’t scale with size.&quot; What would be your preferred alternatives? (e.g. a vertical scroll bar, a pop up expandable panel, etc?)

&quot;I include an extra set of radio buttons (Show All/Choose Makes)&quot; I don&#039;t quite understand the use case for having a &quot;show all&quot; - isn&#039;t that what &quot;more choices&quot; does? Or did you mean &quot;Select all&quot;?

Re Single-select with radio buttons: &quot;Undo is really easy, since all options are visible all the time.&quot; This implies that the dimension stays visible after selection, which for single select, would not normally be the default behaviour (they would typically be refined away, and the breadbox would then be used to maintain navigational state). In your experience, do you assume the converse (i.e. dimensions aren&#039;t refined away by default)?

Repeated selection with link lists - I agree with your general guidance here, but the example you&#039;ve chosen strikes me as a bit of an edge case - multi-select AND is quite rare (e.g. compared to multi-select OR) and possibly the most difficult combination to get right (IMHO).  Because it is multi-select, I&#039;d normally expect a check box to give the right affordance, but because it is AND, we have to be careful of the combinatorics (as soon as you select one feature, it affects the number of hit counts on the other features, so you *have* to update the values immediately or risk getting zero results... in which case, links perhaps give a better affordance of the &quot;click this and something will happen straight away&quot; interaction.

But that&#039;s why I feel multi-select AND isn&#039;t the best example here - unless the point you are specifically about the &quot;Repeated selection&quot; (i.e. the multi-select AND) part rather than the &quot;with link lists&quot; part (which is a much more generic design element).

Cheers,
Tony</description>
		<content:encoded><![CDATA[<p>Hi Vegard,</p>
<p>Great stuff. Really thought provoking, as usual! Can I explore a couple the details:</p>
<p>&#8220;Tabs or links, on the other hand, will not let you cross-compare&#8221;. Is this strictly true? I may be mis-interpreting what you mean by &#8216;cross-compare&#8217;, but in principle I don&#8217;t think using links per se precludes this. If I understand you correctly, what matters is whether you &#8216;refine away&#8217; the dimension once a selection has been made. Obviously for multi-select dimensions you don&#8217;t want to do this, but that doesn&#8217;t mean you *can&#8217;t* use links. For example, check out the multi-select subject dimension here, which uses links:</p>
<p><a href="http://www2.lib.ncsu.edu/catalog/?view=full&#038;Ntt=natural+language+processing&#038;Ntk=Keyword&#038;N=4294941540+4294965454" rel="nofollow">http://www2.lib.ncsu.edu/catalog/?view=full&#038;Ntt=natural+language+processing&#038;Ntk=Keyword&#038;N=4294941540+4294965454</a></p>
<p>&#8220;Don’t use check boxes for facet that are very large (50+) or hierarchical. Multi-selection with check boxes doesn’t scale with size.&#8221; What would be your preferred alternatives? (e.g. a vertical scroll bar, a pop up expandable panel, etc?)</p>
<p>&#8220;I include an extra set of radio buttons (Show All/Choose Makes)&#8221; I don&#8217;t quite understand the use case for having a &#8220;show all&#8221; &#8211; isn&#8217;t that what &#8220;more choices&#8221; does? Or did you mean &#8220;Select all&#8221;?</p>
<p>Re Single-select with radio buttons: &#8220;Undo is really easy, since all options are visible all the time.&#8221; This implies that the dimension stays visible after selection, which for single select, would not normally be the default behaviour (they would typically be refined away, and the breadbox would then be used to maintain navigational state). In your experience, do you assume the converse (i.e. dimensions aren&#8217;t refined away by default)?</p>
<p>Repeated selection with link lists &#8211; I agree with your general guidance here, but the example you&#8217;ve chosen strikes me as a bit of an edge case &#8211; multi-select AND is quite rare (e.g. compared to multi-select OR) and possibly the most difficult combination to get right (IMHO).  Because it is multi-select, I&#8217;d normally expect a check box to give the right affordance, but because it is AND, we have to be careful of the combinatorics (as soon as you select one feature, it affects the number of hit counts on the other features, so you *have* to update the values immediately or risk getting zero results&#8230; in which case, links perhaps give a better affordance of the &#8220;click this and something will happen straight away&#8221; interaction.</p>
<p>But that&#8217;s why I feel multi-select AND isn&#8217;t the best example here &#8211; unless the point you are specifically about the &#8220;Repeated selection&#8221; (i.e. the multi-select AND) part rather than the &#8220;with link lists&#8221; part (which is a much more generic design element).</p>
<p>Cheers,<br />
Tony</p>
]]></content:encoded>
	</item>
</channel>
</rss>
