<?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>Jeremy Tunnell</title>
	<atom:link href="http://www.jeremytunnell.com/feed" rel="self" type="application/rss+xml" />
	<link>http://www.jeremytunnell.com</link>
	<description>User Experience &#124; Project Management &#124;  SEO</description>
	<lastBuildDate>Mon, 10 Sep 2012 03:50:56 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.5.1</generator>
		<item>
		<title>DatingInGroups.com</title>
		<link>http://www.jeremytunnell.com/posts/datingingroups-com</link>
		<comments>http://www.jeremytunnell.com/posts/datingingroups-com#comments</comments>
		<pubDate>Sun, 09 Sep 2012 17:08:36 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[Portfolio]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=317</guid>
		<description><![CDATA[User Experience Lead (Contract)]]></description>
				<content:encoded><![CDATA[<p>Role: <strong>User Experience Lead (Contract)</strong></p>
<p>Company:<strong> DatingInGroups.com<br />
</strong></p>
<p>When: <strong>2012</strong></p>
<p>Dating in Groups is a group dating startup based in the Washington DC area.</p>
<p>As UX lead for this project, I completed the initial workflow diagrams and wireframes and worked with developers and designers to implement them.</p>
<p>The site design was intended to be as simple as possible – to feel more like an app than a website. The primary goal was to take potential users from the landing page (initially the homepage) to attending a group date quickly and with as little friction as possible.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/datingingroups-com/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>African campaign platform</title>
		<link>http://www.jeremytunnell.com/posts/african-campaign-platform</link>
		<comments>http://www.jeremytunnell.com/posts/african-campaign-platform#comments</comments>
		<pubDate>Sun, 09 Sep 2012 16:48:46 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[Portfolio]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=311</guid>
		<description><![CDATA[Architect, Technology Advisor]]></description>
				<content:encoded><![CDATA[<p>Role: <strong>Architect, Technology Advisor</strong></p>
<p>Company:<strong> An African presidential campaign<br />
</strong></p>
<p>When: <strong>2012</strong></p>
<p>Throughout 2012, I was involved in designing a campaign platform for a presidential campaign in Africa.</p>
<p>This platform will be the first SMS-based fully integrated campaign platform in Africa and will tie together the campaign website, Facebook page, supporter databases, and communication.</p>
<p>I completed the initial research and functional requirements for the project which included the following features:</p>
<ul>
<li>Core centralized supporter database</li>
<li>SMS platform for communicating with supporters and collecting information</li>
<li>Campaign metrics module for important statistics at a glance</li>
<li>Landing page Creator for campaigns with automated A/B testing</li>
<li>Gamification tied into a dynamic custom Facebook page front end</li>
</ul>
<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/african-campaign-platform/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Usability lessons from neuroscience</title>
		<link>http://www.jeremytunnell.com/posts/usability-lessons-from-neuroscience</link>
		<comments>http://www.jeremytunnell.com/posts/usability-lessons-from-neuroscience#comments</comments>
		<pubDate>Wed, 11 Jul 2012 17:16:58 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[Usability Research]]></category>
		<category><![CDATA[User Experience (UX)]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=130</guid>
		<description><![CDATA[I have just finished a wonderful book, Reading in the Brain: The New Science of How We Read, which ostensibly is about the origins and the neural underpinnings of the human ability to read. Dehaene not only takes on the conventional wisdom that reading is a sequential, letter by letter process, but he unwittingly sheds light on the foundations of many universally accepted usability practices.]]></description>
				<content:encoded><![CDATA[<p>I have just finished a wonderful book, <a href="http://www.amazon.com/gp/product/0143118056/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0143118056">Reading in the Brain: The New Science of How We Read</a><img style="border: none !important; margin: 0px !important;" src="http://www.assoc-amazon.com/e/ir?t=rsiinf-20&amp;l=as2&amp;o=1&amp;a=B004Q7E1TY&amp;camp=217145&amp;creative=399373" alt="" width="1" height="1" border="0" />, which ostensibly is about the origins and the neural underpinnings of the human ability to read. Dehaene not only takes on the conventional wisdom that reading is a sequential, letter by letter process, but he unwittingly sheds light on the foundations of many universally accepted usability practices.</p>
<h3>The big picture</h3>
<p>The major takeaway from the book is that, contrary to conventional wisdom, reading is not like a standard string search algorithm that one might program into a computer (e.g. to look up the word &#8220;time&#8221;, one might start with all words that begin with t, narrow down to words containing i as the second letter, and so on until there is only one word left).</p>
<p>Instead, reading is a massively parallel and hierarchical process whereby neurons at the bottom of the pyramid are allowed to vote &#8220;yes&#8221; or &#8220;no&#8221; to a neuron one level up the hierarchy. This aggregation neuron tallies the votes of all neurons that report to it, dutifully passing its findings further up the pyramid.</p>
<p>So how does this work in practice? Let&#8217;s take our example of the word &#8220;time&#8221;.</p>
<p>At the very bottom of the pyramid are neurons which respond to very basic elements in an image: vertical lines, horizontal lines, diagonal lines, intersections, right angles, etc. For our  &#8217;t&#8217; in  &#8221;time&#8221;, there is perhaps a neuron somewhere which detects the intersection of the vertical line and horizontal line in the letter &#8216;t&#8217;. This neuron then proceeds to vote &#8220;yes&#8221; in favor of every possible letter that contains this intersection. It also votes &#8220;no&#8221; for letters which do not contain this intersection, like &#8216;s&#8217;.</p>
<p>The aggregation neuron in charge of the letter &#8216;t&#8217; receives votes from below, tallies them, and then sends a vote to the next level in the pyramid that the word probably contains a &#8216;t&#8217;.  Meanwhile, this higher neuron is simultaneously receiving &#8220;no&#8221; votes for letters like &#8216;c&#8217;, &#8216;y&#8217;, and &#8216;u&#8217;.  Eventually, the tallied votes for &#8216;t&#8217;, &#8216;i&#8217;, &#8216;m&#8217;, and &#8216;e&#8217; win the election, and the chaotic process very quickly converges on the right word &#8211; somewhere near the top of the pyramid.</p>
<h3>What this means for usability</h3>
<p>I am certainly not suggesting that these new findings will turn the field of usability on its head. However, they do shed some light on some long-held usability best practices.</p>
<h4>The brain&#8217;s visual system is biased to the right of one&#8217;s focus</h4>
<p>Most of the text processing capabilities of the brain reside in the left hemisphere. This means that visual stimuli appearing on the right side of the visual field have a decided advantage.</p>
<p>In fact, information on the left side of the visual field has to enter the right hemisphere of the brain and be transferred through the corpus callosum to the left hemisphere – through two centimeters of callosal cable.  As a result, words on the left side of the visual field are recognized more slowly and are subject to more errors.</p>
<p>In the English-speaking world, our left to right reading style seems to be well adapted to this limitation. However, I think this idea could be generalized to more than just words.</p>
<p>It seems to follow that not only are pages optimally processed from left to right, but that actions regarding the current area of focus are best placed on the right.  This approach could certainly apply to context menus, action buttons, and error states.</p>
<h4>Word familiarity matters, length doesn&#8217;t</h4>
<p>Because of the massively parallel operation of the brain&#8217;s neural network, the brain processes all of the letters in a word at once, and common words receive stronger votes in the voting process.</p>
<p>This finding holds for words of up to eight letters, where presumably the eye has to move forward to process the rest of the letters.  Therefore, it is often better to use a longer and more familiar word than a shorter and less common one.</p>
<h4>Words are not recognized by their shape</h4>
<p>The image from the retina is initially processed in what is called the &#8220;letterbox&#8221; area of the left hemisphere, and it turns out that this area processes uppercase and lowercase letters in parallel.  Indeed, according to the book, the small difference in reading performance for the sentences &#8220;It was a dark and stormy night&#8221; and &#8220;It WaS a DaRk AnD sToRmY nIgHt&#8221; is due simply to the fact that capital letters are less familiar than mixed case.</p>
<p>It is not immediately clear how far this finding extends into font choices. How unusual must a font be before a lack of familiarity slows reading speed?  The book suggests that our text processing system is highly tolerant of errors, giving examples of situations where transposed letters, missing letters, or misshapen letters have no effect on reading performance.</p>
<p>So it seems usability best practices were right for the wrong reason. Yes, it is slightly slower to read all capital letters, but it is only because we see mixed case more often.</p>
<h3>And what about images?</h3>
<p>It turns out that the brain uses similar mechanisms to recognize images, and to some degree text processing is just a very specialized case of the brain&#8217;s natural ability to recognize shapes and patterns in a visual field.</p>
<h4>The brain only stores a simplified version of images</h4>
<p>The brain is not a video recorder, meticulously documenting every detail of an image.</p>
<p>In fact, it stores only a very abstract generalization of an image. For example, the same neurons that recognize a shape as a person will also fire when presented with a circle with a smaller circle placed on top. Likewise, and Apple can be recognized either by a full representation or simply a circle with a line sticking out of it.</p>
<p>So what exactly serves as the essence of an image?</p>
<p>Just as the brain uses line intersections to differentiate letters (a &#8216;t&#8217; shaped intersection versus an &#8216;L&#8217; shaped one), it also uses intersections to store and represent images.  These different intersection types, called proto-letters, are the basic &#8220;alphabet&#8221; of image recognition.</p>
<p>For instance,  the &#8216;T&#8217; intersection is one of the most common intersections found in nature, often when one object is placed in front of another.</p>
<p>Not only does the brain use these intersections to store objects, but it is almost impossible to store the image without them, as you can see in the following illustration:</p>
<div id="attachment_143" class="wp-caption alignright" style="width: 229px"><a href="http://www.jeremytunnell.com/wp-content/uploads/2011/07/line-segments.png"><img class="size-medium wp-image-143" title="line segments" src="http://www.jeremytunnell.com/wp-content/uploads/2011/07/line-segments-219x300.png" alt="Intersections are necessary to recognize objects" width="219" height="300" /></a>
<p class="wp-caption-text">Intersections are necessary to recognize objects (Credit: Reading in the Brain, Dehane)</p>
</div>
<h4>Mirror perception simplifies image recognition</h4>
<p>The human brain is hardwired for left-right  invariance, but is sensitive to vertical orientation.</p>
<p>From the standpoint of evolution, it is easy to see why this might be so. As Dehaene states, &#8220;A Tiger&#8217;s left and right sides are equally threatening… But the beast is less of a threat upside down than right side up!&#8221;</p>
<p>The upshot of this is that despite what you might think, you probably have no idea of the orientation of  everyday things.  (Quick, does the Firefox icon flow clockwise or counterclockwise?)</p>
<p>Is seems that any left right distinctions that we do make (like left and right arrows) have to be specifically learned.</p>
<h4>Recently viewed images are recalled faster</h4>
<p>Called image priming, researchers have found that images that have been seen before are recalled much more quickly than new images. This effect is seen even weeks after the original image was displayed.</p>
<p>&#8212;&#8212;</p>
<p>As User Experience practitioners, we are always learning rules. Sometimes we are fortunate enough to know the &#8216;why&#8217; behind these rules, but often we do not.</p>
<p>Especially now that eyetracking  and A/B testing are widely used, it is becoming commonplace to improve engagement or conversion without touching the why question at all.</p>
<p>But answering the &#8216;why&#8217; question <em>is</em> important.</p>
<p>All of the A/B testing in the world will just find local maximums. Getting in the vicinity of the global maximum for a design is unfortunately still more of an art than a science.  And it&#8217;s harder to get there when all we have is intuition, experience, and inference.</p>
<p>That&#8217;s why I welcome all of these nuggets we&#8217;re getting from neuroscience. Right now, it&#8217;s just a bunch of puzzle pieces, but I hope more discoveries from neuroscience will help us put the pieces in place.</p>
<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/usability-lessons-from-neuroscience/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Books on User Experience and User Interface Design</title>
		<link>http://www.jeremytunnell.com/posts/books-on-user-experience-and-user-interface-design</link>
		<comments>http://www.jeremytunnell.com/posts/books-on-user-experience-and-user-interface-design#comments</comments>
		<pubDate>Sun, 13 May 2012 19:34:50 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[Usability Research]]></category>
		<category><![CDATA[User Experience (UX)]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=260</guid>
		<description><![CDATA[Having spent the majority of 2011 in intense self-study to finish my transition from developer/project manager to UX engineer, I thought it would be useful for others out there to share my reading list and some brief thoughts. Steve Krug- Don&#8217;t make me think The best book for a quick introduction to user experience is [...]]]></description>
				<content:encoded><![CDATA[<p>Having spent the majority of 2011 in intense self-study to finish my transition from developer/project manager to UX engineer, I thought it would be useful for others out there to share my reading list and some brief thoughts.</p>
<p><a href="http://www.amazon.com/gp/product/0321344758/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0321344758">Steve Krug- Don&#8217;t make me think</a></p>
<p>The best book for a quick introduction to user experience is this first one.  You&#8217;ll find that Steve Krug (along with Jakob Nielsen) is the guy who writes all the forwards for all of the other books.</p>
<p><a href="http://www.amazon.com/gp/product/0465067107/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0465067107">Donald Norman &#8211; The design of everyday things</a></p>
<p>I would recommend that you read this book first. It has nothing to do with websites, but it&#8217;s a wonderful introduction to the design process and thinking about usability</p>
<p><a href="http://www.amazon.com/gp/product/073571102X/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=073571102X">Nielsen and Tahir &#8211; Homepage usability-50 websites deconstructed</a></p>
<p>Nielsen and Tahir are also pretty big. This book is old, but it&#8217;s basically a picture book and is a quick and easy read. Most of the principles still apply, but get this one at the library.</p>
<p><a href="http://www.amazon.com/gp/product/0321350316/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0321350316">Jakob Nielsen &#8211; Prioritizing Web usability</a></p>
<p>Nielsen also wrote this great overview book that touches on all the different parts of UX. It&#8217;s quite a bit more in depth, but well worth reading.</p>
<p><a href="http://www.amazon.com/gp/product/0201398605/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0201398605">John Cato &#8211; User centered web design</a></p>
<p>This book is a very detailed look at the user centered design process. It&#8217;s almost too detailed, because rarely does one go through the entire process in the real world. However, it&#8217;s useful to get a detailed look at every step so that if you&#8217;re abbreviating the process, you know what&#8217;s missing.</p>
<p><a href="http://www.amazon.com/gp/product/0596527349/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=0596527349">Louis Rosenfeld &#8211; Information architecture for the World Wide Web</a></p>
<p>If you&#8217;re  interested in information architecture, this book is about as detailed as I have found. It&#8217;s pretty dense reading, but it covers not only traditional IA, but also searching and card sorting (which is kind of like user testing for IA).</p>
<p><a href="http://www.amazon.com/gp/product/1449379702/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=1449379702">Jenifer Tidwell &#8211; Designing Interfaces</a></p>
<p>This is a reference book, which basically contains a bunch of design patterns.  It&#8217;s well worth reading, and it warrants a few pages of notes (I ended up with six).  However, once you&#8217;ve internalized these patterns, the book doesn&#8217;t get a lot of use. If you have read through some of the intro books, this is a great book to look through just to start building a mental map of use cases and best practices.</p>
<p><a href="http://www.amazon.com/gp/product/1592535879/ref=as_li_qf_sp_asin_il_tl?ie=UTF8&amp;tag=rsiinf-20&amp;linkCode=as2&amp;camp=1789&amp;creative=9325&amp;creativeASIN=1592535879">William Lidwell &#8211; Universal principles of design</a></p>
<p>An in-depth introduction to visual design principles, structured in an interesting way. The author creates a list of essential design principles (for example, affordances, cognitive dissonance, color theory, etc.), and dedicates about two pages to each principle. This is a must read book for those of us who came to user experience from an engineering background instead of design school.</p>
<p>That&#8217;s about 4 months worth of reading right there, if you&#8217;re reading for comprehension and not just skimming.</p>
<p>I also follow quite a few people/organizations on Twitter. Two useful ones I&#8217;ve found are <a href="https://twitter.com/#!/smashingmag">Smashing Mag</a>, <a href="https://twitter.com/#!/usabilla">Usabilla</a>, and <a href="https://twitter.com/#!/uxmag">UXmag</a>.</p>
<p>Good luck!
<p><a class="a2a_button_facebook_like addtoany_special_service" data-href="http://www.jeremytunnell.com/posts/books-on-user-experience-and-user-interface-design"></a><a class="a2a_button_twitter_tweet addtoany_special_service" data-count="none" data-url="http://www.jeremytunnell.com/posts/books-on-user-experience-and-user-interface-design" data-text="Books on User Experience and User Interface Design"></a><a class="a2a_button_reddit" href="http://www.addtoany.com/add_to/reddit?linkurl=http%3A%2F%2Fwww.jeremytunnell.com%2Fposts%2Fbooks-on-user-experience-and-user-interface-design&amp;linkname=Books%20on%20User%20Experience%20and%20User%20Interface%20Design" title="Reddit" rel="nofollow" target="_blank"><img src="http://www.jeremytunnell.com/wp-content/plugins/add-to-any/icons/reddit.png" width="16" height="16" alt="Reddit"/></a><a class="a2a_button_linkedin" href="http://www.addtoany.com/add_to/linkedin?linkurl=http%3A%2F%2Fwww.jeremytunnell.com%2Fposts%2Fbooks-on-user-experience-and-user-interface-design&amp;linkname=Books%20on%20User%20Experience%20and%20User%20Interface%20Design" title="LinkedIn" rel="nofollow" target="_blank"><img src="http://www.jeremytunnell.com/wp-content/plugins/add-to-any/icons/linkedin.png" width="16" height="16" alt="LinkedIn"/></a><a class="a2a_button_stumbleupon" href="http://www.addtoany.com/add_to/stumbleupon?linkurl=http%3A%2F%2Fwww.jeremytunnell.com%2Fposts%2Fbooks-on-user-experience-and-user-interface-design&amp;linkname=Books%20on%20User%20Experience%20and%20User%20Interface%20Design" title="StumbleUpon" rel="nofollow" target="_blank"><img src="http://www.jeremytunnell.com/wp-content/plugins/add-to-any/icons/stumbleupon.png" width="16" height="16" alt="StumbleUpon"/></a><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.jeremytunnell.com%2Fposts%2Fbooks-on-user-experience-and-user-interface-design&amp;title=Books%20on%20User%20Experience%20and%20User%20Interface%20Design" id="wpa2a_2">Others</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/books-on-user-experience-and-user-interface-design/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Just published a new article on Search Engine Optimization</title>
		<link>http://www.jeremytunnell.com/posts/just-published-a-new-article-on-search-engine-optimization</link>
		<comments>http://www.jeremytunnell.com/posts/just-published-a-new-article-on-search-engine-optimization#comments</comments>
		<pubDate>Mon, 07 May 2012 14:32:46 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[Search Engine Optimization]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=255</guid>
		<description><![CDATA[&#8230;at the NJI Media blog]]></description>
				<content:encoded><![CDATA[<p>&#8230;at the <a title="SEO Basics" href="http://njimedia.com/search-engine-optimization-seo-basics/">NJI Media blog</a>
<p><a class="a2a_button_facebook_like addtoany_special_service" data-href="http://www.jeremytunnell.com/posts/just-published-a-new-article-on-search-engine-optimization"></a><a class="a2a_button_twitter_tweet addtoany_special_service" data-count="none" data-url="http://www.jeremytunnell.com/posts/just-published-a-new-article-on-search-engine-optimization" data-text="Just published a new article on Search Engine Optimization"></a><a class="a2a_button_reddit" href="http://www.addtoany.com/add_to/reddit?linkurl=http%3A%2F%2Fwww.jeremytunnell.com%2Fposts%2Fjust-published-a-new-article-on-search-engine-optimization&amp;linkname=Just%20published%20a%20new%20article%20on%20Search%20Engine%20Optimization" title="Reddit" rel="nofollow" target="_blank"><img src="http://www.jeremytunnell.com/wp-content/plugins/add-to-any/icons/reddit.png" width="16" height="16" alt="Reddit"/></a><a class="a2a_button_linkedin" href="http://www.addtoany.com/add_to/linkedin?linkurl=http%3A%2F%2Fwww.jeremytunnell.com%2Fposts%2Fjust-published-a-new-article-on-search-engine-optimization&amp;linkname=Just%20published%20a%20new%20article%20on%20Search%20Engine%20Optimization" title="LinkedIn" rel="nofollow" target="_blank"><img src="http://www.jeremytunnell.com/wp-content/plugins/add-to-any/icons/linkedin.png" width="16" height="16" alt="LinkedIn"/></a><a class="a2a_button_stumbleupon" href="http://www.addtoany.com/add_to/stumbleupon?linkurl=http%3A%2F%2Fwww.jeremytunnell.com%2Fposts%2Fjust-published-a-new-article-on-search-engine-optimization&amp;linkname=Just%20published%20a%20new%20article%20on%20Search%20Engine%20Optimization" title="StumbleUpon" rel="nofollow" target="_blank"><img src="http://www.jeremytunnell.com/wp-content/plugins/add-to-any/icons/stumbleupon.png" width="16" height="16" alt="StumbleUpon"/></a><a class="a2a_dd a2a_target addtoany_share_save" href="http://www.addtoany.com/share_save#url=http%3A%2F%2Fwww.jeremytunnell.com%2Fposts%2Fjust-published-a-new-article-on-search-engine-optimization&amp;title=Just%20published%20a%20new%20article%20on%20Search%20Engine%20Optimization" id="wpa2a_4">Others</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/just-published-a-new-article-on-search-engine-optimization/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Thumbtack.com</title>
		<link>http://www.jeremytunnell.com/posts/thumbtack-com</link>
		<comments>http://www.jeremytunnell.com/posts/thumbtack-com#comments</comments>
		<pubDate>Thu, 08 Sep 2011 16:19:27 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[Portfolio]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=292</guid>
		<description><![CDATA[Co-founder, Lead developer]]></description>
				<content:encoded><![CDATA[<p>Role: <strong>Cofounder, Lead Developer, User Experience Lead</strong></p>
<p>Company:<strong> Thumbtack.com–A marketplace for local services. Thumbtack helps you find handymen, dog walkers, house cleaners, and even <a title="Firebreather" href="http://www.thumbtack.com/ny/new-york/magicians/performance-master">firebreathers</a>. Founded in 2008,  Thumbtack serves over 250,000 service providers.<br />
</strong></p>
<p>When: <strong>2008-2010</strong></p>
<p><iframe src="http://player.vimeo.com/video/41594488?title=0&amp;byline=0&amp;portrait=0" frameborder="0" width="500" height="281"></iframe></p>
<p><a href="http://vimeo.com/41594488">Thumbtack</a> from <a href="http://vimeo.com/thumbtack">Thumbtack</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
<div id='wpg_thumb_gallery292_0' class='wpg-thumb-container'></div>
<style type='text/css'>#content img{max-width: none;}#wpg_thumb_gallery292_0 img {width: 200px; height: 200px; border: 1px solid ##727272; overflow:hidden; float:left; margin:0px 15px 15px 0px;} #wpg_thumb_gallery292_0 img:hover {border-color: #;} #wpg_thumb_gallery292_0 img.last_thumb {margin-right:0px;} </style>
<p><script type='text/javascript'>jQuery(document).ready(	function() {	jQuery('#wpg_thumb_gallery292_0 a').colorbox({transition:'elastic', width:'90%', height:'90%'		});});</script></p>
<p>From the very beginning, we knew that the user experience would make or break our business. Our business model was based on removing friction from the process of finding and hiring service providers.</p>
<p>As the only technical founder,I created the prototype and MVP working closely with an outside firm for graphic design. I designed all of the user pathways, including sign-up and negotiation, between buyers and sellers. I also created workflow interfaces for our Philippine-based customer service operation.</p>
<p>Over two years, I hired and managed a team of six. I moved from a developer role into a product management role with a focus on making the site more usable and optimizing the conversion rates of key pathways.</p>
<p>My team developed:</p>
<ul>
<li>An architecture to support hundreds of thousands of service providers and millions of pictures, videos, and contacts.</li>
<li>A geographically aware (using PostGIS) search engine for services.</li>
<li>Matching algorithms to connect service providers with consumers.</li>
<li>An admin site that provided statistics, data mining, communication, and workflow tools to marketing and customer service, including over 100 staff overseas.</li>
<li>An SEO strategy that resulted in a 20x increase in organic search traffic in the span of one year.</li>
<li>A mailing infrastructure supporting tens of thousands of daily e-mails.</li>
</ul>
<h4>Notable Investors</h4>
<ul>
<li><a href="http://javelinvp.com/content/portfolio.html">Javelin Venture Partners</a></li>
<li><em><em>Scott Banister and </em>Cyan Banister</em>: Founder of IronPort, Founder of Zivity</li>
<li><em>Vance Bjorn</em>: Founder &amp; CTO of DigitalPersona</li>
<li><em>Mark Britto</em>: Founder &amp; CEO of Boku; Former SVP, Worldwide Sales &amp; Services of Amazon</li>
<li><em>Jason Calacanis</em>: Founder of WebBlogs &amp; Mahalo</li>
<li><em>Yan-David Erlich</em>: Founder &amp; CEO of ChoiceVendor</li>
<li><em>Mark Goines</em>: Former SVP of Consumer at Intuit; Former board member of Mint</li>
<li><em>Denis Grosz</em>: Founder of Conjecture</li>
<li><em>Auren Hoffman</em>: Founder &amp; CEO of RapLeaf</li>
<li><em>Ali Partovi and <em>Hadi Partovi</em></em>: Co-founder of LinkExchange, Co-founder of iLike</li>
<li><em>Joshua Schachter</em>: Founder of Delicious</li>
</ul>
<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/thumbtack-com/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Rally Congress</title>
		<link>http://www.jeremytunnell.com/posts/rally-congress</link>
		<comments>http://www.jeremytunnell.com/posts/rally-congress#comments</comments>
		<pubDate>Wed, 08 Jun 2011 16:13:43 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[Portfolio]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=289</guid>
		<description><![CDATA[User experience (Heuristic analysis), Interface design]]></description>
				<content:encoded><![CDATA[<p>Role: <strong> User experience (Heuristic Analysis, Site Redesign)</strong></p>
<p>Company: <strong>Rally Congress delivers messages, calls, and faxes to Capitol Hill on behalf of  nonprofits and political organizations.</strong></p>
<p>When: <strong>2011</strong></p>
<p>I was contracted to do a usability analysis (heuristic analysis) of the customer control panel and a full redesign based on my findings.</p>
<p>The specific goals were to increase usability and to increase conversion rate for various actions on the site.</p>
<p>One notable improvement that I made to the site was to the click to call pathway. Originally, it was a two level hierarchical navigation in which the user would be required to return to the menu to call more than one lawmaker. I changed the structure of the pathway to a pyramid design that automatically presents the user with the next action while allowing horizontal navigation between steps.</p>
<p>My deliverables were a usability analysis and wireframes of the redesigned pages. These materials are under NDA,  but most of my recommendations have been implemented so far, and you may see them in detail with a <a title="Free trial to Rally Congress" href="http://www.rallycongress.com/signup/trial_join/">free trial to Rally Congress</a>.</p>
<p>Chris Kinnan, CEO of Rally Congress, said after completion of the project:</p>
<blockquote><p>&#8230;the work you&#8217;ve done is fantastic, and I&#8217;m delighted to serve as a reference and provide a reference quote for your marketing.</p></blockquote>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/rally-congress/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>watchparty.tv &#8211; A usability analysis</title>
		<link>http://www.jeremytunnell.com/posts/watchparty-tv-a-usability-analysis</link>
		<comments>http://www.jeremytunnell.com/posts/watchparty-tv-a-usability-analysis#comments</comments>
		<pubDate>Tue, 26 Apr 2011 13:38:50 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[User Experience (UX)]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=76</guid>
		<description><![CDATA[Watchparty.tv is a site that allows users to host or join "watch parties" of popular television shows. During a watch party, users visit a webpage that aggregates their thoughts (blips), along with an opinion tracker and polls. The benefit of the watch party approach is allowing disparate users to watch TV shows "together".]]></description>
				<content:encoded><![CDATA[<p><a href="http://watchparty.tv">Watchparty.tv</a> is a site that allows users to host or join &#8220;watch parties&#8221; of popular television shows. During a watch party, users visit a webpage that aggregates their thoughts (blips), along with an opinion tracker and polls. The benefit of the watch party approach is allowing disparate users to watch TV shows &#8220;together&#8221;.</p>
<p>Upon visiting the site for the first time, one notices that the initial appearance is friendly,with a soft color scheme and edges.  The appearance is entirely appropriate for a site such as this. Normally, a media focused site would be sharper with bolder colors, but since watchparty is selling community, the friendly appearance is a big asset.</p>
<h3>Home page</h3>
<p><img class="alignright size-medium wp-image-91" title="Watch party homepage" src="http://www.jeremytunnell.com/wp-content/uploads/2011/04/003-e1303515056147-300x225.png" alt="" width="300" height="225" /></p>
<ul>
<li>The featured shows slider is a good focal point on the homepage for new users, however the hover menu should use a more readable version of the date, preferably the month spelled out with the day. The year is really not necessary here.</li>
<li>Auto complete would be nice in the search box (see Hulu)</li>
<li>Separating the bottom part of the homepage into current parties and upcoming parties is a little confusing because, essentially, they&#8217;re all points on the same timeline. A better solution would be to split the page into thirds, used two thirds for the left side to display currently active parties and upcoming parties in a scrollable format, and use the right third of the page to highlight the most popular parties at the moment. The idea here is to use the mental model of an online TV Guide.</li>
<li>The visual focal point of the listings is the &#8220;create private&#8221; button.  However,it is worth thinking about whether users would more likely be looking to join a public watch party. If so, a join button should be the primary call to action, with the create private button being a secondary action.</li>
<li>Regardless, simply turning the show name into linkable text is too subtle for a call to action. A button is needed here.</li>
<li>Also as a logged in user, the message link on the global navigation bar seems out of place and doesn&#8217;t actually live anywhere in the information architecture. The message section should actually live under the my profile section, and instead of a navigation button, there should be a new message identifier (see Gmail notifier).</li>
</ul>
<h3>Create Private Pop-up</h3>
<p>Clicking on the create private button results in a pop-up with two options: create a password and invite people.</p>
<ul>
<li>6 to 10 characters is a bit too secure for what amounts to a few people watching a TV show. A better option would be to auto generate a four digit pin instead of a password. This approach gives essentially 1000 combinations, and is  unlikely to be brute forced before the show is completed.</li>
<li>An even better option would be to just auto generate a short URL, ending in a four or five digit alphanumeric phrase. This URL could serve as both a bookmark and a password.</li>
<li>The invite people box should accept any delimiter that is not a valid character in an e-mail. This should be very easily done with the proper regular expression. At the very least, it should be able to handle commas, semicolons, spaces,  and new lines.</li>
</ul>
<h3>Register</h3>
<p><img class="alignright size-medium wp-image-95" title="Watch party register page" src="http://www.jeremytunnell.com/wp-content/uploads/2011/04/007-e1303515566990-300x225.png" alt="" width="300" height="225" /></p>
<ul>
<li>The registration process is nice and short, but could be made even shorter by removing the password confirmation blank. There will clearly be those who mistype their password, but an easy to use password recovery feature should mitigate any problems.</li>
<li>The line of action links at the bottom is duplicative and confusing. The sign in link is duplicated from the global menu, the forgot password link actually should not be on this page, and the Facebook and twitter logins are duplicated from just above. Also, the e-mail confirmation help link should be located on the register confirmation page and also the login confirmation page (only if they have not e-mail confirmed), but not this page.</li>
<li>After registering, the user is presented with an error message: (could not sign in, user is unconfirmed). This is not an error, because the user did nothing wrong. Instead, this should be presented as a normal step in the register process. Even better, auto log the user in and worry about e-mail confirmation at their second login.</li>
<li>My confirmation e-mail was sent to my spam folder (a common problem). <a title="E-mail sending tips" href="http://mikehillyer.com/email/how-to-send-one-billion-email-marketing-messages-per-month/">Have you ensured that your e-mail infrastructure has all the proper verifications?</a></li>
</ul>
<h3>Register confirm</h3>
<p><img class="alignright size-medium wp-image-93" title="Watch party confirm registration" src="http://www.jeremytunnell.com/wp-content/uploads/2011/04/0021-e1303515151579-300x225.png" alt="" width="300" height="225" /></p>
<ul>
<li>The phrase &#8220;must set up the following data&#8221; is technical sounding and unfriendly, and it is not true that one must fill out the data because the page also says that they can optionally log in.</li>
<li>Ideally, the user should have already been logged in, and this page simply asks them to select their time zone before proceeding. Also, the terms of service agreement should probably happen on the register page (It does, so why make the user do it twice?)</li>
<li>After clicking &#8220;save and accept terms&#8221;, there should be some sort of final confirmation that the register process completed successfully.Currently, the user is redirected to the home page. There are two solutions here: the first is to redirect the homepage but provide a nice confirmation message and call to action or redirect to the my profile page where the user can find  content specific to them.</li>
<li>As an additional note, after logging in the user is presented with a confirmation message  in orange. A less alarming color should be used for confirmations.</li>
</ul>
<h3>Create new private watch party</h3>
<p><img class="alignright size-medium wp-image-94" title="Watch party create new" src="http://www.jeremytunnell.com/wp-content/uploads/2011/04/004-e1303515202349-300x225.png" alt="" width="300" height="225" /></p>
<ul>
<li>The back button is in the wrong place. It should either be moved to the top left or replaced with the cancel button next to the confirm button at the bottom of the form.</li>
<li> The combined time and date input form elements are a bit daunting. In this case, it would be easier to comprehend two separate date and time input fields. The calendar could have the standard calendar pop-up, and the time input could be done iPhone style or with drop downs (think about limiting the options to either 15 min. intervals or 30 min. intervals).</li>
<li>After the start time is entered, the end times should automatically populate with 30 min. or one hour later. It is also unnecessary to say that the end time has to be after the start time, as this can be caught with a form check.</li>
<li>See note from above about the password field and the invite field.</li>
</ul>
<h3>Watchparty event page</h3>
<p><img class="alignright size-medium wp-image-90" title="Watch party main page" src="http://www.jeremytunnell.com/wp-content/uploads/2011/04/0061-e1303515004699-300x225.png" alt="" width="300" height="225" /></p>
<p>The first impressions when initially viewing this page are that there are a lot of options, there are some unfamiliar words, and the page feels quite a bit more static than it should.</p>
<p>&nbsp;</p>
<p>The eye begins in the top left and observes the name of the current watch party (good), which is followed by a rather large button to see the program details.  This button is perhaps a little bit large for what it does.  After the title, the eyes fall upon the top left box called &#8220;flips&#8221;.  It is immediately unclear what this word means, but using the context of the box contents one can deduce that they have something to do with expressing emotions.</p>
<p>The eye continues to the right from flips, landing on the &#8220;how do you feel&#8221; box, which is fairly clear as to its function. Moving down the page, the &#8220;blips&#8221; box does a fairly good job of communicating that it is some sort of short comment field. Finally, we move back to the left column to the &#8220;traks&#8221; box.  It is completely unclear what this box is for, especially if there  are no previous traks. Attendees is, of course, self-explanatory.</p>
<h4>Significant shortcomings</h4>
<ul>
<li>My initial expectation was that the page would be more dynamic. This, of course, is not due to bad design  but instead reflects the fact that the product is still in beta. Every effort should be made to Ajaxify all of the boxes on the page so that the page does not have to be refreshed for updates.</li>
<li>Boxes are not located correctly for their importance. For example, blips should be the most important thing on the page, and thus in the top left.</li>
<li>It is a little too ambitious to try to coin three new words. I was constantly experiencing varying degrees of cognitive dissonance trying to square the fact that a trak is really a poll, and a flip is really an emoticon.</li>
<li>It is not clear why one must be logged in to &#8220;attend&#8221; a watch party. One should be able to observe, without logging in or receiving an error message. The blip box could be replaced by a login box explaining that one must log in in order to contribute. I would go so far as to list anonymous observers in the &#8220;attendees&#8221; box, but listed after the registered users.</li>
</ul>
<h4>Minor shortcomings</h4>
<ul>
<li>The JavaScript character counter is misplaced, and really should be invisible until one is approaching the limit.</li>
<li>The &#8220;how do you feel&#8221; box should really be a dynamic graph  (see Frank Luntz&#8217;s debate feedback sessions for an example)</li>
<li>There are too many different types of buttons and links on the page.</li>
<li>Traks have constraints that don&#8217;t make sense. Why two character minimum; why not five or 10? Why does the trak have to have four options?</li>
</ul>
<h4>Design suggestions</h4>
<p>The wireframe below is a suggestion on how one might reorganize the page to overcome these shortcomings.</p>
<p style="text-align: center;">&nbsp;</p>
<div class="mceTemp mceIEcenter" style="text-align: left;">
<dl id="attachment_84" class="wp-caption aligncenter" style="width: 610px;">
<dt class="wp-caption-dt"><a href="http://www.jeremytunnell.com/wp-content/uploads/2011/04/watchparty-e1303506055468.png"><img class="size-full wp-image-84  " title="Watchparty UX wireframe" src="http://www.jeremytunnell.com/wp-content/uploads/2011/04/watchparty-e1303506055468.png" alt="Watchparty wireframe" width="600" height="452" /></a></dt>
<dd class="wp-caption-dd">Note: Not to scale. For layout and functional demonstration only.</dd>
</dl>
</div>
<ul>
<li>The words &#8220;trak&#8221; and &#8220;flip&#8221; have been removed completely.</li>
<li>Breadcrumbs have been added in place of the &#8220;leave watch party&#8221; link.</li>
<li>Blips have been moved &#8220;front and center&#8221; because they are the main focus of activity.</li>
<li>Flips have been integrated with the blip box, invoking the web HTML editor mental model.</li>
<li>The character counter has been moved to the top right of the text box, and should be invisible until one approaches the limit.</li>
<li>The motion tracking box in the upper right has been changed such that the slider is now vertical and the display is a dynamically changing graph.</li>
<li>The program details button is now a link.</li>
<li>Traks are now called polls, for less confusion, and are moved to the right. Past polls should still be visible and should move down when a new poll is created. There should be a hard limit on active polls to ensure that no active  poll falls below visibility.</li>
<li>The social networking features and invite features are moved to the attendees box which stretches across the bottom of the screen. This feature is important, but  sharing is provided immediately upon entering the page with a modal pop-up.</li>
<li>Creating a new emotion (previously a flip) can be accomplished with an in-line text field, or optionally hidden behind a &#8220;create new&#8221; link.  There is no need to label these at all, as they are self-explanatory.</li>
<li>For added simplicity, the blip button can be removed, and blips are simply published after pressing the enter key ( Facebook does this).</li>
<li>Black triangles now represent infinitely scrolling content boxes.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/watchparty-tv-a-usability-analysis/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>123exchanges.com &#8211; A usability analysis</title>
		<link>http://www.jeremytunnell.com/posts/123exchanges-com-a-usability-analysis</link>
		<comments>http://www.jeremytunnell.com/posts/123exchanges-com-a-usability-analysis#comments</comments>
		<pubDate>Fri, 08 Apr 2011 20:49:59 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[User Experience (UX)]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=57</guid>
		<description><![CDATA[123exchanges.com is an eBay type listing site based on the concept of selling through videos instead of written descriptions. The site provides a way for sellers to register and upload videos of things for sale, and it provides browsing and searching functionality for potential buyers. They are a startup based in the Washington DC area that is approximately 6 months old.]]></description>
				<content:encoded><![CDATA[<p><a href="http://123exchanges.com">123exchanges.com</a> is an eBay type listing site based on the concept of selling through videos instead of written descriptions. The site provides a way for sellers to register and upload videos of things for sale, and it provides browsing and searching functionality for potential buyers. They are a startup based in the Washington DC area that is approximately 6 months old.</p>
<div style="clear: both;"></div>
<h3>Home Page</h3>
<p><img class="pic-left" title="Homepage screenshot" src="/media/123_home_400.PNG" alt="Homepage screenshot" width="400" />The site has a coherent and appropriate color scheme, a good layout, and feels generally friendly, if a bit unpolished. The large promotional area in the center left is a good idea, and the limited browse functionality in the bottom half of the screen works well for users who aren&#8217;t sure what they&#8217;re looking for. I was able to find out very quickly what the site was about and what things I can do as a buyer or seller.</p>
<p>For the purpose of this analysis, I will be focusing only on areas of needed improvement:</p>
<ul>
<li> URL – The address bar shows the homepage address as being /default.aspx. The homepage should show only the domain name.</li>
<li> Logo – The main sans serif font is good, but the points on the two arrows are too sharp, and I would worry that the green (the color of tension) is not the right color for them. The font for the smaller tagline looks as though the text has been resized imperfectly (see the S in sell).</li>
<li> The blue text at the top in the header bar (Sell Your Used Stuff Today! It&#8217;s Free) is unnecessary and only serves to clutter the interface. The blue text on blue background lacks contrast, and the exclamation point is unnecessary.</li>
<li> Removing it and moving the search box up and to the right would improve the visibility of this important feature.</li>
<li> In the top right, the main call to action is &#8220;Upload Video&#8221;. I understand that the emphasis of the site is on video, but what the user is actually trying to do is sell an item, and the button label should perhaps reflect this.</li>
<li> The location drop-down at the very top of the site gets lost in the page. This feature should be moved down with the search.</li>
<li> As this is a fairly standard layout for this type of site, box labels like &#8220;promotion&#8221;, &#8220;what&#8217;s new&#8221;, etc. are unnecessary and clutter up the interface. &#8220;Sell your stuff in three easy steps&#8221; is important, but perhaps should be placed inside of the box instead of as a box header.</li>
<li> The social media buttons seem to have been placed arbitrarily. There is also some confusion about whether the like button and the tweet button apply to the video above or to the site itself. A better solution would be to group these together with the invite friends buttons.</li>
<li> The Starbucks coffee promotion looks like an advertisement instead of a promotion, and I would question the effectiveness of a free coffee on getting new users signed up (what do your numbers say?). Ads cheapen the look of your site, and I would try to avoid the appearance of them if possible.</li>
<li> Throughout the site, you use red text to emphasize prices. Red text is associated with danger or error, and I would highly recommend that you use a combination of font size and font weight (or use the color green) instead of the color red to point out prices.</li>
<li> There are a lot of social media buttons at the bottom, but some appear to be duplicates (even though they have different functions). The purpose of these buttons should be made more clear.</li>
<li> The community box at the bottom of the front page is confusing and ineffective. All of the posts are by &#8220;admin&#8221; which makes the section appear like an announcement section. Further, as a user I am not clear as to what I would use a community section for. For example, I just want to sell an iPod, and I have nothing in common with someone trying to sell a pair of jeans. It appears that there may be two different startups here: a marketplace and a general topic message board. Best to focus on the former.</li>
</ul>
<div style="clear: both;"></div>
<h3>Search Listing Pages</h3>
<p><img class="pic-left" title="Search listing screenshot" src="/media/123_searchlisting_400.PNG" alt="Search listingscreenshot" width="400" /></p>
<ul>
<li> It is unnecessary to repeat the category for each result. Either the user got this page by clicking on a category (in which case they will all be the same) or the user got here with a custom search in which case the category is irrelevant.</li>
<li> The item ID is also unnecessary.</li>
<li> The time format should be &#8220;X days ago&#8221; instead of the full timestamp. At minimum, there is no need for seconds to be listed.</li>
</ul>
<div style="clear: both;"></div>
<h3>Item Listing Page</h3>
<p><img class="pic-left" title="Item listing screenshot" src="/media/123_listing_400.PNG" alt="Item  listing screenshot" width="400" /></p>
<ul>
<li> Again, box headings are unnecessary. It is obvious what information appears in the &#8220;posting information box&#8221; and the &#8220;more info box&#8221;. Better to remove these and cleanup the interface.</li>
<li> The posting information box is cluttered with too much information. Cleanup the date and remove the item ID. The &#8220;view times&#8221; should also be removed. At this early stage, it only serves to work against you.</li>
<li> The condition rating system is confusing. I have no idea what &#8220;used 70%&#8221; means.</li>
<li> The blue text style for links and the styling for the item title are too similar, making the item title appear clickable.</li>
<li> Avatars in comments make the site appear MySpace-y.</li>
<li> Clicking on the respond button gave me a pop-up box. Better to just redirect the user to the login page with an explanation as to why they have been sent there.</li>
</ul>
<div style="clear: both;"></div>
<h3>Login Page</h3>
<p><img class="pic-left" title="Login screenshot" src="/media/123_login_400.PNG" alt="Login screenshot" width="400" /></p>
<ul>
<li> The phrase &#8220;welcome to 123 exchanges&#8221; is unnecessary.</li>
<li> The phrase &#8220;join our community now&#8221; appears to be a link to join the community, not a lead in to the sign-up link.</li>
<li> &#8220;Sign-up here&#8221; should be a button instead of a link with arrows on each side.</li>
</ul>
<div style="clear: both;"></div>
<h3>Sign-up Page</h3>
<p><img class="pic-left" title="Sign up screenshot" src="/media/123_signup_400.PNG" alt="Sign up screenshot" width="400" />This page is very important because it is the barrier between an interested user and a registered user. Every attempt should be made to make this page appear and be as simple and effortless as possible.</p>
<ul>
<li> According to Jakob Nielsen, a two column layout is less effective than a one column layout. Regardless, there is no reason why the last name field should be the only field in the right column.</li>
<li> There is no reason to have a country drop-down if there is only one country.</li>
<li> Eliminate the city field and state field, and instead pull those from the zip code.</li>
<li> Forcing the user to enter their e-mail twice, while helping to guard against typos, reduces your conversion rate. Furthermore, a great deal of users simply copy and paste what they had just typed. Better to remove the second e-mail address blank.  There is some controversy over this, but the number of people who mistyped their e-mail and do not correct it will be mitigated by the number of people now completing the form who would not have otherwise.</li>
<li> User id sounds like it should be a number. Better to label the field &#8220;username&#8221;, or even better remove it and auto generate a user name (while allowing the user to change it in his preferences).</li>
<li> Again, I would recommend the removal of the second password field. Ideally, the password recovery feature should be easy to use for those who mis-type the password initially.</li>
<li> Captchas should only be used when absolutely needed. While in such an early-stage, it is better to remove the captcha and either deal with the spam sign-ups or implement either the <a href="http://www.arraystudio.com/as-workshop/the-captcha-alternatives.html">dummy form elements method, GET request detection</a>, or separate the sign-up process into two steps.</li>
<li> Even better to implement a lazy registration process where you allow the user to upload a video and metadata first, and then ask them for e-mail and password as a last step.</li>
</ul>
<div style="clear: both;"></div>
<h3>Sign-up Confirmation Page</h3>
<p><img class="pic-left" title="Sign up confirm screenshot" src="/media/123_sign-upconfirm_400.PNG" alt="Sign up confirm screenshot" width="400" /></p>
<ul>
<li> There is no confirmation that my registration actually went through.</li>
<li> I would be curious to see numbers on whether the social media invite is used on this page or whether some other content would be better.</li>
<li> &#8220;Next Step&#8221; is not prominent enough.</li>
<li> There is no option to resend the confirmation e-mail if it was not received.</li>
<li> To cut friction, the user could be automatically logged in at this point, and the e-mail confirm could simply be required for the next login.</li>
<li> The confirmation e-mail is too wordy, and it leads with red text which says &#8220;danger&#8221;. There are also several typos. Ideally, this e-mail should contain the activation link in enough text to explain what it is and nothing more.</li>
<li> After clicking the activation link, congratulations is unneeded, and the phrase &#8220;wishing you the best&#8221; is unprofessional.</li>
<li> The user should ideally be automatically signed in and redirected to the my account home page, but if not at least the sign-up information should pre-seed.</li>
</ul>
<div style="clear: both;"></div>
<h3>My Account</h3>
<p><img class="pic-left" title="my account screenshot" src="/media/123_myaccount_400.PNG" alt="my account screenshot" width="400" /></p>
<ul>
<li> There is no link to logout. This link should be located near where the login button was.</li>
<li> The search function appears to be duplicated, and the drop-down for search type is unnecessary since it is easy to tell the difference between a product name and ID.</li>
<li> In general, there are too many menu items for the amount of things that one can do on this page. Messages should be integrated with the buy and sell list, home is unnecessary. Also, I would be careful about repurposing the main navigation for the my account section, while also having a my account navigation bar at the very top. It appears at first glance, that the new bar at the very top is navigation for the my account section, but in fact it duplicates navigation in the main nav.</li>
<li> There are several unnecessary columns, including product ID and view times.</li>
<li> The &#8220;view top 10 link&#8221;, from a user standpoint is useless. Why do I care who the top 10 users are?</li>
<li> &#8220;Request a Starbucks coffee&#8221; should be automatic, without having to request (send the coupon via e-mail)</li>
<li> Get rid of the refresh page button, all browsers have a refresh button.</li>
<li> Pagination is a little awkward (page count)</li>
<li> Upload video functionality is duplicated, but the second button is labeled &#8220;post video&#8221;.</li>
</ul>
<div style="clear: both;"></div>
<h3>Upload Page</h3>
<p><img class="pic-left" title="upload screenshot" src="/media/123_upload_400.PNG" alt="upload screenshot" width="400" /></p>
<ul>
<li> This page has far too much text, and the red text is jarring. Most of the text refers to troubleshooting steps, which the user should not be bothered with until they&#8217;re actually having trouble.</li>
<li> The choices on this page should be upload or cancel. &#8220;Back to selling list&#8221; is awkward phrasing, and there is no reason why the user would need to go to the homepage.</li>
<li> Above the video upload area, there is a sentence with buttons explaining that the user can use one of two video converting applications. What is a video converting application? Is it required? How do I know whether I need to use one or not? Best to place this in the troubleshooting section</li>
<li> The notice explains that the maximum video duration is 3 min., but a little bit later 3 min. is listed as a recommended length</li>
<li> This whole page is really unnecessary, as the video upload area could be fit into a box in the my account area with a small link below labeled &#8220;troubleshooting&#8221;, or &#8220;problems?&#8221;. After upload, the my account area would refresh the new video listed in an option to enter metadata.</li>
</ul>
<div style="clear: both;"></div>
<h3>Video Metadata Page</h3>
<p><img class="pic-left" title="metadata screenshot" src="/media/123_metadata_400.PNG" alt="metadata screenshot" width="400" /></p>
<ul>
<li> Blue is not a good color to use for the confirmation message at the top. It blends in with the background, and the user will skip over it straight to the input fields.</li>
<li> Too many fields crammed together, looks daunting. Use some white space to break up the fields.</li>
<li> It is unclear what the &#8220;call&#8221; checkbox does.</li>
<li> Again, city and state are not needed.</li>
<li> Tags are hard to explain to users, and there is no indication of what format is needed here, whether they should be separated spaces or commas, or whether multiple word tags are accepted. Due to the varied entry by users, this is not likely to be useful for navigation or searching (better to just emphasize a good item description)</li>
<li> Other information is deemphasized and would better be called &#8220;item description&#8221;.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/123exchanges-com-a-usability-analysis/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Watchparty.tv</title>
		<link>http://www.jeremytunnell.com/posts/watchparty-tv</link>
		<comments>http://www.jeremytunnell.com/posts/watchparty-tv#comments</comments>
		<pubDate>Tue, 08 Mar 2011 17:21:29 +0000</pubDate>
		<dc:creator>Jeremy Tunnell</dc:creator>
				<category><![CDATA[Portfolio]]></category>

		<guid isPermaLink="false">http://www.jeremytunnell.com/?p=295</guid>
		<description><![CDATA[User experience (Heuristic analysis), Interface design]]></description>
				<content:encoded><![CDATA[<p>Role: <strong>User Experience (Heuristic Analysis)</strong></p>
<p>Company: <strong><a href="http://Watchparty.tv">Watchparty.tv</a>, a start up that allows you to watch your favorite television shows with your friends.</strong></p>
<p>When: <strong>May 2011</strong></p>
<div id='wpg_thumb_gallery295_0' class='wpg-thumb-container'></div>
<style type='text/css'>#content img{max-width: none;}#wpg_thumb_gallery295_0 img {width: 150px; height: 150px; border: 1px solid ##727272; overflow:hidden; float:left; margin:0px 15px 15px 0px;} #wpg_thumb_gallery295_0 img:hover {border-color: #;} #wpg_thumb_gallery295_0 img.last_thumb {margin-right:0px;} </style>
<p><script type='text/javascript'>jQuery(document).ready(	function() {	jQuery('#wpg_thumb_gallery295_0 a').colorbox({transition:'elastic', width:'90%', height:'90%'		});});</script></p>
<p>I was asked to do a usability analysis on the site, focusing on things that might improve user engagement. I delivered <a title="Watchparty Usability Analysis" href="http://www.jeremytunnell.com/posts/watchparty-tv-a-usability-analysis">a report</a> and also a recommended wireframe for the application page.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.jeremytunnell.com/posts/watchparty-tv/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
