<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	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/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>UXDriven &#187; article</title>
	<atom:link href="http://blog.uxdriven.com/category/article/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.uxdriven.com</link>
	<description>Design. Build. Convert.</description>
	<lastBuildDate>Thu, 17 Sep 2009 18:58:50 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Making a Case For Endless Scrolling</title>
		<link>http://blog.uxdriven.com/2009/09/17/making-a-case-for-endless-scrolling/</link>
		<comments>http://blog.uxdriven.com/2009/09/17/making-a-case-for-endless-scrolling/#comments</comments>
		<pubDate>Thu, 17 Sep 2009 16:30:02 +0000</pubDate>
		<dc:creator>Eric</dc:creator>
				<category><![CDATA[article]]></category>

		<guid isPermaLink="false">http://blog.uxdriven.com/?p=101</guid>
		<description><![CDATA[Introduction



Every user action has an associated cost, and the key to many sites&#8217; conversion
lies within minimizing this cost, whether it means minimizing &#8220;clicks&#8221; or simply
requiring less from the user.

By and large, it comes down to efficiency and accomplishing a task in as painless of a way as
possible.  USAA&#8217;s Deposit@Mobile is a great example of [...]]]></description>
			<content:encoded><![CDATA[<h2>Introduction</h2>

<p><img src="http://blog.uxdriven.com/wp-content/uploads/2009/09/google_reader_thumb.png" alt="Google Reader Thumb" /></p>

<p><strong>Every user action has an associated cost</strong>, and the key to many sites&#8217; conversion
lies within minimizing this cost, whether it means minimizing &#8220;clicks&#8221; or simply
<a href="http://www.uie.com/articles/three_hund_million_button/" title="$300 Million Dollar Button">requiring less from the user</a>.</p>

<p>By and large, it comes down to efficiency and accomplishing a task in as painless of a way as
possible.  <a href="http://www.usaa.com/" title="USAA">USAA</a>&#8217;s <a href="https://www.usaa.com/inet/ent_blogs/Blogs?action=blogpost&amp;blogkey=newsroom&amp;postkey=deposit_a_check_from_anywhere" title="deposit@mobile">Deposit@Mobile</a> is a great example of how a company can
improve customer experience &amp; perception by simplifying the tedious process of depositing a check.</p>

<p>In my opinion, <em>Endless Scroll</em> is a technically simple idea that greatly reduces friction
in every day activities.</p>

<h2>Current Trends</h2>

<p><a href="http://uipatternfactory.com/p=endless-scrolling/" title="Endless Scrolling">Endless Scrolling</a> has been discussed before, but has seen limited adoption despite
<a href="http://reader.google.com/">Google Reader</a>&#8217;s seamless implementation:</p>

<p><object width="480" height="360" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab">
    <param name="src" value="http://blog.uxdriven.com/wp-content/uploads/2009/09/google_reader.mov">
    <param name="controller" value="true">
    <param name="autoplay" value="false">
    <embed src="http://blog.uxdriven.com/wp-content/uploads/2009/09/google_reader.mov"
        width="480" height="360"
        controller="true" autoplay="false"
        scale="tofit" cache="true"
        pluginspage="http://www.apple.com/quicktime/download/">
</object></p>

<p>Seeing how <a href="http://www.facebook.com/" title="Facebook">many</a>, <a href="http://digg.com/" title="Digg.com">many</a>, <a href="http://fmylife.com/" title="F My Life">many</a> sites offer a constant stream of new content,
pagination often interrupts the flow.  Granted, many sites (<a href="http://google.com/" title="Google">Google</a>) require paginated
content to distinguish valuable content from less desirable.</p>

<h2>User Experience</h2>

<p>Besides streamlining the experience for the user, there are potential negatives to be mitigated:</p>

<ul>
<li>Any content below main content may be &#8220;bumped&#8221; for newer content.  The footer may
never be accessible if it lies below new content.</li>
<li>Context of content (such as the date or event-related to content) may be lost.</li>
<li>Toggling this behavior would require user interaction, which defeats the purpose of automating
the &#8220;Next Page&#8221; event entirely.</li>
<li>&#8220;Progressing&#8221; through content goes away entirely, as pagination clearly defines where the user
is in terms of progress (&#8221;Page 23 of 61&#8243;).</li>
</ul>

<p>Many of these potential problems have already been solved in Google Reader&#8217;s implementation by
doing the following:</p>

<ul>
<li>&#8220;Frame&#8221; the content container so that main page components: <em>header</em>, <em>navigation</em>, <em>footer</em>, <em>etc.</em>
are still accessible no matter how far the user scrolls.</li>
<li>Clearly define the context of the content, such as the date, author, or category.</li>
<li>Message the user on how much progress has been made: &#8220;<em>23 of 467 Articles Loaded</em>&#8220;.</li>
</ul>

<h2>Conclusion</h2>

<p>For now, it seems <em>Endless Scroll</em> is best as an &#8220;opt-in&#8221; option for the user, whether by
<a href="http://uxdriven.com/static/js/uxdriven/jquery/de-pagify/bookmarklet.jquery.min.js">bookmarklet</a>
or other means.  If the behavior of the user is almost always to continue on to more content then
<em>Endless Scroll</em> can prove beneficial.</p>

<h2>Resources</h2>

<p>I recently <a href="http://blog.uxdriven.com/2009/09/16/de-pagify-endless-scroll-jquery-plugin/" title="De-Pagify - Endless Scroll jQuery Plugin">posted</a> a <a href="http://plugins.jquery.com/project/de-pagify" title="De-Pagify">De-Pagify jQuery Plugin</a> (<a href="http://uxdriven.com/static/js/uxdriven/jquery/de-pagify/demo.php" title="Demo">demo</a>) as an aid in
implementing <em>Endless Scroll</em>.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.uxdriven.com/2009/09/17/making-a-case-for-endless-scrolling/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
<enclosure url="http://blog.uxdriven.com/wp-content/uploads/2009/09/google_reader.mov" length="4053619" type="video/quicktime" />
		</item>
	</channel>
</rss>
