<?xml version="1.0" encoding="UTF-8"?><!-- generator="wordpress.com" -->
<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/"
	>

<channel>
	<title>design-pattern-libraries &amp;laquo; WordPress.com Tag Feed</title>
	<link>http://en.wordpress.com/tag/design-pattern-libraries/</link>
	<description>Feed of posts on WordPress.com tagged "design-pattern-libraries"</description>
	<pubDate>Sun, 27 Dec 2009 02:23:38 +0000</pubDate>

	<generator>http://en.wordpress.com/tags/</generator>
	<language>en</language>

<item>
<title><![CDATA[Yahoo! Pattern Library is open for all]]></title>
<link>http://userpathways.wordpress.com/2008/04/22/yahoo-pattern-library-is-open-for-all/</link>
<pubDate>Tue, 22 Apr 2008 16:56:39 +0000</pubDate>
<dc:creator>James Kelway</dc:creator>
<guid>http://userpathways.wordpress.com/2008/04/22/yahoo-pattern-library-is-open-for-all/</guid>
<description><![CDATA[All this talk of recession and the web is currently awash with generosity. After my favourable words]]></description>
<content:encoded><![CDATA[<div class='snap_preview'><p>All this talk of recession and the web is currently awash with generosity. After my <a href="http://userpathways.com/2008/01/31/visual-language-10-bbc-layout-guidelines/" target="_blank">favourable words about the BBC</a> who gave us a view of their new design language, Yahoo! have decided to go one better and provide their entire pattern library and developer tools for free.</p>
<table border="0" cellspacing="0" cellpadding="2" width="455">
<tbody>
<tr>
<td width="248" valign="top"><a href="http://developer.yahoo.com/" target="_blank"><img style="border-width:0;" src="http://userpathways.files.wordpress.com/2008/04/yahoo.jpg?w=240&#038;h=116" border="0" alt="yahoo" width="240" height="116" /></a></td>
<td width="12" valign="top"> </td>
<td width="193" valign="top">Very kind and of course there is a monetary side to it but the new site is live <a href="http://developer.yahoo.com/" target="_blank">here</a> and during the day long workshop they gave at the IA Summit 2008 the complete set was given away on a memory key.</td>
</tr>
</tbody>
</table>
<p>Apart from the Visio stencils they also wrapped up the code to go with it, which the developers in my company were very pleased to have a look at and we hope we can use. Very timely considering our current projects.</p>
<p>There were also some really good observations that came from the team &#8211; <a href="http://www.emdezine.com/deziningInteractions/" target="_blank">Erin Malone</a>, <a href="http://xianlandia.com/">Christian Crumlish</a> and <a href="http://xade.com/portfolio/index.html" target="_blank">Lucas Pettinati</a> and a very thorough step-by-step of getting through the process of building, reviewing and rating patterns.</p>
<table border="0" cellspacing="0" cellpadding="2" width="400">
<tbody>
<tr>
<td width="133" valign="top"><a href="http://www.emdezine.com/deziningInteractions/" target="_blank"><img style="border-width:0;" src="http://userpathways.files.wordpress.com/2008/04/26-erinmalone.jpg?w=104&#038;h=104" border="0" alt="26_ErinMalone" width="104" height="104" /></a></td>
<td width="133" valign="top"><a href="http://xianlandia.com/"><img style="border-width:0;" src="http://userpathways.files.wordpress.com/2008/04/24-christiancrumlish.jpg?w=104&#038;h=104" border="0" alt="24_ChristianCrumlish" width="104" height="104" /></a></td>
<td width="133" valign="top"><a href="http://xade.com/portfolio/index.html" target="_blank"><img style="border-width:0;" src="http://userpathways.files.wordpress.com/2008/04/26-lucaspettinati.jpg?w=104&#038;h=104" border="0" alt="26_LucasPettinati" width="104" height="104" /></a></td>
</tr>
<tr>
<td width="133" valign="top">
<h6>Erin Malone</h6>
</td>
<td width="133" valign="top">
<h6>Christian Crumlish</h6>
</td>
<td width="133" valign="top">
<h6>Lucas Pettinati</h6>
</td>
</tr>
</tbody>
</table>
<p>By their own admission this was their first workshop, but to be honest it didn&#8217;t show. Initially they outlined four core needs that design patterns were built to satisfy.</p>
<ol>
<li>
<h6>They need to be living (in an online destination accessible by all). Its important to note not a wiki, which are inherently difficult to navigate, patterns become lost and anyone can edit. Administration rights are important here.</h6>
</li>
<li>
<h6>They need to have developers at their core. they need to be checked and verified with those that will build the pattern code.</h6>
</li>
<li>
<h6>They are there to satisfy the need of having a knowledge centre and to be able to distribute those elements easily amongst a team</h6>
</li>
<li>
<h6>They fulfil the need to promote debate and conversation around important functional elements of a design</h6>
</li>
</ol>
<p>They also stated that patterns were not prescriptive but descriptive, more about choices rather than declarations that must be followed. They are not standards although through repeated use they become a standard treatment, such as a login pattern for instance.</p>
<p>They asserted the fact that there is no one way to design an interaction, failure conditions (when the interaction encountered different condition states) were also held up as useful inclusions into the formulation of a pattern.</p>
<p>Another great point, is that in a business there are different weights of emphasis put upon visual and interactive design. This can often be at the wrong stage in a product&#8217;s life cycle and are two different areas of expertise and skill.</p>
<p>However, because there is code behind this pattern library, patterns are developed to completion. Developers work with the interaction designers very closely and the business can see the benefit of this collaboration.</p>
<p>Erin added a salient truth about working methods&#8230;</p>
<blockquote><p>It&#8217;s all about relationships and if you don&#8217;t have a good relationship then no tool (or methodology) is going to fix that.</p></blockquote>
<p>Patterns do need maintenance and a level of administration and they will evolve over time and change. Both Erin and Christian mentioned the need to &#8216;tickle&#8217; (revisit) the pattern or &#8217;sunset&#8217; it (phase it out due to a new technology making the pattern redundant). Above all the creation and maintenance of a library is like so many design led activities, iterative.</p>
<p>On selling the use of patterns in your business, Erin commented&#8230;</p>
<blockquote><p>People will not turn away from saving time and money. Rapid prototyping enables that.</p></blockquote>
<p><strong>Summary</strong></p>
<p>After the day&#8217;s workshop it was easy to see the strength of patterns. They give the ability to build bridges between disciplines and ensure a collaborative working environment. They also enable a quick turn around in seeing working prototypes &#8211; that is key to the agile methodology that so many businesses are employing. Its actually made me think they are the perfect catalysts for cultural change within an established &#8216;way of doing things&#8217;.</p>
<p>The most important part for me is that these are tools of collaboration and are unbounded by process or methodologies. That can only be a good thing and will help to guarantee these being a solid foundation for the developer community. It will also enable those working on products from different disciplines to be brought closer together.</p>
<p>All in all it was a valuable and enjoyable days session from a group of designers who are dedicated and passionate about their work.</p>
</div>]]></content:encoded>
</item>
<item>
<title><![CDATA[IA Summit 2008 - Yahoo! Pattern Libraries]]></title>
<link>http://userpathways.wordpress.com/2008/04/10/ia-summit-2008-yahoo-pattern-libraries/</link>
<pubDate>Thu, 10 Apr 2008 21:48:52 +0000</pubDate>
<dc:creator>James Kelway</dc:creator>
<guid>http://userpathways.wordpress.com/2008/04/10/ia-summit-2008-yahoo-pattern-libraries/</guid>
<description><![CDATA[Whilst still getting over the jet lag, today marked the start of the IA Summit 2008 for me, here in ]]></description>
<content:encoded><![CDATA[<div class='snap_preview'><p>Whilst still getting over the jet lag, today marked the start of the IA Summit 2008 for me, here in Miami.</p>
<p><a href="http://userpathways.files.wordpress.com/2008/04/miami.jpg"><img style="border-width:0;" src="http://userpathways.files.wordpress.com/2008/04/miami-thumb.jpg?w=333&#038;h=255" border="0" alt="miami" width="333" height="255" /></a></p>
<h6>Downtown Miami</h6>
<p>The first day has been excellent in terms of knowledge sharing from the Yahoo team &#8211; Erin Malone, Christian Crumlish and Lucas Pettinati. They have also designed templates for wireframing using patterns from the YUI library which will be publicly available very soon.</p>
<p>I&#8217;m already really impressed by the community spirit exhibited here and there is a great feeling of togetherness and transparency. I will go into the details of what was said in a later post but its going to be a good five days of insight and inspiration.</p>
<p>Apart from design patterns, there are loads of other talks I will be attending, I will cover a synopsis review and my take on each one in subsequent posts (that will take me into May no doubt)&#8230;</p>
</div>]]></content:encoded>
</item>
<item>
<title><![CDATA[Visual Language 1.0 - BBC layout guidelines]]></title>
<link>http://userpathways.wordpress.com/2008/01/31/visual-language-10-bbc-layout-guidelines/</link>
<pubDate>Thu, 31 Jan 2008 15:57:06 +0000</pubDate>
<dc:creator>James Kelway</dc:creator>
<guid>http://userpathways.wordpress.com/2008/01/31/visual-language-10-bbc-layout-guidelines/</guid>
<description><![CDATA[&nbsp; Any web designer or IA will find this document really interesting and high value. It makes yo]]></description>
<content:encoded><![CDATA[<div class='snap_preview'><table border="0" cellpadding="2" cellspacing="0" width="471">
<tr>
<td valign="top" width="213"><a href="http://www.bbc.co.uk/guidelines/newmedia/desed/visual_language.pdf"><img src="http://userpathways.files.wordpress.com/2008/01/bbc1.jpg?w=205&#038;h=145" style="border:0 none;" alt="bbc" border="0" height="145" width="205" /></a></td>
<td valign="top" width="14">&#160;</td>
<td valign="top" width="242">Any web designer or IA will find this document really interesting and high value. It makes you thankful for institutions like the BBC who readily share their research with the public. This openness and transparency is really admirable and only possible through public funding. Find out the style and layout  properties for the forthcoming BBC web pages <a href="http://www.bbc.co.uk/guidelines/newmedia/desed/visual_language.pdf">here</a>.</td>
</tr>
</table>
<p><a href="http://www.digg.com"><br />
<img src="http://digg.com/img/badges/100x20-digg-button.png" alt="Digg!" height="20" width="100" /><br />
</a></p>
</div>]]></content:encoded>
</item>
<item>
<title><![CDATA[Design Pattern Libraries - cataloguing success]]></title>
<link>http://userpathways.wordpress.com/2008/01/28/design-pattern-libraries-cataloguing-success/</link>
<pubDate>Mon, 28 Jan 2008 14:25:34 +0000</pubDate>
<dc:creator>James Kelway</dc:creator>
<guid>http://userpathways.wordpress.com/2008/01/28/design-pattern-libraries-cataloguing-success/</guid>
<description><![CDATA[These serve so many different elements to a website design. To not use them seems a bad mistake. Ini]]></description>
<content:encoded><![CDATA[<div class='snap_preview'><p>These serve so many different elements to a website design. To not use them seems a bad mistake. Initially they can help overcome issues about how an element may work on the site. More importantly they clarify the purpose of every element that appears on the page and states the user interaction.</p>
<p>The aim of a pattern library is to establish best practice utilizing design artifacts that can be re-purposed for many different sites in completely different markets. To ensure that the recommendations are valid, all site elements will have had user testing, or they follow an established convention.</p>
<p>As the patterns have been user tested the functionality of the design object is sound. Of course the look of the item can be changed but how the user interacts with it will have been checked and the functional aspects decided.</p>
<p>Some notable examples are <a href="http://www.welie.com">www.welie.com</a> and also <a href="http://www.jtidwell.net">www.jtidwell.net</a> The book by Jennifer Tidwell is a fantastic source of reference and inspiration but it must be said that your personal working practice and market will also produce useful patterns.  For a full explanation and where the term derived try Wikipedia&#8217;s <a href="http://en.wikipedia.org/wiki/Interaction_design_pattern">article here</a>.</p>
<p><a href="http://userpathways.files.wordpress.com/2008/01/pagegrab.jpg"><img src="http://userpathways.files.wordpress.com/2008/01/pagegrab-thumb.jpg?w=422&#038;h=568" style="border-width:0;" alt="pagegrab" border="0" height="568" width="422" /></a></p>
<h6>An example of a design pattern</h6>
<p>The context of your work should always be at the core of your pattern libraries. For instance, I work in publishing, therefore news and community features are very important to our website users. If I worked on sites specializing in online sales then a different suite of patterns would be used (shopping cart, online payment areas etc).</p>
<p>Another matter is that patterns evolve constantly over time and it should never be a static document. Include actual examples in the real online world to convey what  they are, what their purpose is and how they should be used. A recognized problem alongside a solution is another way of highlighting the purpose of the pattern.</p>
<p>Pattern libraries also align themselves to the application of design to development. In <a href="http://www.boxesandarrows.com/view/introduction-to-the">Introduction to the Building Blocks</a> by Joe Lamantia this standardized way of working is outlined. The diagram below shows how using agreed design patterns allows developers to plug in the elements &#8211; forming the basis of the <a href="http://en.wikipedia.org/wiki/Service-oriented_architecture">Service Orientated Architecture</a> method of developing for websites.</p>
<p><a href="http://userpathways.files.wordpress.com/2008/01/soa2.jpg"><img src="http://userpathways.files.wordpress.com/2008/01/soa2-thumb.jpg?w=450&#038;h=322" style="border-width:0;" alt="soa2" border="0" height="322" width="450" /></a></p>
<h6>  Basis of SOA can be a result of applied design patterns</h6>
<p>Design patterns enable us to be confident that usability issues have been addressed and that the development can continue without the need for complete redesigns. This widgetising (for want of a better word) enables a flexibility, an agility, beyond the big bang redesigns. Tweaking is a good thing when most of the site operates well, incremental changes allow considered site development.</p>
<p>When parts, and not the whole, are looked at in detail it gives perspective to the problem. Context, content and audience are clarified within these design microcosms. Its a great way to define your design practice too, stating how you come to design solutions by using qualified research as the basis for decisions.</p>
</div>]]></content:encoded>
</item>

</channel>
</rss>
