<?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>peterpixel: writings &#187; Design Guidelines</title>
	<atom:link href="http://www.peterpixel.nl/writings/category/design-guidelines/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.peterpixel.nl/writings</link>
	<description></description>
	<lastBuildDate>Mon, 14 Jun 2010 20:20:47 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Innovative Search From Amazon</title>
		<link>http://www.peterpixel.nl/writings/innovative-search-from-amazon/</link>
		<comments>http://www.peterpixel.nl/writings/innovative-search-from-amazon/#comments</comments>
		<pubDate>Sun, 22 Nov 2009 20:09:58 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Design Guidelines]]></category>
		<category><![CDATA[Usability]]></category>

		<guid isPermaLink="false">http://www.peterpixel.nl/writings/?p=567</guid>
		<description><![CDATA[Sometimes I stumble on good new UI experiments and every once in a while I like it so much, I take some time to write about them.  This one is from Amazon and as far as I can tell it has been rolled out across all their services (.com/.de/.co.uk ). What it does is, it [...]]]></description>
			<content:encoded><![CDATA[<p>Sometimes I stumble on good new UI experiments and every once in a while I like it so much, I take some time to write about them.  This one is from Amazon and as far as I can tell it has been rolled out across all their services (.com/.de/.co.uk ). What it does is, it guesses in which category the item you are searching for might fall. In my case I was searching for Bill Buxton. It guessed that  what I was looking for was found in the Books section. That in itself is not terribly useful since I am mostly likely to be looking for Bill Buxton&#8217;s books and not his movies, seeing as he is only an author and not a movie producer too (yet?) and I will most probably get books only anyway.</p>
<p><img style="border: 0px initial initial;" title="Bill Buxton" src="http://i299.photobucket.com/albums/mm295/peterpixel/amazon.png" alt="" width="419" height="114" /></p>
<p>However, it gets a lot more useful when searching for stuff that is found in different sorts of categories. A good example of that would be Donald Duck. Below you&#8217;ll see that Amazon filters your query automatically into the different categories.</p>
<p><img class="alignnone" title="Donald Duck" src="http://i299.photobucket.com/albums/mm295/peterpixel/donald_duck.png" alt="" width="256" height="248" /></p>
<p>My only qualms with it is, is that it is not directly distinguishable from search results, apart from the fact that it was indented. Perhaps colour could take care of that.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.peterpixel.nl/writings/innovative-search-from-amazon/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Pattern for Picking the Right Date</title>
		<link>http://www.peterpixel.nl/writings/pattern-for-picking-the-right-date/</link>
		<comments>http://www.peterpixel.nl/writings/pattern-for-picking-the-right-date/#comments</comments>
		<pubDate>Thu, 23 Jul 2009 16:04:33 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Design Guidelines]]></category>
		<category><![CDATA[Interaction]]></category>

		<guid isPermaLink="false">http://www.peterpixel.nl/writings/?p=490</guid>
		<description><![CDATA[While looking around for ways in which Airlines depict their booking information I came across two major themes: the calendar view and the dropdown. Below is a comparison of what&#8217;s good and bad about the two and a look at how they can be combined. Calendar: Lufthansa The good: What I like most about this [...]]]></description>
			<content:encoded><![CDATA[<p>While looking around for ways in which Airlines depict their booking information I came across two major themes: the calendar view and the dropdown. Below is a comparison of what&#8217;s good and bad about the two and a look at how they can be combined.<br />
<strong>Calendar: Lufthansa</strong><br />
<img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/lufthansa-1.png" title="Lufthansa Cal" class="alignnone" width="175" height="167" /><br />
<strong>The good</strong>: What I like most about this pattern is that it allows the user to see an oversight of the month they are viewing. This simplifies the decision making process somewhat and offers more information about the date they choose. It is helpful when you want to explicitly fly on a particular day, such as Saturday. </p>
<p><strong>The bad</strong>: As is often the case when booking airline tickets, you want to book months ahead. This means that you&#8217;d have to click through until you reach the month you want to fly in. If this 6 months from now, this leads to a lot of clicking. Accidentally clicking outside of the calender box removes the entire thing, probably causing frustration. The use case for booking tickets is also a different: you might be shopping around on various sites simultaneously, with 5 or 6 tabs open, in each one looking for flights on the exact same date. This means that you have most likely already chosen two dates and don&#8217;t need to be reminded on what day 12 December is. In this case you lose the advantage of having an oversight and the browsing becomes a tedious task. </p>
<p><strong>Drop Down: Baltic Air</strong><br />
<img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/ba.png" title="Baltic Air Cal" class="alignnone" width="305" height="183" /><br />
<strong>The good</strong>: Here we have exactly the opposite as at Lufhansa. Through a drop-down you select the dates, maximum amount of clicks: 2. Referring back to the use case of booking tickets, this quick input can be advantageous. </p>
<p><strong>The bad</strong> Drop downs cover other navigation elements. You loose oversight of what day you are booking your ticket and a drop down certainly does not remind me of a calendar. </p>
<p>It needs to be mentioned: Baltic Air gives you the option to try both options, although they use a popup to achieve this. </p>
<p><strong>Combination: Dutch Railways</strong><br />
<img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/ns.png" title="NS Cal" class="alignnone" width="278" height="266" /><br />
<strong>The good</strong>:Initially I was skeptical about this pattern since I can name very few times (if any) that I have looked at tickets months in advance. Taking the train in The Netherlands is also more akin to taking a tram, which makes me question why such an elaborate calender is needed. However, I am sold on this because it combines the best of both worlds: a monthly oversight, and a quick way to jump to dates relatively far ahead. </p>
<p><strong>The bad</strong>: I am curious how often people actually do check dates far ahead in the future. As with the Baltic air example, the drop down covers other content, which is never really good, but it&#8217;s a trade off. </p>
<p>To conclude: I don&#8217;t really think any of these are better or worse to such a degree that it is crippling usability. However, the use cases of these sites play an important factor in deciding what pattern is appropriate. For journeys happening withing short notice (buses, trains, etc.) the calendar might be good. For bookings 6 months from now, this might not always be the case. </p>
]]></content:encoded>
			<wfw:commentRss>http://www.peterpixel.nl/writings/pattern-for-picking-the-right-date/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Great Airline Booking Design Pattern Spreading</title>
		<link>http://www.peterpixel.nl/writings/great-airline-booking-design-pattern-spreading/</link>
		<comments>http://www.peterpixel.nl/writings/great-airline-booking-design-pattern-spreading/#comments</comments>
		<pubDate>Mon, 13 Jul 2009 21:30:27 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Design Guidelines]]></category>
		<category><![CDATA[Usability]]></category>

		<guid isPermaLink="false">http://www.peterpixel.nl/writings/?p=459</guid>
		<description><![CDATA[For a long time now Lufthansa has been doing something on their site that I found ingenious every time I saw it: how they presented their fare&#8217;s and dates. It so incredibly simple and yet amazingly efficient. I never bothered to blog about it though, until I saw it pop up on a few other [...]]]></description>
			<content:encoded><![CDATA[<p>For a long time now Lufthansa has been doing something on their site that I found ingenious every time I saw it: how they presented their fare&#8217;s and dates. It so incredibly simple and yet amazingly efficient. I never bothered to blog about it though, until I saw it pop up on a few other sites. </p>
<p>As opposed to showing you a list of dates and prices for departing and returning flights, they put the prices into a grid with the dates as X/Y values, making it a lot easier to find out what date is cheapest to fly. As an added touch, the cheapest day/flight combination was also highlighted. I wondered why I wasn&#8217;t encountering it more often. Recently I did go shopping for some airline tickets and much to my delight I saw Lufthansa&#8217;s design pattern implemented. I did a bit of research and found a few more airlines that were doing it. Below some of the results. </p>
<p><strong>Lufthansa</strong><br />
The original (just to be clear: I am not sure whether Lufthansa used it first, I did however encounter it there for the first time). Lufthansa indicates your current date by highlighting them and adding an arrow. What I love most is the color indication given:<br />
<img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/lufthansa.png" title="Lufthansa" class="alignnone" width="636" height="278" /></p>
<p><strong>Finnair</strong><br />
Here is almost a direct copy, with the difference that the cheapest prices are sadly not highlighted:<br />
<img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/finnair-1.png" title="Finnair" class="alignnone" width="636" /></p>
<p><strong>KLM</strong><br />
The Dutch carrier implements the grid exactly the same, except for the dates, which are outlined as opposed to highlighted with colour:<br />
<img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/klm-1.png" title="KLM" class="alignnone" width="636" /></p>
<p>I guess you can truly appreciate how nice this works if you see the alternative, which wasn&#8217;t hard to find. </p>
<p><strong>Easy Jet</strong><br />
This represenation isn&#8217;t all that bad and the attempt is somewhat reminiscent, but it still doesn&#8217;t give me the nice oversight:<br />
<img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/easy.png" title="Easy Jet" class="alignnone" width="493" height="844" /></p>
<p><strong>Olympic Airlines</strong><br />
Finally, if you look at Olympic&#8217;s offering you might start to wonder who thought that was a good idea, especially compared to the first three examples shown:<br />
<img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/olympic.png" title="Olympic" class="alignnone" width="636" height="531" /></p>
<p>I wasn&#8217;t able to find any examples on US Airlines, so perhaps this is a European development. By all accounts though: I think it is a big improvement. </p>
]]></content:encoded>
			<wfw:commentRss>http://www.peterpixel.nl/writings/great-airline-booking-design-pattern-spreading/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Introduction to Good Usability now in Spanish</title>
		<link>http://www.peterpixel.nl/writings/me-ebook-now-in-spanish-introduccion-a-la-usabilidad/</link>
		<comments>http://www.peterpixel.nl/writings/me-ebook-now-in-spanish-introduccion-a-la-usabilidad/#comments</comments>
		<pubDate>Sun, 14 Jun 2009 20:37:14 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Design Guidelines]]></category>
		<category><![CDATA[Usability]]></category>

		<guid isPermaLink="false">http://www.peterpixel.nl/writings/?p=300</guid>
		<description><![CDATA[This post is long overdue (apologies for that!), but the Virtual Learning Environment Programme (EVA) of the Andalusia Regional Ministry of Innovation, Science and Enterprise and the Technological Network of Andalusia (RETA) in Spain translated my Introduction to Good Usability ebook into Spanish. Needless to say, I am very happy about this (flattered also comes [...]]]></description>
			<content:encoded><![CDATA[<p>This post is long overdue (apologies for that!), but the Virtual Learning Environment Programme (EVA) of the Andalusia Regional Ministry of Innovation, Science and Enterprise and the Technological Network of Andalusia (RETA) in Spain translated my <a href="http://www.peterpixel.nl/writings/introduction-to-good-usability/">Introduction to Good Usability</a> ebook into Spanish. Needless to say, I am very happy about this (flattered also comes to mind!).</p>
<p>I have added a link to the Spanish version on my own <a href="http://peterpixel.nl/work/download.php">download section</a>. For those of you who haven&#8217;t read it, feel free to take a look: <a href="http://peterpixel.nl/work/download.php?download=usability_guide">Introduction to Good Usability (pdf)</a>. </p>
<p><a href="http://www.labportaleva.info/2009/04/01/387/trackback/"><img alt="" src="http://i299.photobucket.com/albums/mm295/peterpixel/portada.jpg" title="Introducci?n a la Usabilidad" class="alignnone" width="300" height="425" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.peterpixel.nl/writings/me-ebook-now-in-spanish-introduccion-a-la-usabilidad/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Introduction to Good Usability Remixed: Soon in Spanish</title>
		<link>http://www.peterpixel.nl/writings/introduction-to-good-usability-soon-in-spanish/</link>
		<comments>http://www.peterpixel.nl/writings/introduction-to-good-usability-soon-in-spanish/#comments</comments>
		<pubDate>Tue, 24 Mar 2009 08:28:17 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[Design Guidelines]]></category>
		<category><![CDATA[Usability]]></category>

		<guid isPermaLink="false">http://www.peterpixel.nl/writings/?p=169</guid>
		<description><![CDATA[A week ago I was contacted by the Virtual Learning Environment Programme (EVA) of the Andalusia Regional Ministry of Innovation, Science and Enterprise and the Technological Network of Andalusia (RETA) in Spain with the request to translate my e-book Introduction to Good Usability into Spanish. Off course I was thrilled about this and less than [...]]]></description>
			<content:encoded><![CDATA[<p>A week ago I was contacted by the Virtual Learning Environment Programme (EVA) of the Andalusia Regional Ministry of Innovation, Science and Enterprise and the Technological Network of Andalusia (RETA) in Spain with the request to translate my e-book <a href="http://www.peterpixel.nl/writings/introduction-to-good-usability/">Introduction to Good Usability</a> into Spanish. Off course I was thrilled about this and less than a week later I received a pdf in my inbox with the Spanish version. </p>
<p>So, I am thrilled to announce that you will be able to get my ebook in Spanish! It is not available for download just yet, but I will make it available as soon as possible. </p>
<p>For more information about EVA you can visit http://www.portaleva.eu<br />
<a href="http://www.portaleva.eu/"><img src="http://www.peterpixel.nl/writings/wp-content/uploads/2009/03/principal.png" alt="principal" title="principal" width="198" height="62" class="alignnone size-full wp-image-173" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.peterpixel.nl/writings/introduction-to-good-usability-soon-in-spanish/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
	</channel>
</rss>
