<?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>DonnaM &#187; gallery</title>
	<atom:link href="http://maadmob.net/donna/blog/tag/gallery/feed" rel="self" type="application/rss+xml" />
	<link>http://maadmob.net/donna/blog</link>
	<description>Information architecture, interaction design and much more</description>
	<lastBuildDate>Tue, 08 Jun 2010 09:30:31 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.6</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Reducing the learning curve</title>
		<link>http://maadmob.net/donna/blog/2008/lower-learning-curve</link>
		<comments>http://maadmob.net/donna/blog/2008/lower-learning-curve#comments</comments>
		<pubDate>Sun, 04 May 2008 02:41:47 +0000</pubDate>
		<dc:creator>Donna Spencer</dc:creator>
				<category><![CDATA[User experience]]></category>
		<category><![CDATA[gallery]]></category>
		<category><![CDATA[navigation]]></category>

		<guid isPermaLink="false">http://maadmob.net/donna/blog/2008/lower-learning-curve</guid>
		<description><![CDATA[In my last post, one of the things I most criticised Peugeot for was providing navigation based on a series of numbers, and making me decipher the numbering system before I could start to learn about their cars.
This numbering system (or strange names) problem exists throughout the car industry. It is just one of the [...]]]></description>
			<content:encoded><![CDATA[<p>In my <a href="http://maadmob.net/donna/blog/2008/peugeot_website">last post</a>, one of the things I most criticised Peugeot for was providing navigation based on a series of numbers, and making me decipher the numbering system before I could start to learn about their cars.</p>
<p>This numbering system (or strange names) problem exists throughout the car industry. It is just one of the things that a consumer needs to learn before starting to navigate the car world. It has been around for a long time, is fairly embedded, and there are plenty of people who know the system. Just not everyone.</p>
<p>The thing that we can do, as user experience designers, is to make sure things work on both levels &#8211; to provide ease of access to those who know the system, and help people who don&#8217;t know the system to learn it quickly &#8211; to lower the barrier to entry.</p>
<p>So given I&#8217;ve been spending too  much time on car websites recently, I thought it would be worth looking at some examples of how some brands are managing this.</p>
<h3>High learning curves</h3>
<p>First, here&#8217;s the some bad examples.</p>
<p>Peugeot&#8217;s model range page is based on numbers and provides no further information:</p>
<p><img src="http://maadmob.net/donna/blog/images/peugeot2.png" alt="The model range page, showing an image and larger numbers" /></p>
<p>Alfa Romeo doesn&#8217;t have a &#8216;models&#8217; landing page so the only entry is through the navigation in the middle of the page. A simple addition would be to add the model name to the scrolling banner image &#8211; at least I could then watch the image and get an idea:</p>
<p><img src="http://maadmob.net/donna/blog/images/alfa1.png" alt="Alfa Romeo home page - model numbers in navigation" /></p>
<p>Citroen are the same &#8211; no &#8216;model&#8217; landing page, so all entry is through the number-based navigation at the top of the page:</p>
<p><img src="http://maadmob.net/donna/blog/images/citroen1.png" alt="Citroen home page - navigation via the numbers in top navigation" /></p>
<h3>Low learning curve: At a glance</h3>
<p>Renault and Volkswagen both show names and thumbnails at a glance. Nicely done and easy to understand.</p>
<p><img src="http://maadmob.net/donna/blog/images/renault1.png" alt="Renault passenger cars page - thumbnails of each car with their model names" /></p>
<p><img src="http://maadmob.net/donna/blog/images/vw1.png" alt="VW model page - thumbnails of each car and their names" /></p>
<p>Audi have a go at it, but the thumnails are a bit small to tell the cars apart (I do like that they show starting price here &#8211; that&#8217;s handy too):</p>
<p><img src="http://maadmob.net/donna/blog/images/audi1.png" alt="Audi model page - thumbnail image of each car and its model name" /></p>
<p>BMW tries as well, but the images are too busy to see detail of the car:</p>
<p><img src="http://maadmob.net/donna/blog/images/bmw1.png" alt="BMW automobiles page showing thumbnail and models" /><br />
This is the most common approach with other manufacturers doing it with varying levels of usefulness</p>
<h3>Low learning curve: Easy to reach</h3>
<p>Fiat has a &#8216;Model range&#8217; widget on the home page that lets you scroll through the range, so you can visually connect the picture to the name:</p>
<p><img src="http://maadmob.net/donna/blog/images/fiat1.png" alt="Fiat thumbnail and name" /></p>
<p><img src="http://maadmob.net/donna/blog/images/fiat2.png" alt="Fiat thumbnail and name" /></p>
<h3>Low learning curve: details on hover</h3>
<p>Saab have thumbnails of the models on the home page, with good detail on hover (and consistent navigation options for each):</p>
<p><img src="http://maadmob.net/donna/blog/images/saab1.png" alt="Saab home page showing details for one model" /></p>
<p>Holden too have a &#8216;more details on hover&#8217;, interestingly attached to flyout navigation (I did nearly miss this though):</p>
<p><img src="http://maadmob.net/donna/blog/images/holden1.png" alt="Holden navigation showing thumbnail" /></p>
<p>Just goes to show, it is possible to do better&#8230;</p>
<p>And now I should get back to work and stop thinking about cars (though ping me if you love/hate your recent-model Peugeot, Alfa or Fiat).</p>
]]></content:encoded>
			<wfw:commentRss>http://maadmob.net/donna/blog/2008/lower-learning-curve/feed</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
	</channel>
</rss>
