<?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>Colour Pencil</title>
	<atom:link href="http://www.colourpencil.com/blog/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.colourpencil.com/blog</link>
	<description>Rishi Sinha Design Blog</description>
	<lastBuildDate>Tue, 29 Nov 2011 06:36:35 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Angry Bird Infographic</title>
		<link>http://www.colourpencil.com/blog/2011/11/29/angry-bird-infographic/</link>
		<comments>http://www.colourpencil.com/blog/2011/11/29/angry-bird-infographic/#comments</comments>
		<pubDate>Tue, 29 Nov 2011 06:33:24 +0000</pubDate>
		<dc:creator>Rishi Sinha</dc:creator>
				<category><![CDATA[App News]]></category>
		<category><![CDATA[application]]></category>
		<category><![CDATA[Art]]></category>
		<category><![CDATA[css3]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Game]]></category>
		<category><![CDATA[Inspiration]]></category>
		<category><![CDATA[photography]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?p=1420</guid>
		<description><![CDATA[Created by: Gizmowatch]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p><a href="http://www.gizmowatch.com/wrath-angry-birds-infographics.html"><img src="http://www.instablogsimages.com/1/2011/11/29/angry_birds_infographic_p5qhf.jpg" alt="Angry Birds Infographic" /></a><br />Created by: <a href="http://www.gizmowatch.com/">Gizmowatch</a></p>
<div class="shr-publisher-1420"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/11/29/angry-bird-infographic/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>How to make better iPhone / iPad app for content consuming &#8211; Part 1</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/how-to-make-better-iphone-ipad-app-for-content-consuming-in-short/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/how-to-make-better-iphone-ipad-app-for-content-consuming-in-short/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 15:18:16 +0000</pubDate>
		<dc:creator>Rishi Sinha</dc:creator>
				<category><![CDATA[App News]]></category>
		<category><![CDATA[Article]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Inspiration]]></category>
		<category><![CDATA[Interviews]]></category>
		<category><![CDATA[iPhone]]></category>
		<category><![CDATA[productivity]]></category>
		<category><![CDATA[Project Management]]></category>
		<category><![CDATA[Usability/Accessibility]]></category>
		<category><![CDATA[Utility]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[websites]]></category>
		<category><![CDATA[iPad]]></category>
		<category><![CDATA[iPad app]]></category>
		<category><![CDATA[ipad application]]></category>
		<category><![CDATA[iphone]]></category>
		<category><![CDATA[iphone app]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?p=762</guid>
		<description><![CDATA[Content consuming has become a part of our daily life. We constantly try to fine better apps for content consuming. Different people have different features in mind while they choose application. But common idea is always to be more efficient &#8230; <a href="http://www.colourpencil.com/blog/2011/09/27/how-to-make-better-iphone-ipad-app-for-content-consuming-in-short/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p>Content consuming has become a part of our daily life. We constantly try to fine better apps for content consuming. Different people have different features in mind while they choose application. But common idea is always to be more efficient in reaching out to desirable content.</p>
<p>Recently I got this project of conceptualization/design of an iPhone / iPad app and I am sharing my findings here. I am not going into the detail of process, but discussing the idea of making content consuming app in this part.</p>
<h2>Know your audience</h2>
<p><img class="alignnone" title="Auduance" src="http://farm5.static.flickr.com/4020/4692441948_e18ec10b29.jpg" alt="" width="500" height="375" /><br />
To get to know your audience, you have to be close to them, better be an audience yourself, be in their shoes then you will be in better position to think about the app. So I downloaded different news apps in iPhone and iPad. Best ones and even not so popular ones, to see the differences.</p>
<p>After using them for few days, I started getting to know what the most obvious action would be, for the given options, at any point of time/screen. Parallel to that, from visual point of view I was studying/evaluating the type of color, typography, layout which would enhance the user experience.</p>
<h2>Know their moves</h2>
<p><img class="alignnone" title="Moves" src="http://farm3.static.flickr.com/2117/1817034358_f9d6278934.jpg" alt="" width="500" height="500" /><br />
Using the iPhone / iPad touch gesture references, would help you define what gesture and single or multiple gestures you can give to any action. This part is mostly driven by what users are doing as trend. So most of the gestures you will find is common throughout the applications, go with the flow&#8230;carefully.</p>
<h2>Know what they won&#8217;t miss</h2>
<p><img class="alignnone" title="Obsolete" src="http://farm1.static.flickr.com/112/301665043_0d65edb5e0.jpg" alt="" width="500" height="375" /><br />
After some progress I saw that I have provided almost all features which a standard content consuming app can have. So it was better to review them and take a call on what user actually don&#8217;t need, or can do without. This process is very challenging as your decision could make the app popular. An app with very concise actions would help user to consume content more efficiently, with more speed and without any hassle to remember all the action and features.</p>
<h2>Summary</h2>
<p>I shared my idea of how an app could be conceptualized. In next part I will describe what specification it requires from a content related app point of view.</p>
<p>- Rishi Sinha</p>
<p>&nbsp;</p>
<div class="shr-publisher-762"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/how-to-make-better-iphone-ipad-app-for-content-consuming-in-short/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Friday Fix September 5 – September 9</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/friday-fix-september-5-%e2%80%93-september-9/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/friday-fix-september-5-%e2%80%93-september-9/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 05:55:00 +0000</pubDate>
		<dc:creator>Chad</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[Articles]]></category>
		<category><![CDATA[Friday Fix]]></category>
		<category><![CDATA[Graphic Design]]></category>
		<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[Weekly Round Up]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?guid=18b4fd71dce905b6e33bf6e13356c9cc</guid>
		<description><![CDATA[The Friday Fix is a weekly recap of all things inspiring. We look at new web apps, portfolios, beautiful websites and anything else design related.
Launch Effect

Activeark

Hanging Up The Moon

SF Dok – 360

Sparrow


Patrick McNeil

Andreas Work

A... <a href="http://www.colourpencil.com/blog/2011/09/27/friday-fix-september-5-%e2%80%93-september-9/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p>The Friday Fix is a weekly recap of all things inspiring. We look at new web apps, portfolios, beautiful websites and anything else design related.<span></span></p>
<h2><a href="http://launcheffectapp.com/">Launch Effect</a></h2>
<p><a href="http://launcheffectapp.com/"><img title="Screen Shot 2011-09-08 at 10.04.18 PM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-Shot-2011-09-08-at-10.04.18-PM.png" alt="" width="600" height="369"></a></p>
<h2><a href="http://www.activeark.com/">Activeark</a></h2>
<p><a href="http://www.activeark.com/"><img title="Screen Shot 2011-09-08 at 10.07.22 PM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-Shot-2011-09-08-at-10.07.22-PM.png" alt="" width="600" height="496"></a></p>
<h2><a href="http://www.hangingupthemoon.com/#home">Hanging Up The Moon</a></h2>
<p><a href="http://www.hangingupthemoon.com/#home"><img title="Screen Shot 2011-09-08 at 10.07.15 PM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-Shot-2011-09-08-at-10.07.15-PM.png" alt="" width="600" height="425"></a></p>
<h2><a href="http://www.360langstrasse.sf.tv/page/">SF Dok – 360</a></h2>
<p><a href="http://www.360langstrasse.sf.tv/page/"><img title="Screen Shot 2011-09-08 at 10.06.37 PM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-Shot-2011-09-08-at-10.06.37-PM.png" alt="" width="600" height="352"></a></p>
<h2><a href="http://sparrowmailapp.com/">Sparrow<br />
</a></h2>
<p><a href="http://sparrowmailapp.com/"><img title="Screen Shot 2011-09-08 at 10.06.28 PM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-Shot-2011-09-08-at-10.06.28-PM.png" alt="" width="600" height="363"></a></p>
<h2><a href="http://pmcneil.com/">Patrick McNeil</a></h2>
<p><a href="http://pmcneil.com/"><img title="Screen Shot 2011-09-08 at 10.04.13 PM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-Shot-2011-09-08-at-10.04.13-PM.png" alt="" width="600" height="435"></a></p>
<h2><a href="http://www.andreasworks.com/">Andreas Work</a></h2>
<p><a href="http://www.andreasworks.com/"><img title="Screen Shot 2011-09-08 at 10.04.07 PM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-Shot-2011-09-08-at-10.04.07-PM.png" alt="" width="600" height="504"></a></p>
<h2><a href="http://aaronweyenberg.com/">Aaron Weyenberg</a></h2>
<h2><a href="http://aaronweyenberg.com/"><img title="Screen Shot 2011-09-08 at 10.04.03 PM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-Shot-2011-09-08-at-10.04.03-PM.png" alt="" width="600" height="373"></a><br />
<a href="http://www.redlemonclub.com/9steps/">9 Steps to Being Your Most Powerful Creative Self</a></h2>
<p><a href="http://www.redlemonclub.com/9steps/"><img title="Screen shot 2011-09-09 at 8.34.04 AM" src="http://inspiredology.com/wp-content/uploads/2011/09/Screen-shot-2011-09-09-at-8.34.04-AM.png" alt="" width="600" height="544"></a></p>
<div class="shr-publisher-1314"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/friday-fix-september-5-%e2%80%93-september-9/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>UXI Live 2011—Day 2</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/uxi-live-2011%e2%80%94day-2/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/uxi-live-2011%e2%80%94day-2/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 05:50:00 +0000</pubDate>
		<dc:creator>Martin Polley and Dana Cohen-Baron</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[israel]]></category>
		<category><![CDATA[Observed]]></category>
		<category><![CDATA[Stuff]]></category>
		<category><![CDATA[UX]]></category>
		<category><![CDATA[uxilive]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?guid=79e39f8da5e5dc98859bae44a2253463</guid>
		<description><![CDATA[
Day 2 of UXI Live 2011 was a day of talks in Tel Aviv’s Kfar Maccabiah. Four morning keynotes and one closing keynote were the wholesome bread around the tasty meat of the four-track afternoon talks.
Design Principles: The Philosophy of UX—Whitney... <a href="http://www.colourpencil.com/blog/2011/09/27/uxi-live-2011%e2%80%94day-2/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p><img src="http://johnnyholland.org/wp-content/uploads/uxi-live-day2.jpg" alt="Tel Aviv image -- UXI Live Day 2"></p>
<p>Day 2 of <a href="http://johnnyholland.org/2011/07/11/the-user-experience-of-the-bbc-news/">UXI Live 2011</a> was a day of talks in Tel Aviv’s Kfar Maccabiah. Four morning keynotes and one closing keynote were the wholesome bread around the tasty meat of the four-track afternoon talks.<span></span></p>
<h2>Design Principles: The Philosophy of UX—Whitney Hess</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/whitney_hess_420.jpg" alt="Whitney Hess"></p>
<p>Whitney started out her talk by explaining that UX is establishing a philosophy about how you treat people (just as visual design is establishing a philosophy about making an impact). And just as visual design has principles (contrast, emphasis, variety, balance, and so on), so user experience design has principles.</p>
<p>She went on to lay out her ten principles of UX design. They are in the slides below, so I won’t waste space by repeating them here.</p>
<div style="width:425px"><iframe src="http://reader.googleusercontent.com/reader/embediframe?src=http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=designprinciplesphilopsohyofux-v2-1-110504092232-phpapp02&#038;stripped_title=design-principles-the-philosophy-of-ux&#038;userName=whitneyhess&amp;width=425&amp;height=355%22 width="425" height="355"></iframe></div>
<p>Are these enough? Probably not—each organization and each project needs its own principles to supplement these. She gave some interesting examples, ranging from Charles and Ray Eames to Starbucks, and gave some guidelines for creating your own design principles:</p>
<ul>
<li>Look at what your competitors are doing.</li>
<li>Gather business goals, user needs, and brand attributes.</li>
<li>Brainstorm across functions/capabilities.</li>
<li>Limit your list to ten tops, preferably no more than seven.</li>
<li>Make sure they do not conflict or overlap.</li>
<li>Make them pithy and memorable.</li>
</ul>
<p>She recommends using <a href="http://www.uie.com/articles/creating-design-principles">Jared Spool’s checklist</a> to evaluate your design principles.</p>
<p>OK then. Now you’ve got a set of design principles. When should you use them? According to Whitney, always. But they are especially useful in project kickoff meetings, for prioritizing features, for brainstorming, for stakeholder presentations, and for resolving conflicts.</p>
<h2>User Experience for Websites Designed for Smartphones—Barak Danin</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/barak_danin_420.png" alt="Barak Danin"></p>
<p>Barak gave an insightful and entertaining talk about designing websites for smartphones. He started out by giving some statistics about the changing landscape of Internet use, and in particular the place of smartphones in this landscape. They are getting cheaper all the time (you can get a Chinese Android phone for $80) and the number of people using them is rising commensurately.</p>
<p>He talked about the stereotyped “mobile context” and how it is a mistake to make assumptions about context. (There are usually multiple contexts of use.) He advised looking at what smartphone users are doing right now on your regular site before thinking about building a site for smartphones.</p>
<p>When designing for smartphones, you have to prioritize carefully because of limited screen real estate, and bear in mind the many limitations (for example, no hover, finger size, availability of gestures, platform-specific expectations, etc.).</p>
<p>He finished by showing us Old Navy’s regular and mobile sites, pointing out the mobile site’s flatter hierarchy, lack of ads, store locator prominence, search box location, and link to the full site. There are a number of things here that are becoming conventions and we need to be aware of them when designing such sites.</p>
<h2>How to Make Them Click—Amir Hardoof</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/amir_hardoof_420.png" alt="Amir Hardoof"></p>
<p>How do we get people to do what we want them to do? How do we persuade them to part with their money in return for the product or service that we are offering?</p>
<p>According to Amir Hardoof, it is a process. And there are things we can do to to make it smoother. First off, a confused user will not buy. So we must not offer too many choices. People buy want they <em>want</em>, not what they <em>need</em>. He spoke about AIDA: Attention, Interest, Desire, Action. He referred to a three-stage process:</p>
<ol>
<li>We need to catch their attention. To do this, we first need to figure out <em>what they want</em>.</li>
<li>We need to decide what the <em>one</em> action is that we want them to take (and only offer this one option).</li>
<li>We need to figure out how to lead them emotionally from desire to action.</li>
</ol>
<p>People act emotionally, not rationally. Amir explained that the most important motivating emotions are love, pride, fear, guilt, and greed. And that we need to be asking questions like:</p>
<ul>
<li>What is the user afraid of that will disappear when they click that button?</li>
<li>What guilt can they assuage by clicking?</li>
<li>What can they get for free or save by clicking?</li>
<li>What are others saying? (Success stories)</li>
<li>How many other people are doing it? (Herd effect)</li>
</ul>
<p>People will pay good money if they believe that clicking that “buy” button will eliminate a negative emotion or increase a positive one.</p>
<p>He finished by contrasting two forex sites, <a href="http://www.fxpro.com/">FxPro</a>, which appeals to the rational, and <a href="http://www.etoro.com/">Etoro</a>, which appeals to the emotional.</p>
<h2>The Psychology of Decision-making—Dr. Chaim Shapira</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/chaim_shapira_420.png" alt="Dr. Chaim Shapira"></p>
<p>Dr. Shapira is a brilliant man, a senior lecturer at Tel Aviv University, and an expert on game theory. But above and beyond all this, he is a comedian. As one person put it, he is “a stand up comedian for the intelligentsia”. For a full hour, he regaled us with hilarious stories and anecdotes from the worlds of economics, psychology, and current affairs. The only problem with his talk was that we were too busy laughing to pick out the serious points that he was making. Here are just a few:</p>
<ul>
<li>People tend to trust those that they consider to be “above” them (though this trust is rarely justified).</li>
<li>We ignore events that do not support our existing beliefs and find proof that confirms them in insignificant, unrelated events.</li>
<li>The less people know about an issue, the clearer and more obvious the solutions seems to them.</li>
<li>People are very bad at thinking long term. Ditto for organizations and states (because they are run by, you got it, <em>people</em>).</li>
<li>People are under the illusion that they are in control, even when they are not.</li>
<li>People lack vision.</li>
<li>In negotiation, to be rational when your opponent is not rational is <em>not rational</em>.</li>
<li>People are prone to giving quick answers from intuition <em>without actually thinking</em>.</li>
<li>People often mistake correlation for causality.</li>
<li>The media are as guilty of these as anyone else, and they exacerbate them. They also concentrate on the negative and ignore the positive.</li>
</ul>
<p>What can we take away from this as UXers? Apart from the need to be aware of these traits in ourselves, it’s the importance of keeping an open mind and to be willing to seek and accept advice.</p>
<h2>UX Design for News Sites: Behind the Scenes at the BBC—Tammy Gur</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/tami_gur_420.png" alt="Tammy Gur"></p>
<p>Tammy Gur is a senior creative director at the BBC and is responsible for UX for the <a href="http://www.bbc.co.uk/worldservice/">BBC World Service</a> website, which has 127 million users across the globe, with content in 27 languages and 8 different scripts. The website is predominantly a news site. The challenge is to generate UX for a constantly-changing environment in a generic way that will fit each day’s news. The content is not separate—it is and must be an integral part of the design.</p>
<p>She took us through the recent major redesign of <a href="http://www.bbc.co.uk/mundo/">BBC Mundo</a>, BBC World’s Spanish language site, serving the whole of Latin America (except Brazil), and which has fierce local competition in various different countries. This started with an “understanding phase”, where they gathered new business requirements, performed a deep competitive analysis, interviewed both journalists and users, and established a vision that was consistent with the BBC’s existing goals and values.</p>
<p>From their research, they concluded that the site must be up-to-date, include video, have clear navigation that exposes additional and related content, incorporate improved picture navigation, have an improved layout that allows for easier scanning, and reinforce the brand.</p>
<p>They also carried out a content hierarchy workshop with journalists, which resulted in the site’s structure hierarchy.</p>
<p>The site design had to fit into the same universal grid that all BBC sites use (part of the organizations’ Global Experience Language (GEL), which also includes things like typography). The final homepage consists of a main title, the current top story, rolling news with time stamps, video, in-depth articles (if any), popular articles, and topics. Exactly the same content is available via mobile (mostly not on smartphones in Latin America)—the content areas are ranked by importance, and the mobile rendering is based on this. The design and flows were validated against the needs of research-based personas.</p>
<p>The most important conclusion from this whole process? You must know how the content is written and published. For more, see Tammy’s recent Johnny article, <a href="http://johnnyholland.org/2011/07/11/the-user-experience-of-the-bbc-news/">User Experience and the design of news at BBC World Service</a>.</p>
<h2>Being John Malkovitch: Getting Inside the User’s Head—Ami Rotter</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/ami_rotter_420.png" alt="Ami Rotter"></p>
<p>We don’t have a magic tunnel for getting into John Malkovitch’s head. But according to Ami Rotter, we do have tools like GotoMeeting that let us get into our user’s head, at least to some extent.</p>
<p>He showed us how at MediaMind they have used remote usability testing to test various new features and proposed interface changes. Most UX practitioners will already be familiar with this stuff, but it provided a good primer for the many attendees from other disciplines.</p>
<p>One interesting point that Ami made was that in addition to finding problems that you can then fix, usability testing sometimes generates positive feedback, which is great for team morale.</p>
<h2>Future UX Trends that Will Affect the IT Space—Adina Hagege</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/adina_hagege_420.png" alt="Adina Hagege"></p>
<p>Adina is director of information experience for Windows Server at Microsoft. She distinguished trends from enablers. Enablers are the technology behind the trend. A trend itself is an area where specific growth is taking place that is attracting sustained attention from our target audience. The trends she highlighted are:</p>
<ul>
<li>Gamification—using traditional aspects of gaming to make routine tasks more fun and engaging. (Principles: achievements and goals, competition, ongoing feedback.)</li>
<li>Better together—the power of many people to share and co-create content. (Principles: shared content, simultaneous work, instant answers.)</li>
<li>Power to the person—dynamically adapting a design to the user and not the other way round. (Principles: natural user interfaces, context is king, fun and productivity, identity.)</li>
<li>Anywhere—do anything from any device, anywhere. (Thanks to cloud computing, powerful personal devices, and universal connectivity.)</li>
<li>Insight not information—increasing quantities of information create a need to reduce cognitive load by providing processed and visualized data that can actually be taken in. (Principles: visualizations, decision engines, relevancy sorting.)</li>
<li>Experience economy—people have learned to expect more from their purchases. (Principles: beyond point of sale, genuine interaction, customer care (people, not machines).)</li>
</ul>
<h2>How to Design for Facebook—Oren Shamir</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/oren_shamir_420.jpg" alt="Oren Shamir"></p>
<p>Oren Shamir of McCann Erickson Israel talked about the research they have been doing about user behavior on Facebook. He started by giving us some statistics about Facebook usage patterns. For example, the average user has 130 friends and spends more time looking at pictures than anything else. They only create content once or twice a week. (But beware of averages! They can be misleading.)</p>
<p>Less than 28% of users have liked a brand page. But a small segment of users like lots of brands. Users who do like a brand usually do so to get discounts and coupons and to give feedback.</p>
<p>He went on to explain what companies can do in terms of fan pages and applications. In a fan page, more of the page is taken up by Facebook itself, but you get the wall and five tabs (which, unfortunately, are easy to miss). In an application, you get more screen real estate, but the user needs to authorize it, which is a barrier. And the longer the list of actions that the application needs to be able to do, the fewer people authorize it.</p>
<p>Their research was based on eye-tracking followed by immediate debriefing interviews. Some of the findings:</p>
<ul>
<li>In their feed, people mainly look at the feed itself. For an individual item, they read the text and only glanced briefly at the avatar.</li>
<li>In brand pages, people are very content-driven. People looked at the tabs a lot, but usually because they didn’t understand them. apart from that, they focused mostly on the wall.</li>
<li>Facebook search is terrible. People found the search box just fine, but often ended up on fake brand pages. It is hard to find a brand page and just as difficult to re-find it.</li>
<li>There is a lot of inconsistency between different brand pages.</li>
<li>There are lots of distractions, which makes it hard to complete tasks.</li>
<li>Lots of people ignore the notifications.</li>
</ul>
<p>There are several strategic questions that you need to be asking:</p>
<ul>
<li>Should you have a Facebook fan page, a regular site, or a mini-site?</li>
<li>A tab or an application?</li>
<li>A new page or a tab on the main page?</li>
<li>How are people reaching us?</li>
<li>How does it look on mobile?</li>
</ul>
<p>He finished by giving some specific advice and recommendations:</p>
<ul>
<li>Keep flows short and focused.</li>
<li>Use pictures wisely.</li>
<li>Keep the order of your tabs consistent.</li>
<li>It’s better to have a number of sub-pages than one brand page with lots of tabs.</li>
<li>Give people content that they can share (short content, pictures, videos, etc.).</li>
<li>Be social—respond immediately, look for friends.</li>
<li>Put the value that you provide to the user front and center.</li>
</ul>
<p>Oren finished up by showing us some examples of brands that are doing a good job on Facebook: Coca-Cola, Asos, Starbucks, and Samsung Mobile IL.</p>
<p>For more, see our recent <a href="http://johnnyholland.org/2011/09/05/designing-for-facebook-the-oren-shamir-interview/">interview with Oren</a>.</p>
<h2>The Right Way to Wireframe—Russ Unger</h2>
<p><img src="http://johnnyholland.org/wp-content/uploads/russ_unger_2_240.jpg" alt="Russ Unger"></p>
<p>Russ’s started out by stating that unlike visual designers, we don’t usually show our work (specifically wireframes) to each other, at least not in public. And that this is a bad thing. We all have a lot to learn from each other, even if it’s just “Hey, that looks just like what I make. I guess I don’t suck after all.”</p>
<p>He went on to talk about a challenge that he took on with three other designers: Fred Beecher, Todd Zaki Warfel, and Will Evans. They took a good-cause site, <a href="http://lend4health.com/">Lend4health.com</a>, which helps people lend money to people who need it for autism-related medical expenses, and which was being run with no budget and no design help, and designed the flow for making a loan. Each designer based his design on the same personas (researched and created by Gabby Hon) and found a visual designer to help him.</p>
<div style="width:425px"><iframe src="http://reader.googleusercontent.com/reader/embediframe?src=http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=rwtwuxilive-key-110908063650-phpapp02&#038;stripped_title=ux-israel-live-the-right-way-to-wireframe&#038;userName=runger&amp;width=425&amp;height=355%22 width="425" height="355"></iframe></div>
<p>Each one selected a different tool to work with, and got to work figuring out the IA, creating a sitemap, sketching, wireframing, and then handing over to the visual designer to work their magic. They were not allowed to talk about the challenge until they were finished. Three of the videos that the designers created to show their process are available <a href="http://www.youtube.com/view_play_list?p=A4B7C12F8F866677">here</a>.</p>
<p>Russ ended with some important principles:</p>
<ul>
<li>Sketching is thinking.</li>
<li>Critique is essential.</li>
<li>The best tool is the one you know.</li>
</ul>
<p>See you next year!</p>
<p>Related posts:
<ol>
<li><a href="http://johnnyholland.org/2011/09/09/uxi-live-2011%E2%80%94day-1/" rel="bookmark" title="Permanent Link: UXI Live 2011—Day 1">UXI Live 2011—Day 1</a> <small> Day 1 of UXI Live 2011 was a day&#8230;</small></li>
<li><a href="http://johnnyholland.org/2011/05/27/ux-book-reviews-may-2011/" rel="bookmark" title="Permanent Link: UX Book Reviews: May 2011">UX Book Reviews: May 2011</a> <small> This month we review books about ubiquitous computing design&#8230;</small></li>
<li><a href="http://johnnyholland.org/2010/12/24/happy-holidays-and-a-creative-2011/" rel="bookmark" title="Permanent Link: Happy Holidays and a Creative 2011">Happy Holidays and a Creative 2011</a> <small> &#8230;</small></li>
</ol>
<p>Related posts brought to you by <a href="http://mitcho.com/code/yarpp/">Yet Another Related Posts Plugin</a>.</p>
<p><img src="http://feeds.feedburner.com/~r/JohnnyHolland/~4/sBb0XkwwE5o" height="1" width="1"></p>
<div class="shr-publisher-1304"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/uxi-live-2011%e2%80%94day-2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>150+ Free, Vintage Vector, Medieval Heraldry Graphics</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/150-free-vintage-vector-medieval-heraldry-graphics/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/150-free-vintage-vector-medieval-heraldry-graphics/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 05:45:00 +0000</pubDate>
		<dc:creator>Sean Hodge</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[freebies]]></category>
		<category><![CDATA[Web Roundups]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?guid=4dc88ae2f8bf964c288646d64cb611d5</guid>
		<description><![CDATA[It’s free vector graphics time, my favorite hour of the day! We’ve roundup up a truckload of heraldry graphics available in EPS, SVG, AI and other vector formats for free download. These medieval packs are composed of emblems, crests, shields, drag... <a href="http://www.colourpencil.com/blog/2011/09/27/150-free-vintage-vector-medieval-heraldry-graphics/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p><iframe src="http://feedads.g.doubleclick.net/~ah/f/bct3pma9iispoltmu5a84bhppk/300/250?ca=1&amp;fh=280#http://vector.tutsplus.com/articles/web-roundups/free-heraldry-graphics/" width="100%" height="280" frameborder="0" scrolling="no" marginwidth="0" marginheight="0"></iframe></p>
<p><a href="http://rss.buysellads.com/click.php?z=1260583&amp;k=505f2b5da55d79b1b4a88b2d82286808&amp;a=4884&amp;c=201908364"><img src="http://rss.buysellads.com/img.php?z=1260583&amp;k=505f2b5da55d79b1b4a88b2d82286808&amp;a=4884&amp;c=201908364" border="0" alt=""></a>
<p>It’s free vector graphics time, my favorite hour of the day! We’ve roundup up a truckload of heraldry graphics available in EPS, SVG, AI and other vector formats for free download. These medieval packs are composed of emblems, crests, shields, dragons, knights, helms, armor, swords, flourishes, banners, and all sorts of vintage design elements. Whether you’re designing a stylish brochure for your favorite client or your personal portfolio website, these graphics could add the perfect stylish touch your project is needing.</p>
</p>
<p><em>Many of these icons are available for commercial use, as well as personal use. Some may have stronger restrictions though, so as always check the usage rights before using.</em></p>
<hr />
<h2>Free Medieval Heraldry Graphics for Vector Designers</h2>
<h3><a href="http://vector.tutsplus.com/freebies/vectors/heraldry-fashion-tshirt-designs/">Heraldry Fashion T-shirt Designs</a></h3>
<p>This pack of vintage heraldry vectors is available as a free download. It’s located here on Vectortuts+ and designed by Artamp. The medieval graphics are available in AI and EPS formats, perfect for your next t-shirt design.</p>
<div><a href="http://vector.tutsplus.com/freebies/vectors/heraldry-fashion-tshirt-designs/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/1-heraldry_fashion.jpg" alt="1-heraldry_fashion" width="600" height="493"></a></div>
<h3><a href="http://www.gomediazine.com/freebies/free-vectors-heraldry/">Free Vectors: Heraldry</a></h3>
<p>Jeff Finley of GoMedia shows off his sharp illustrations skills with this one off vector freebie. It’s a classic clawed/winged animal figure. I think it’s a medieval griffin. This free vintage download is available in vector AI format.</p>
<div><a href="http://www.gomediazine.com/freebies/free-vectors-heraldry/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/2-free-heraldry.jpg" alt="2-free-heraldry" width="600" height="464"></a></div>
<h3><a href="http://all-silhouettes.com/heraldic-vector-clipart/">Heraldic Vector Clipart</a></h3>
<p>This massive pack of free vintage vector clipart is available from all-silhouettes.com in CSH and EPS format. There are loads of medieval graphics in this heraldry themed set, filled with ribbons, heraldic animals (eagle, dragon, griffin, lion, horse, knights), flourishes, crowns, wings, floral curves, swords and other weapon, coat of arms, and more. Use them in your design work to add a classic feel.</p>
<div><a href="http://all-silhouettes.com/heraldic-vector-clipart/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/3-heraldic-elements.jpg" alt="3-heraldic-elements" width="600" height="369"></a></div>
<h3><a href="http://vector4free.com/vectors/id/51">Heraldic Vector</a></h3>
<p>Mr. Tentacleguy put together a massive set of 70 free vector heraldic objects and graphics. They are available in EPS and SVG format for free vector download. These vintage vector graphics are great for using in print design and for showing their hand crafted origin.</p>
<div><a href="http://vector4free.com/vectors/id/51"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/4-Heraldic.jpg" alt="4-Heraldic" width="600" height="1798"></a></div>
<h3><a href="http://vector4free.com/vectors/id/337">Sketchy Heraldry</a></h3>
<p>Stock Graphic Designs drew this sketchy heraldry crest composed with all the classic shapes: night’s helm, flourishes, shield, banner, and lions. Grab this free vector medieval graphic pack that has a versatile EPS file inside.</p>
<div><a href="http://vector4free.com/vectors/id/337"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/5-Sketchy_Heraldry.jpg" alt="5-Sketchy_Heraldry" width="600" height="422"></a></div>
<h3><a href="http://www.vecteezy.com/Heraldry/23782-Free-vector-vintage-emblem">Free Vector Vintage Emblem</a></h3>
<p>This Medieval Heraldry graphic pack has two lions, a detailed shield, wings, crown, and a retro grunge style put together into an emblem. Want to add a dirty classic feel to your next design, then grab this free vector download. The pack contains a versatile EPS file designed by Designious.</p>
<div><a href="http://www.vecteezy.com/Heraldry/23782-Free-vector-vintage-emblem"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/6-emblem.jpg" alt="6-emblem" width="600" height="600"></a></div>
<h3><a href="http://www.snap2objects.com/2010/02/22/4-heraldic-vector-shields-pack-01/">Heraldic Vector Shields Pack</a></h3>
<p>Snap2objects.com vectorized these emblem drawings for the pure love of heraldry. The detail is maintained in this free vector download, which consists of four vintage designs with EPS and SVG emblems. As with the rest of these graphics presented in this article, these are great to use on t-shirts, websites and all sorts of designs.</p>
<div><a href="http://www.snap2objects.com/2010/02/22/4-heraldic-vector-shields-pack-01/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/7-Heraldic-Shields-Pack.jpg" alt="7-Heraldic-Shields-Pack" width="600" height="435"></a></div>
<h3><a href="http://qvectors.net/vector-illustration/heraldry-vector/">Modern Style Heraldry Vector</a></h3>
<p>Grab this trendy heraldry graphic created by Echoenduring.com. It combines a classic medieval feel with a modern style, perfect for adding a flair of classic design to your next quality design project. This free vector download graphic has a versatile AI file inside.</p>
<div><a href="http://qvectors.net/vector-illustration/heraldry-vector/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/8_heraldry_vector.jpg" alt="8_heraldry_vector" width="600" height="600"></a></div>
<h3><a href="http://123freevectors.com/eagle-oldscans-shield-free-vector/">Classic Heraldry Designs</a></h3>
<p>These old heraldry drawings were scanned in by Nenoblog and vectorized. This set is filled with griffins, dragons, flourishes and more. This free vintage vector clipart pack is available as an EPS download file.</p>
<div><a href="http://123freevectors.com/eagle-oldscans-shield-free-vector/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/9-oldScans.jpg" alt="9-oldScans" width="600" height="640"></a></div>
<h3><a href="http://123freevectors.com/medieval_vectors-free-vector">Classic Heraldry Variety Pack</a></h3>
<p>Quite a bit of diversity in this free vector download pack. There are emblems, swords, crowns, shields, wings, dragons, and even a rogue unicorn. This set is put together by caponehun.deviantart and available in EPS format. Grab these fourteen free clipart medieval graphics now.</p>
<div><a href="http://123freevectors.com/medieval_vectors-free-vector"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/10_heraldry_medieval_vectors-free-vector.jpg" alt="10_heraldry_medieval_vectors-free-vector" width="600" height="294"></a></div>
<h3><a href="http://123freevectors.com/abstract-crowns-shield-star-stripes-wings-free-vector/">Heraldic Shield Emblems</a></h3>
<p>These vector shield designs by DragonArt combine a pop feel with medieval graphic elements. The free clipart download is available in EPS and SVG formats. The emblems have a tattoo look combined with modern gradients, stars, shields, and a crown.</p>
<div><a href="http://123freevectors.com/abstract-crowns-shield-star-stripes-wings-free-vector/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/11-Shield-Design.png" alt="11-Shield-Design" width="600" height="600"></a></div>
<h3><a href="http://www.vectoropenstock.com/529-Heraldry-and-Flourishes-vector">Heraldry and Flourishes</a></h3>
<p>This free heraldry vector download set is drawn by Ars Grafik. It has detailed medieval frames, emblems, flourishes, and various vintage design elements. Grab the download that contains a free AI file.</p>
<div><a href="http://www.vectoropenstock.com/529-Heraldry-and-Flourishes-vector"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/12-vector-heraldry.png" alt="12-vector-heraldry" width="600" height="451"></a></div>
<h3><a href="http://www.vectoropenstock.com/1801-Shield-and-wing-free-vector-vector">Shield and Wing Free Vector Graphics</a></h3>
<p>This pack is filled with a stylish mix of popular design elements and heraldic graphics. Benblogged designed this set. There are classic shields, wings, flourishes, griffins, circular elements, dripped paint splatters, and a loan stag. This free clipart graphic file is available as an EPS download.</p>
<div><a href="http://www.vectoropenstock.com/1801-Shield-and-wing-free-vector-vector"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/13-benblogged_wings.jpg" alt="13-benblogged_wings" width="600" height="776"></a></div>
<h3><a href="http://www.vectoropenstock.com/569-Heraldry-Vector-Art-vector">Heraldry Vector Art</a></h3>
<p>These hand-drawn crests and crest elements are just what you need to perfect your next apparel project. This vector drawing from Enigma Designs is filled with detailed unicorns, crown, flourishes, and various medieval elements. Grab this set of heraldry graphics as a free AI file.</p>
<div><a href="http://www.vectoropenstock.com/569-Heraldry-Vector-Art-vector"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/14-HorseCrest.jpg" alt="14-HorseCrest" width="600" height="572"></a></div>
<h3><a href="http://www.vintagevectors.com/animals/medieval-knight-on-horseback-in-armor/">Medieval Knight on Horseback in Armor</a></h3>
<p>Vintagevectors.com converted this old illustration into a vector EPS file. This vintage medieval illustration is available as a free vector download. Use this gallant graphic element for your next design. </p>
<div><a href="http://www.vintagevectors.com/animals/medieval-knight-on-horseback-in-armor/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/15-knight-on-horse.jpg" alt="15-knight-on-horse" width="600"></a></div>
<h3><a href="http://www.vintagevectors.com/decorative/medieval-vector-armor-weapons-decorative-graphic/">Medieval Vector: Armor &amp; Weapons Decorative Graphic</a></h3>
<p>This pile of medieval armor and weapons is made from a very old, very cool engraving. Vintagevectors.com scanned this in and vectorized it, and did a really clean job of it. This wonderful vintage illustration is full of detail. Download this free vector EPS file today.</p>
<div><a href="http://www.vintagevectors.com/decorative/medieval-vector-armor-weapons-decorative-graphic/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/16-Medieval-weapons-collage.jpg" alt="16-Medieval-weapons-collage" width="600"></a></div>
<h3><a href="http://www.vintagevectors.com/decorative/heraldry-crest-emblem-with-crown-trident-cornucopia-and-cross/">Heraldry Crest Emblem with Crown, Trident, Cornucopia and Cross</a></h3>
<p>This medieval heraldry vector crest emblem features a trident, a cornucopia of fruits and wheat, a large cross in the middle of an oval-shaped shield and a castle-like crown on the top. This EPS graphic was vectorized by Vintagevectors.com.</p>
<div><a href="http://www.vintagevectors.com/decorative/heraldry-crest-emblem-with-crown-trident-cornucopia-and-cross/"><img src="http://dsmy2muqb7t4m.cloudfront.net/articles/2011/article-free-vector-heraldry-graphics/17-heraldry-crest.jpg" alt="17-heraldry-crest" width="600" height="613"></a></div>
<hr />
<h2>Additional Heraldic Graphic Resources on Vectortuts+</h2>
<ul>
<li><a href="http://vector.tutsplus.com/articles/news/create-a-classic-vector-crest-logo-vector-plus-tutorial/">Create a Classic Vector Crest Logo – Vector Premium Tutorial</a></li>
<li><a href="http://vector.tutsplus.com/tutorials/designing/how-to-design-a-classic-heraldic-figure/">How to Design a Classic Heraldic Figure </a></li>
<li><a href="http://vector.tutsplus.com/articles/web-roundups/illustrator-patterns-for-vintage-design/">Free Vector Downloads: 50+ Illustrator Patterns for Vintage Design</a></li>
<li><a href="http://vector.tutsplus.com/articles/news/new-vector-plus-pack-animal-heraldry/">New Vector Premium Pack – Animal Heraldry </a></li>
</ul>
<div>
<a href="http://feeds.feedburner.com/~ff/vectortuts?a=hM3MZg4iPUo:H2nt5zUwP5M:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/vectortuts?d=yIl2AUoC8zA" border="0"></a> <a href="http://feeds.feedburner.com/~ff/vectortuts?a=hM3MZg4iPUo:H2nt5zUwP5M:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/vectortuts?i=hM3MZg4iPUo:H2nt5zUwP5M:D7DqB2pKExk" border="0"></a> <a href="http://feeds.feedburner.com/~ff/vectortuts?a=hM3MZg4iPUo:H2nt5zUwP5M:F7zBnMyn0Lo"><img src="http://feeds.feedburner.com/~ff/vectortuts?i=hM3MZg4iPUo:H2nt5zUwP5M:F7zBnMyn0Lo" border="0"></a> <a href="http://feeds.feedburner.com/~ff/vectortuts?a=hM3MZg4iPUo:H2nt5zUwP5M:V_sGLiPBpWU"><img src="http://feeds.feedburner.com/~ff/vectortuts?i=hM3MZg4iPUo:H2nt5zUwP5M:V_sGLiPBpWU" border="0"></a> <a href="http://feeds.feedburner.com/~ff/vectortuts?a=hM3MZg4iPUo:H2nt5zUwP5M:gIN9vFwOqvQ"><img src="http://feeds.feedburner.com/~ff/vectortuts?i=hM3MZg4iPUo:H2nt5zUwP5M:gIN9vFwOqvQ" border="0"></a>
</div>
<p><img src="http://feeds.feedburner.com/~r/vectortuts/~4/hM3MZg4iPUo" height="1" width="1"></p>
<div class="shr-publisher-1331"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/150-free-vintage-vector-medieval-heraldry-graphics/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Weekly Design News – Resources, Tutorials and Freebies (N.104)</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/weekly-design-news-%e2%80%93-resources-tutorials-and-freebies-n-104/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/weekly-design-news-%e2%80%93-resources-tutorials-and-freebies-n-104/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 05:40:00 +0000</pubDate>
		<dc:creator>Paul Andrew</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[Icons]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[app]]></category>
		<category><![CDATA[book]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[dev]]></category>
		<category><![CDATA[graphic]]></category>
		<category><![CDATA[icon]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[mobile]]></category>
		<category><![CDATA[resource]]></category>
		<category><![CDATA[Resources]]></category>
		<category><![CDATA[template]]></category>
		<category><![CDATA[theme]]></category>
		<category><![CDATA[tutorial]]></category>
		<category><![CDATA[twitter]]></category>
		<category><![CDATA[video]]></category>
		<category><![CDATA[Weekly News]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?guid=552065344581daed98d88d6807ca52c4</guid>
		<description><![CDATA[Advertise here with BSAThis is our weekly column were we share our favorite design related articles, resources and cool tidbits from the past week. Enjoy :)If you would like to receive our daily updates you can follow us on Twitter, on Facebook or by s... <a href="http://www.colourpencil.com/blog/2011/09/27/weekly-design-news-%e2%80%93-resources-tutorials-and-freebies-n-104/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p><a href="http://rss.buysellads.com/click.php?z=1259958&amp;k=53ef29bf69caaf7b9711bf01cd3ee13b&amp;a=16039&amp;c=1808699988"><img src="http://rss.buysellads.com/img.php?z=1259958&amp;k=53ef29bf69caaf7b9711bf01cd3ee13b&amp;a=16039&amp;c=1808699988" border="0" alt=""></a></p>
<p><a href="http://buysellads.com/buy/sitedetails/pubkey/53ef29bf69caaf7b9711bf01cd3ee13b/zone/1259958">Advertise here with BSA</a></p>
<p>
<p>This is our weekly column were we share our favorite design related articles, resources and cool tidbits from the past week. Enjoy <img src='http://www.colourpencil.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p>If you would like to receive our daily updates you can follow us on <a href="http://twitter.com/speckyboy">Twitter</a>, on <a href="http://www.facebook.com/pages/Speckyboy-Design-Magazine/140568253177">Facebook</a> or by subscribing to our <a href="http://speckyboy.com/feed">RSS feed</a>.<span></span></p>
<h2><a href="http://codevisually.com/">Our New Site: CodeVisually – Web Developer Tools &amp; Resources</a></h2>
<p><a href="http://codevisually.com/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_01.jpg" alt="Our New Site: CodeVisually - Web Developer Tools &amp; Resources"></a></p>
<h2><a href="http://perishablepress.com/code-snippets/">Huge Collection of Code Snippets: HTAccess, PHP, WordPress, jQuery, HTML, CSS</a></h2>
<p><a href="http://perishablepress.com/code-snippets/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_02.jpg" alt="Huge Collection of Code Snippets: HTAccess, PHP, WordPress, jQuery, HTML, CSS"></a></p>
<h2><a href="http://www.webdesignerdepot.com/2011/09/recycling-and-animating-icons-with-css/">Recycling and animating icons with CSS</a></h2>
<p><a href="http://www.webdesignerdepot.com/2011/09/recycling-and-animating-icons-with-css/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_03.jpg" alt="Recycling and animating icons with CSS"></a></p>
<h2><a href="http://mobilehtml5.org/">Mobile HTML5 – compatibility tables for mobile devices</a></h2>
<p><a href="http://mobilehtml5.org/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_04.jpg" alt="Mobile HTML5 - compatibility tables for mobile devices"></a></p>
<h2><a href="http://square.github.com/cube/">Cube – Open-source system for visualizing time series data</a></h2>
<p><a href="http://square.github.com/cube/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_05.jpg" alt="Cube - Open-source system for visualizing time series data"></a></p>
<h2><a href="http://www.kendoui.com/">Kendo UI – A HTML5, CSS3, and JS framework for modern HTML UI</a></h2>
<p><a href="http://www.kendoui.com/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_06.jpg" alt="Kendo UI - A HTML5, CSS3, and JS framework for modern HTML UI"></a></p>
<h2><a href="http://iosframeworks.com/">iOS Frameworks – Curated catalog of iOS frameworks and classes for the pragmatic iOS developer</a></h2>
<p><a href="http://iosframeworks.com/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_07.jpg" alt="iOS Frameworks – Curated catalog of iOS frameworks and classes for the pragmatic iOS developer"></a></p>
<h2><a href="http://line25.com/tutorials/how-to-create-a-simple-wordpress-blog-theme">How To Create a Simple WordPress Blog Theme</a></h2>
<p><a href="http://line25.com/tutorials/how-to-create-a-simple-wordpress-blog-theme"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_08.jpg" alt="How To Create a Simple WordPress Blog Theme"></a></p>
<h2><a href="http://iosboilerplate.com/">iOS Boilerplate – A base template for iOS apps</a></h2>
<p><a href="http://iosboilerplate.com/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_09.jpg" alt="iOS Boilerplate - A base template for iOS apps"></a></p>
<h2><a href="http://fructivity.com/">Color Picker Pro – An easy to use color detection tool for developers and designers</a></h2>
<p><a href="http://fructivity.com/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_10.jpg" alt="Color Picker Pro - An easy to use color detection tool for developers and designers"></a></p>
<h2><a href="http://www.muham.co.uk/">Soundsgood – Free Video Blogging WordPress Theme</a></h2>
<p><a href="http://www.muham.co.uk/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_11.jpg" alt="Soundsgood - Free Video Blogging WordPress Theme"></a></p>
<h2><a href="http://www.defaulticon.com/">DefaultIcon v.2 (653 Icons)</a></h2>
<p><a href="http://www.defaulticon.com/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_12.jpg" alt="DefaultIcon v.2 (653 Icons)"></a></p>
<h2><a href="http://www.smashingmagazine.com/2011/09/13/freebie-facebook-fan-page-gui-psd/">Facebook Fan Page GUI PSD</a></h2>
<p><a href="http://www.smashingmagazine.com/2011/09/13/freebie-facebook-fan-page-gui-psd/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_13.jpg" alt="Facebook Fan Page GUI PSD"></a></p>
<h2><a href="http://dribbble.com/shots/257587-Free-psd-Apple-Glyphs">Free PSD Apple Glyphs</a></h2>
<p><a href="http://dribbble.com/shots/257587-Free-psd-Apple-Glyphs"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_14.jpg" alt="Free PSD Apple Glyphs"></a></p>
<h2><a href="http://blog.buysellads.com/2011/09/anatomy-of-the-perfect-banner-ad/">Anatomy of the Perfect Banner Ad (Infographic)</a></h2>
<p><a href="http://blog.buysellads.com/2011/09/anatomy-of-the-perfect-banner-ad/"><img src="http://speckyboy.com/wp-content/uploads/2011/09/desi_news1_15.jpg" alt="Anatomy of the Perfect Banner Ad Infographic"></a></p>
<h2>Previous Weekly Design News…</h2>
<p><a href="http://speckyboy.com/category/twitter-news/"><strong>Design News Roundup Archives →</strong></a></p>
<p>
<p><a href="http://rss.buysellads.com/click.php?z=1259961&amp;k=53ef29bf69caaf7b9711bf01cd3ee13b&amp;a=16039&amp;c=1793833781"><img src="http://rss.buysellads.com/img.php?z=1259961&amp;k=53ef29bf69caaf7b9711bf01cd3ee13b&amp;a=16039&amp;c=1793833781" border="0" alt=""></a></p>
<p><a href="http://buysellads.com/buy/sitedetails/pubkey/53ef29bf69caaf7b9711bf01cd3ee13b/zone/1259961">Advertise here with BSA</a></p>
<div>
<a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=qWBWZYQum0Q:gejBw50oaIw:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?d=yIl2AUoC8zA" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=qWBWZYQum0Q:gejBw50oaIw:-BTjWOF_DHI"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?i=qWBWZYQum0Q:gejBw50oaIw:-BTjWOF_DHI" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=qWBWZYQum0Q:gejBw50oaIw:F7zBnMyn0Lo"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?i=qWBWZYQum0Q:gejBw50oaIw:F7zBnMyn0Lo" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=qWBWZYQum0Q:gejBw50oaIw:V_sGLiPBpWU"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?i=qWBWZYQum0Q:gejBw50oaIw:V_sGLiPBpWU" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=qWBWZYQum0Q:gejBw50oaIw:qj6IDK7rITs"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?d=qj6IDK7rITs" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=qWBWZYQum0Q:gejBw50oaIw:gIN9vFwOqvQ"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?i=qWBWZYQum0Q:gejBw50oaIw:gIN9vFwOqvQ" border="0"></a>
</div>
<p><img src="http://feeds.feedburner.com/~r/speckboy-design-magazine/~4/qWBWZYQum0Q" height="1" width="1"></p>
<div class="shr-publisher-1332"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/weekly-design-news-%e2%80%93-resources-tutorials-and-freebies-n-104/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>42 Awesome Single Page Portfolio Websites</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/42-awesome-single-page-portfolio-websites/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/42-awesome-single-page-portfolio-websites/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 05:35:00 +0000</pubDate>
		<dc:creator>brantwilson</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Inspiration]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?guid=ec5d24fb881e8afbb5efaa1ee8c88299</guid>
		<description><![CDATA[
				Advertise here with BSAToday we have a collection of single page portfolio websites. Enjoy!!
designembraced


jamesgarner

madebygrave

lenineon

ampersandrew

couchkumaras

mbartlett

ibsensfabrikker

danielmart

alexmalyukov

colorfulvisuals

we... <a href="http://www.colourpencil.com/blog/2011/09/27/42-awesome-single-page-portfolio-websites/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p><a href="http://rss.buysellads.com/click.php?z=1264761&amp;k=bb78eac5744533b69852b62261051c57&amp;a=11860&amp;c=1547687415"><br />
				<img src="http://rss.buysellads.com/img.php?z=1264761&amp;k=bb78eac5744533b69852b62261051c57&amp;a=11860&amp;c=1547687415" border="0" alt=""></a></p>
<p><a href="http://buysellads.com/buy/sitedetails/pubkey/bb78eac5744533b69852b62261051c57/zone/1264761">Advertise here with BSA</a></p>
<p>
<p>Today we have a collection of single page portfolio websites. Enjoy!!</p>
<p><a href="http://www.designembraced.com/">designembraced</a><br />
<a href="http://www.designembraced.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/19.jpg" alt="" width="600" height="330"></a></p>
<p><span></span></p>
<p><a href="http://www.jamesgarner.co.uk/">jamesgarner</a><br />
<a href="http://www.jamesgarner.co.uk/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/2.jpg" alt="" width="600" height="349"></a></p>
<p><a href="http://madebygrave.com/">madebygrave</a><br />
<a href="http://madebygrave.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/310.jpg" alt="" width="600" height="303"></a></p>
<p><a href="http://www.lenineon.com/">lenineon</a><br />
<a href="http://www.lenineon.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/42.jpg" alt="" width="600" height="352"></a></p>
<p><a href="http://ampersandrew.com/">ampersandrew</a><br />
<a href="http://ampersandrew.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/51.jpg" alt="" width="600" height="365"></a></p>
<p><a href="http://couchkumaras.com/">couchkumaras</a><br />
<a href="http://couchkumaras.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/61.jpg" alt="" width="600" height="387"></a></p>
<p><a href="http://mbartlett.me/">mbartlett</a><br />
<a href="http://mbartlett.me/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/71.jpg" alt="" width="600" height="402"></a></p>
<p><a href="http://www.ibsensfabrikker.dk/">ibsensfabrikker</a><br />
<a href="http://www.ibsensfabrikker.dk/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/81.jpg" alt="" width="600" height="330"></a></p>
<p><a href="http://danielmart.in/">danielmart</a><br />
<a href="http://danielmart.in/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/91.jpg" alt="" width="600" height="394"></a></p>
<p><a href="http://www.alexmalyukov.com/">alexmalyukov</a><br />
<a href="http://www.alexmalyukov.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/101.jpg" alt="" width="600" height="360"></a></p>
<p><a href="http://www.colorfulvisuals.com/">colorfulvisuals</a><br />
<a href="http://www.colorfulvisuals.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/111.jpg" alt="" width="600" height="407"></a></p>
<p><a href="http://www.werbungrockt.de/">werbungrockt</a><br />
<a href="http://www.werbungrockt.de/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/121.jpg" alt="" width="600" height="385"></a></p>
<p><a href="http://www.marklawrencedesign.com/">marklawrencedesign</a><br />
<a href="http://www.marklawrencedesign.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/131.jpg" alt="" width="600" height="337"></a></p>
<p><a href="http://teamviget.com/">teamviget</a><br />
<a href="http://teamviget.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/141.jpg" alt="" width="600" height="299"></a></p>
<p><a href="http://www.davidecolla.com/">davidecolla</a><br />
<a href="http://www.davidecolla.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/151.jpg" alt="" width="600" height="367"></a></p>
<p><a href="http://www.epipheostudios.com/">epipheostudios</a><br />
<a href="http://www.epipheostudios.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/161.jpg" alt="" width="600" height="342"></a></p>
<p><a href="http://www.north2.net/">north2</a><br />
<a href="http://www.north2.net/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/171.jpg" alt="" width="600" height="405"></a></p>
<p><a href="http://nitnat.de/">nitnat</a><br />
<a href="http://nitnat.de/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/181.jpg" alt="" width="600" height="352"></a></p>
<p><a href="http://jonphillips.ca/">jonphillips</a><br />
<a href="http://jonphillips.ca/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/191.jpg" alt="" width="600" height="351"></a></p>
<p><a href="http://www.irwinmabini.com/">irwinmabini</a><br />
<a href="http://www.irwinmabini.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/201.jpg" alt="" width="600" height="363"></a></p>
<p><a href="http://www.reverenddanger.com/">reverenddanger</a><br />
<a href="http://www.reverenddanger.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/211.jpg" alt="" width="600" height="374"></a></p>
<p><a href="http://thisismarcela.com/">thisismarcela</a><br />
<a href="http://thisismarcela.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/221.jpg" alt="" width="600" height="374"></a></p>
<p><a href="http://www.barrettnsmith.com/">barrettnsmith</a><br />
<a href="http://www.barrettnsmith.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/231.jpg" alt="" width="600" height="354"></a></p>
<p><a href="http://astronautdesign.com/">astronautdesign</a><br />
<a href="http://astronautdesign.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/241.jpg" alt="" width="600" height="418"></a></p>
<p><a href="http://jdcouncil.com/">jdcouncil</a><br />
<a href="http://jdcouncil.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/251.jpg" alt="" width="600" height="351"></a></p>
<p><a href="http://www.workdiary.de/">workdiary</a><br />
<a href="http://www.workdiary.de/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/261.jpg" alt="" width="600" height="337"></a></p>
<p><a href="http://deaxon.com/">deaxon</a><br />
<a href="http://deaxon.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/271.jpg" alt="" width="600" height="473"></a></p>
<p><a href="http://www.mihaibalea.info/">mihaibalea</a><br />
<a href="http://www.mihaibalea.info/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/281.jpg" alt="" width="600" height="357"></a></p>
<p><a href="http://www.sid05.com/">sid05</a><br />
<a href="http://www.sid05.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/291.jpg" alt="" width="600" height="376"></a></p>
<p><a href="http://www.delarocque.com.br/11/home.html">delarocque</a><br />
<a href="http://www.delarocque.com.br/11/home.html"><img src="http://dzineblog.com/wp-content/uploads/2011/09/301.jpg" alt="" width="600" height="381"></a></p>
<p><a href="http://ovenbits.com/">ovenbits</a><br />
<a href="http://ovenbits.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/311.jpg" alt="" width="600" height="365"></a></p>
<p><a href="http://vintage-productions.com/">vintage-productions</a><br />
<a href="http://vintage-productions.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/321.jpg" alt="" width="600" height="385"></a></p>
<p><a href="http://www.markdearman.com/">markdearman</a><br />
<a href="http://www.markdearman.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/331.jpg" alt="" width="600" height="384"></a></p>
<p><a href="http://www.carolinakaucher.com/en/">carolinakaucher</a><br />
<a href="http://www.carolinakaucher.com/en/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/341.jpg" alt="" width="600" height="405"></a></p>
<p><a href="http://www.aw-digital.com/">aw-digital</a><br />
<a href="http://www.aw-digital.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/351.jpg" alt="" width="600" height="343"></a></p>
<p><a href="http://www.adlucent.com/">adlucent</a><br />
<a href="http://www.adlucent.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/361.jpg" alt="" width="600" height="390"></a></p>
<p><a href="http://www.squarefour.net/">squarefour</a><br />
<a href="http://www.squarefour.net/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/371.jpg" alt="" width="600" height="396"></a></p>
<p><a href="http://www.321akce.cz/">321akce</a><br />
<a href="http://www.321akce.cz/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/381.jpg" alt="" width="600" height="323"></a></p>
<p><a href="http://www.anton-kunst.nl/">anton-kunst</a><br />
<a href="http://www.anton-kunst.nl/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/391.jpg" alt="" width="600" height="382"></a></p>
<p><a href="http://www.jdetraz.com/">jdetraz</a><br />
<a href="http://www.jdetraz.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/401.jpg" alt="" width="600" height="384"></a></p>
<p><a href="http://www.freshtilledsoil.com/#!welcome">freshtilledsoil</a><br />
<a href="http://www.freshtilledsoil.com/#!welcome"><img src="http://dzineblog.com/wp-content/uploads/2011/09/412.jpg" alt="" width="600" height="357"></a></p>
<p><a href="http://smorge.com/">smorge</a><br />
<a href="http://smorge.com/"><img src="http://dzineblog.com/wp-content/uploads/2011/09/421.jpg" alt="" width="600" height="359"></a></p>
<p>
<p><a href="http://rss.buysellads.com/click.php?z=1264762&amp;k=bb78eac5744533b69852b62261051c57&amp;a=11860&amp;c=2059365723"><br />
				<img src="http://rss.buysellads.com/img.php?z=1264762&amp;k=bb78eac5744533b69852b62261051c57&amp;a=11860&amp;c=2059365723" border="0" alt=""></a></p>
<p><a href="http://buysellads.com/buy/sitedetails/pubkey/bb78eac5744533b69852b62261051c57/zone/1264762">Advertise here with BSA</a></p>
<div>
<a href="http://feeds.feedburner.com/~ff/WebWorldST?a=HE0ZlKn6epA:lHT-jN4g6jI:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/WebWorldST?d=yIl2AUoC8zA" border="0"></a> <a href="http://feeds.feedburner.com/~ff/WebWorldST?a=HE0ZlKn6epA:lHT-jN4g6jI:dnMXMwOfBR0"><img src="http://feeds.feedburner.com/~ff/WebWorldST?d=dnMXMwOfBR0" border="0"></a> <a href="http://feeds.feedburner.com/~ff/WebWorldST?a=HE0ZlKn6epA:lHT-jN4g6jI:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/WebWorldST?i=HE0ZlKn6epA:lHT-jN4g6jI:D7DqB2pKExk" border="0"></a> <a href="http://feeds.feedburner.com/~ff/WebWorldST?a=HE0ZlKn6epA:lHT-jN4g6jI:F7zBnMyn0Lo"><img src="http://feeds.feedburner.com/~ff/WebWorldST?i=HE0ZlKn6epA:lHT-jN4g6jI:F7zBnMyn0Lo" border="0"></a> <a href="http://feeds.feedburner.com/~ff/WebWorldST?a=HE0ZlKn6epA:lHT-jN4g6jI:V_sGLiPBpWU"><img src="http://feeds.feedburner.com/~ff/WebWorldST?i=HE0ZlKn6epA:lHT-jN4g6jI:V_sGLiPBpWU" border="0"></a> <a href="http://feeds.feedburner.com/~ff/WebWorldST?a=HE0ZlKn6epA:lHT-jN4g6jI:gIN9vFwOqvQ"><img src="http://feeds.feedburner.com/~ff/WebWorldST?i=HE0ZlKn6epA:lHT-jN4g6jI:gIN9vFwOqvQ" border="0"></a>
</div>
<p><img src="http://feeds.feedburner.com/~r/WebWorldST/~4/HE0ZlKn6epA" height="1" width="1"></p>
<div class="shr-publisher-1280"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/42-awesome-single-page-portfolio-websites/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>The New Windows Explorer UI</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/the-new-windows-explorer-ui/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/the-new-windows-explorer-ui/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 05:30:00 +0000</pubDate>
		<dc:creator>Dmitry Fadeyev</dc:creator>
				<category><![CDATA[Design]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?guid=024f2846b88b10f5306c520256415adf</guid>
		<description><![CDATA[Today Microsoft posted a blog entry showcasing the new Windows Explorer interface. Long story short, the new Windows Explorer UI in Windows 8 will be based around the ribbon. Here’s what it looks like:



Self-parody?

I’ve been reading people’s ... <a href="http://www.colourpencil.com/blog/2011/09/27/the-new-windows-explorer-ui/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p>Today Microsoft posted a blog entry <a href="http://blogs.msdn.com/b/b8/archive/2011/08/26/improvements-in-windows-explorer.aspx">showcasing the new Windows Explorer interface</a>. Long story short, the new Windows Explorer UI in Windows 8 will be based around the <a href="http://en.wikipedia.org/wiki/Ribbon_(computing)">ribbon</a>. Here’s what it looks like:</p>
<p><a style="border-bottom:0" href="http://img.usabilitypost.com/1108/new_explorer_ui_large.png"><img src="http://img.usabilitypost.com/1108/new_explorer_ui.png"></a></p>
<h3>Self-parody?</h3>
<p>I’ve been reading people’s comments on this and it’s not surprising that there’s already some backlash against the new design. I can’t blame them, the first impressions are: it’s heavy and noisy. One blog even goes to say that Microsoft have <a href="http://seldo.tumblr.com/post/9549775746/this-is-genuinely-microsofts-idea-of-a">entered the realm of self-parody</a>.</p>
<p>In that post Seldo raises a couple of interesting points against Microsoft’s design decisions, which I’d like to address now.</p>
<p>1) Microsoft’s own usage screenshot shows data for only half the UI elements. Seldo concludes that this shows that half the elements on the ribbon aren’t going to be used at all.</p>
<p><img src="http://img.usabilitypost.com/1108/ui_usage.png"></p>
<p>This isn’t true, given that some of these elements weren’t available on the previous UI, which means there’s no data yet on their usage. It’s a new design, so the usage percentage of all of those buttons will change. The current percentages shown were used as a guide to select the set of buttons on the new ribbon, where they are placed and how large they should be.</p>
<p>2) More  important, Seldo points out that menu bar usage is less than 5% on Microsoft’s own research, whereas context menu usage is at around 55%.</p>
<p><img src="http://img.usabilitypost.com/1108/entrypoint_usage.png"></p>
<p>But again, I’m not sure that this says that the context menu is better—it may very well be that the menu bar is so bad that people are forced to use the context menu. Microsoft’s ribbon is their attempt at turning the context menu into something more open and usable by exposing more of those features infront of the user on the menu bar.</p>
<h3>A utilitarian approach</h3>
<p>I don’t know I like this UI yet or not, but what I do like is that Microsoft doesn’t seem to care about what their competitors, e.g. Apple, are doing. They’ve got their own research, their own ideas and their own views on how their UI should be implemented. They’re not cloning their competitors or what’s been done before, but going in a direction they’ve set for themselves. Apple users may laugh at this new UI thinking it’s a cluttered mess, but at the end of the day this is a different approach to solving the same problem—it’s a utilitarian UI that doesn’t care much about minimalism.</p>
<p>My computer of choice is a Mac, and I doubt I’ll be switching to Windows any time soon (I rely on the Unix foundation of OS X, among other things), but I like how Microsoft are moving their interface in a direction driven by researched and tested design decisions, a direction different to that of Apple who ruthlessly cut and simplify. Simple, clean minimalism is often beautiful, but it’s not a panacea for effective design. We’ll have to wait and see how the new UI works in Windows 8 but I certainly wouldn’t dismiss it outright for being bulky—it might very well end up working well for many Windows users.</p>
<div class="shr-publisher-1340"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/the-new-windows-explorer-ui/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>30 Political Propaganda Posters from Modern History</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/30-political-propaganda-posters-from-modern-history/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/30-political-propaganda-posters-from-modern-history/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 05:25:00 +0000</pubDate>
		<dc:creator>Print Express</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Inspiration]]></category>
		<category><![CDATA[typography]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[app]]></category>
		<category><![CDATA[book]]></category>
		<category><![CDATA[graphic]]></category>
		<category><![CDATA[Graphic Design]]></category>
		<category><![CDATA[Graphic Inspiration]]></category>
		<category><![CDATA[logo]]></category>
		<category><![CDATA[minimal]]></category>
		<category><![CDATA[PHOTOSHOP]]></category>
		<category><![CDATA[tutorial]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?guid=6a8465d76aa9ad1b170589e149025282</guid>
		<description><![CDATA[Advertise here with BSAOver the past hundred years posters have been used as a very effective tool for war-time recruitment, persuasion, motivation, vigilance and also, at times, to instill some form of guilt on the general public. These propoganda pos... <a href="http://www.colourpencil.com/blog/2011/09/27/30-political-propaganda-posters-from-modern-history/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><p><a href="http://rss.buysellads.com/click.php?z=1259958&amp;k=53ef29bf69caaf7b9711bf01cd3ee13b&amp;a=15518&amp;c=1573723650"><img src="http://rss.buysellads.com/img.php?z=1259958&amp;k=53ef29bf69caaf7b9711bf01cd3ee13b&amp;a=15518&amp;c=1573723650" border="0" alt=""></a></p>
<p><a href="http://buysellads.com/buy/sitedetails/pubkey/53ef29bf69caaf7b9711bf01cd3ee13b/zone/1259958">Advertise here with BSA</a></p>
<p>
<p>Over the past hundred years posters have been used as a very effective tool for war-time recruitment, persuasion, motivation, vigilance and also, at times, to instill some form of guilt on the general public. These propoganda posters, which in modern times may seem crude and un-just, give you an interesting visual into times gone by.</p>
<p>Here is an interesting fact for you. Although the USA joined both the First and Second World Wars late (1917 for the First and 1941 for the Second) they still managed to publish many, many more propaganda posters than any other war-time nation. Not to sure what that fact will tell you, just thought it was interesting.</p>
<p>Anyway, here are 30 Political Propaganda Posters from Modern History:</p>
<h2>Daddy, what did you do…?</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_01.jpg">This poster was produced before conscription was introduced in 1916 and aimed to encourage men to join the armed forces through emotional blackmail.<br /> <a href="http://www.flickr.com/photos/BenSutherland">Source</a></p>
<h2>Corn – The Food of the Nation</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_02.jpg">A poster from 1918 by Lloyd Harrison for the US Food Administration<br /> <a href="http://www.flickr.com/photos/alibrarian2">Source</a></p>
<h2>Pvt. Treptwos’s Pledge</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_03.jpg">Pvt Treptow died on the battle fields during the First World War, however, a note was found in his pocket which became the content for a political poster.<br /> <a href="http://www.flickr.com/photos/MarionDoss">Source</a></p>
<h2>Eat More…</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_04.jpg">A poster showing which foods should be consumed during the First World War.<br /> <a href="http://www.flickr.com/photos/MarionDoss">Source</a></p>
<h2>Beat Back the Hun</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_05.jpg">Liberty Bonds were sold in the US during the Great War and buying them became a patriotic duty.<br /> <a href="http://www.flickr.com/photos/MarionDoss">Source</a></p>
<h2>Team Work Wins</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_06.jpg">This poster was created during the First World War to encourage the people of America to stick together during the war effort.<br /> <a href="http://www.flickr.com/photos/MarionDoss">Source</a></p>
<h2>The Second Artillery</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_07.jpg">A US Army recruitment poster, tugging on the heart strings of so-called “real men”.<br /> <a href="http://www.flickr.com/photos/Tumbleweed">Source</a></p>
<h2>Open Trap …</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_08.jpg">Many US produced propaganda posters from World War II would typecast the Japanese as goofy and cartoonish. Buck teeth, big ears and an exaggeration on the eyes were recurring features.<br /> <a href="http://www.flickr.com/photos/unfeather">Source</a></p>
<h2>Together We Can Do It!</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_09.jpg">This poster was created by the American Office for Emergency Management during World War Two and encourages everybody to stick together.<br /> <a href="http://www.flickr.com/photos/DonkeyHotey">Source</a></p>
<h2>Keep Clean</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_10.jpg">A propaganda poster used in World War Two encouraging people to keep clean and stay strong.<br /> <a href="http://www.flickr.com/photos/otisarchives3">Source</a></p>
<h2>Free Labor Will Win</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_12.jpg">Another political poster from World War Two created by the Office For Emergency Management.<br /> <a href="http://www.flickr.com/photos/DonkeyHotey">Source</a></p>
<h2>Women</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_15.jpg">Women proved themselves to be highly skilled in all areas and played an essential role in the war effort.<br /> <a href="http://www.flickr.com/photos/MichalHadassah">Source</a></p>
<h2>Get a War Job</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_16.jpg">This poster was released during the Second World War and played on women’s fragile and emotional state.<br /> <a href="http://www.flickr.com/photos/MichalHadassah">Source</a></p>
<h2>Find Your War Job</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_19.jpg">Despite the bombing and fighting, women were regularly portrayed with big smiling faces to make war work seem like the best thing ever.</p>
<p><a href="http://www.flickr.com/photos/MichalHadassah">Source</a></p>
<h2>Proud</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_21.jpg">A poster which shouts “all work is important” released during World War Two.<br /> <a href="http://www.flickr.com/photos/MichalHadassah">Source</a></p>
<h2>Soldiers Without Guns</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_22.jpg">These ladies may not have weapons, but this poster is stating that their roles are just as important – Clever propaganda during the Second World War.<br /> <a href="http://www.flickr.com/photos/happyhyde">Source</a></p>
<h2>Avenge Pearl Harbour</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_23.jpg">After the attack on Pearl Harbour, many posters were produced that actively promoted revenge against the Japanese. Uncle Sam is portrayed as triumphant against the enemy.<br /> <a href="http://www.archives.gov/">Source</a></p>
<h2>Avenge December 7</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_24.jpg">Another poster encouraging vengeance against the Japanese. The imagery and tone of this poster is much starker than the original and instead shows the patriotism of an average American soldier.<br /> <a href="http://www.flickr.com/photos/tiny_epics">Source</a></p>
<h2>Victory Waits</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_26.jpg">This poster encourages the females of the United States to remain patriotic at all times and gives them praise.<br /> <a href="http://www.flickr.com/photos/UmbrellaMinistry">Source</a></p>
<h2>Buy War Bonds</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_27.jpg">A very powerful image, this poster asks for people to support the effort financially to save their kids from harm.<br /> <a href="http://www.flickr.com/photos/RetroRocketeer">Source</a></p>
<h2>Plan Today</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_28.jpg">Again, this poster suggests that war bonds will help create a brighter future.<br /> <a href="http://www.flickr.com/photos/MichalHadassah">Source</a></p>
<h2>Talk of Sacrifice</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_29.jpg">This poster was used as propaganda and seems to be designed to anger people so they enlist and fight.<br /> <a href="http://www.flickr.com/photos/highheater93">Source</a></p>
<h2>Above and Beyond</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_31.jpg">Doris Miller served in the Navy during Pear Harbor. Despite receiving no gunnery training, Miller manned the weapon of a fallen gunman and successfully hit Japanese planes. He was awarded the Navy Cross after pressure from the black press.<br /> <a href="http://www.flickr.com/photos/shore5man7">Source</a></p>
<h2>&quot;Wanna keep ‘em healthy?&quot;</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_33.jpg">This was another poster to encourage healthy eating during the war.<br /> <a href="http://www.archives.gov/">Source</a></p>
<h2>Use Leftovers</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_35.jpg">Many posters asked people not to waste food and become economical chefs.<br /> <a href="http://www.archives.gov/">Source</a></p>
<h2>Food Comes First</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_36.jpg">This poster from World War Two shows someone in the fields despite the war planes overhead, emphasising sheer guts and determination.<br /> <a href="http://www.flickr.com/photos/Limbic">Source</a></p>
<h2>Submarine Service</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_38.jpg">According to this poster, if you sign up for the Submarine Service you win points and the ladies.<br /> <a href="http://www.flickr.com/photos/FranMoff">Source</a></p>
<h2>Buy War Bonds</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_39.jpg">Again, this poster urges people to do their duty and buy war bonds.<br /> <a href="http://www.flickr.com/photos/Antoon&#39;sFoobar">Source</a></p>
<h2>I Want You</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_40.jpg">America is personified here as stern Uncle Sam, who wants you to fight to save him.<br /> <a href="http://www.flickr.com/photos/DonkeyHotey">Source</a></p>
<h2>Someone Talked</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_41.jpg">Many posters throughout World War Two stated that talking too much could be dangerous. This poster represents someone in trouble because knowledge reached the wrong person.<br /> <a href="http://www.flickr.com/photos/RobertLz">Source</a></p>
<h2>Man the Guns</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_42.jpg">A simple, yet effective poster suggesting that if you enroll in the Navy, you will be in charge of your county’s state.<br /> <a href="http://www.flickr.com/photos/MarionDoss">Source</a></p>
<h2>For Your Country’s Sake…</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_43.jpg">This poster is recruiting women to join the armed forces for the sake of their county and their future.<br /> <a href="http://www.flickr.com/photos/MarionDoss">Source</a></p>
<h2>Target for To-Night</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_44.jpg">Simple, yet effective, this poster issues a warning to people at the time of The Blitz.</p>
<h2>Have you really tried?</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_45.jpg">This poster is encouraging people to drive in groups and not take journeys alone.<br /> <a href="http://www.flickr.com/photos/Richardmasoner">Source</a></p>
<h2>All Fuel is Scarce</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_46.jpg">Fuel was hard to come by during times of war, so all efforts were taking to make sure it didn’t run out quickly.<br /> <a href="http://www.flickr.com/photos/Richardmasoner">Source</a></p>
<h2>The War is Over</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_47.jpg">This poster gives a death toll for both American GIs and Vietnamese soldiers during the war in Vietnam. It pleads with people to vote for peace by tugging on heart strings and playing on words.<br /> <a href="http://www.wisconsinhistory.org/whi/">Source</a></p>
<h2>North and South United</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_48.jpg">This poster asks for peace between the North and South of Vietnam, to protect the country from destruction and war.<br /> <a href="http://www.flickr.com/photos/travelmeasia">Source</a></p>
<h2>Liberators</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_49.jpg">The Nazi’s had a very imaginative approach when it came to producing posters during the Second World War. This particularly famous image depicts the Americans as a domineering force and characterizes many of their negative aspects, such as being money grabbing, racist, over-sexualized and all-empowering.<br /> <a href="http://www.flickr.com/photos/wojprops">Source</a></p>
<h2>Soviet Army Defeated</h2>
<p><img src="http://speckyboy.com/wp-content/uploads/2011/08/propoganda_50.jpg">This poster depicts two People’s Liberation Army soldiers holding two books. The left book read “Soviet Army Defeated 1,200,000 German Nazi, Italian, Japanese and other countries’ soldiers during World War Two” and the right reads “Chinese People’s Liberation Army defeated 8 million soldiers from American Imperialist sponsored Chiang Kai-Chek’s army. At the bottom, defeated Americans hold dollar sign flags, and in writing it says “Next year we can accumulate 3 million soldiers”.<br /> <a href="http://www.flickr.com/photos/JasonFord">Source</a></p>
<h2>You might also like…</h2>
<p><a href="http://speckyboy.com/2010/12/21/50-beautifully-designed-posters-with-amazing-typography/">50 Beautifully Designed Posters with Amazing Typography →</a><br /> <a href="http://speckyboy.com/2011/01/06/30-beautifully-colorful-typographic-book-cover-designs/">30 Beautifully Colorful Typographic Book Cover Designs →</a><br /> <a href="http://speckyboy.com/2011/02/04/the-beauty-of-minimalist-music-posters/">The Beauty of Minimalist Music Posters →</a><br /> <a href="http://speckyboy.com/2010/06/27/the-complete-web-design-style-series-700-designs-in-14-categories/">The Complete Web Design Style Series (700 Designs in 14 Categories) →</a><br /> <a href="http://speckyboy.com/2010/11/01/10-album-covers-for-eye-grabbing-color-scheme-inspiration/">10 Album Covers for Eye-grabbing Color Scheme Inspiration →</a><br /> <a href="http://speckyboy.com/2010/09/09/eight-helpful-rules-for-logo-designers/">Eight Helpful Rules for Logo Designers →</a><br /> <a href="http://speckyboy.com/2010/09/23/the-trend-of-minimalist-graphic-design/">The Trend of Minimalist Graphic Design  →</a><br /> <a href="http://speckyboy.com/2009/07/31/a-gallery-of-slightly-odd-and-wonderful-photography-from-mr-toledano/">A Gallery of Slightly Odd and Wonderful Photography from Mr Toledano →</a><br /> <a href="http://speckyboy.com/2009/07/09/50-beautiful-hdr-images-from-50-world-cities/">50 Beautiful HDR Images from 50 World Cities →</a><br /> <a href="http://speckyboy.com/2009/05/18/20-beautiful-examples-of-photoshopped-smoke-art-and-technique-tutorials/">20 Beautiful Examples of Photoshopped Smoke Art and Technique Tutorials →</a><br /> <a href="http://speckyboy.com/2009/05/01/30-creative-photography-examples-using-the-polar-panorama-effect/">30 Creative Photography Examples using the Polar Panorama Effect →</a><br /> <a href="http://speckyboy.com/2009/01/27/20-amazing-images-that-could-be-hdr-but-are-definitely-not/">20 Amazing Images That Could Be HDR – But are definitely Not →</a></p>
<p>
<p><a href="http://rss.buysellads.com/click.php?z=1259961&amp;k=53ef29bf69caaf7b9711bf01cd3ee13b&amp;a=15518&amp;c=2045274239"><img src="http://rss.buysellads.com/img.php?z=1259961&amp;k=53ef29bf69caaf7b9711bf01cd3ee13b&amp;a=15518&amp;c=2045274239" border="0" alt=""></a></p>
<p><a href="http://buysellads.com/buy/sitedetails/pubkey/53ef29bf69caaf7b9711bf01cd3ee13b/zone/1259961">Advertise here with BSA</a></p>
<div>
<a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=eWXuAaRnVFk:kYEmPPWmyyE:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?d=yIl2AUoC8zA" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=eWXuAaRnVFk:kYEmPPWmyyE:-BTjWOF_DHI"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?i=eWXuAaRnVFk:kYEmPPWmyyE:-BTjWOF_DHI" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=eWXuAaRnVFk:kYEmPPWmyyE:F7zBnMyn0Lo"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?i=eWXuAaRnVFk:kYEmPPWmyyE:F7zBnMyn0Lo" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=eWXuAaRnVFk:kYEmPPWmyyE:V_sGLiPBpWU"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?i=eWXuAaRnVFk:kYEmPPWmyyE:V_sGLiPBpWU" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=eWXuAaRnVFk:kYEmPPWmyyE:qj6IDK7rITs"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?d=qj6IDK7rITs" border="0"></a> <a href="http://feeds.feedburner.com/~ff/speckboy-design-magazine?a=eWXuAaRnVFk:kYEmPPWmyyE:gIN9vFwOqvQ"><img src="http://feeds.feedburner.com/~ff/speckboy-design-magazine?i=eWXuAaRnVFk:kYEmPPWmyyE:gIN9vFwOqvQ" border="0"></a>
</div>
<p><img src="http://feeds.feedburner.com/~r/speckboy-design-magazine/~4/eWXuAaRnVFk" height="1" width="1"></p>
<div class="shr-publisher-1274"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/30-political-propaganda-posters-from-modern-history/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Design for Transcendence</title>
		<link>http://www.colourpencil.com/blog/2011/09/27/design-for-transcendence/</link>
		<comments>http://www.colourpencil.com/blog/2011/09/27/design-for-transcendence/#comments</comments>
		<pubDate>Tue, 27 Sep 2011 05:20:00 +0000</pubDate>
		<dc:creator>Jod Kaftan</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Blog]]></category>
		<category><![CDATA[Opinion & Interviews]]></category>
		<category><![CDATA[philosophy]]></category>
		<category><![CDATA[transcendence]]></category>
		<category><![CDATA[user experience]]></category>
		<category><![CDATA[UX Design]]></category>

		<guid isPermaLink="false">http://www.colourpencil.com/blog/?guid=02907bc1a2272745657c1165c5d13a04</guid>
		<description><![CDATA[
       
Transcendent design takes us above and beyond the initial experience.
blinkingidiot

Transcendence is simply a word. We have a shared understanding of it, but the context that resonates with me is when design goes beyond ordinary limits to ult... <a href="http://www.colourpencil.com/blog/2011/09/27/design-for-transcendence/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<!-- Start Shareaholic LikeButtonSetTop --><!-- End Shareaholic LikeButtonSetTop --><div>
      <img src="http://www.uxbooth.com/wp-content/uploads/2011/09/lead2.jpg"> </p>
<p>Transcendent design takes us above and beyond the initial experience.</p>
<p><a href="http://www.flickr.com/photos/45325473@N04/" rel="nofollow">blinkingidiot</a></p>
</div>
<p>Transcendence is simply a word. We have a shared understanding of it, but the context that resonates with me is when design goes beyond ordinary limits to ultimately impact our behavior on a mass scale.  </p>
<p>What design has to do with <a href="http://en.wikipedia.org/wiki/Transcendence_(philosophy)" rel="nofollow">transcendence</a> might strike most people in our community as either pure hyperbole or just the crazy ramblings of a UX designer waiting on an statement of work to be signed (er, maybe it is the latter). After all, as UX designers, it’s hard to imagine our wireframes causing someone to levitate or go through stigmata (though it’s easy for us to imagine a wireframe making someone want to be crucified). </p>
<p>While it’s critical that we target specific behaviors for our design solutions, it’s equally critical that we don’t fixate on those insights—after all, even if they are gleaned from such practices as <a href="http://www.uxbooth.com/blog/complete-beginners-guide-to-design-research/" rel="nofollow">contextual inquiry</a>, they are ultimately just well founded assumptions.  We need to allow for thinking that transcends methodology, something that enables the design to delight anyone who interfaces with it. That’s transcendent design.</p>
<h3>Transcendence Enables Meaning</h3>
<p>Let’s start with the meaning of the word transcendence.  The fact that we have a shared understanding of it but that it connotes something unique to me is not unlike experiences we come across in UX design, or for that matter, any media or art.  With all experiences there is an inter-objective reality that serves as a starting point—an agreed meaning between people, but then something happens to meaning where it ultimately evolves into the pure subjective reality of the individual.</p>
<p>Products are uniquely individual to the person using them. Whether that product is as broad as Facebook or as highly focused as a <a href="http://www.uxbooth.com/blog/hotel-booking-from-start-to-finish/" rel="nofollow">trip booking engine</a>, the meaning is not inherent in the product itself, but in what psychological and emotional connections the individual draws through the product. The “experience” is cumulative, personal and residual. Our jurisdiction as designers can never exceed this space of shared understanding. We cannot make emotional connections for people or instill memories or contexts for them. We can only find the greatest common denominator—a mythic space in which these personal meanings are drawn.</p>
<p>In UX design, meaning can never really exist on a mass level. The significance of something, the ultimate expression of meaning, can only exist at an intrinsic personal level.  As UX designers, we can only set the table—and define where that table lives. In other words, we can conceive of an environment for the attendees to have a magnificent dining experience—just not conceive of the experience itself. And we can focus on contexts so that our guests can find their way to the table and have a subjective takeaway, and hopefully return again and again. </p>
<div>
      <img src="http://www.uxbooth.com/wp-content/uploads/2011/12/Picture-3.png"> </p>
<p>In the traditional design processes, the burden of defining the  product begins to rapidly encroach on our ability to sketch and experiment.  Designers feel compelled to define the known design problem before having the chance to “transcend” towards new paradigms.  Product definition can still begin early in a transcendent model but really only spikes after sufficient exploration of all the possibilities. </p>
</div>
<p>More than just persuasive design, which focuses on changing individual behaviors, transcendent design would look to identify an experience that can “transcend” the minutia of relativity, and ultimately impact anyone who uses the product. This notion runs almost counterintuitive to our user research sensibilities, which focuses on such audience segmentation activities as identifying contexts, deploying <a href="http://www.wordspy.com/words/tribalmarketing.asp" rel="nofollow">tribal marketing</a>, <a href="http://changethis.com/manifesto/show/10.LongTaill" rel="nofollow">long tail thinking</a> and so on. The question “who are you designing for?” pervades every experience design thought process for good reason. We <strong>must</strong> consider these things, but not at the expense of a potentially innovative and meaningful individualized experience. </p>
<p>The design principles that emerge from strategic analysis should only go so far as to maintain focus, but never should they eclipse the possibility for the unexpected to occur. If we adhere to them too closely we may eclipse the ability to transcend the ordinary limits of design. When we give ourselves the latitude of untethered thinking we increase the possibility producing an experiential magic in our products. </p>
<h3>This Sounds Scary. Why?</h3>
<p>I’ve met many a UX designer who believes there is no mass audience, that experience can never resonate across tribes or psychographics. Within our discipline there is a scientific mentality—we research data, we observe behaviors, we deduce patterns and then we make a recommendation grounded in sound rationale.   (Of course, those of us who toil on the agency side know that very few clients are willing to pay for this research).</p>
<div>
      <img src="http://www.uxbooth.com/wp-content/uploads/2011/12/pepsi-refresh.jpg"> </p>
<p>It’s visually striking, sure, but has it really affected Pepsi’s bottom line?</p>
</div>
<p>But these tactics are not meant to be ends. Reaching people in context is a starting point, and their experiences are simply an end point. The body of UX design exists in the broad imagination in between. Yes, you may get socially conscious Gen-Y people to vote on a good cause in a <a href="http://www.refresheverything.com/power-vote?paidsearch=kwid/&amp;utm_source=Google&amp;utm_medium=ppc&amp;utm_term=pepsi+refresh&amp;utm_campaign=branded-2011_brandrefresheverything" rel="nofollow">Pepsi Refresh campaign</a>, but what if that campaign exceeds the audience it intended? And it has, which I would say that’s a good thing (whether Pepsi’s bottom line has been impacted is another story).</p>
<p>Transcendent design poses the question to our community: Who are you without use cases and scenarios and personas? Without it we are simply creative. All our deliverables are just tools with which to creatively synthesize the connections between insights into what’s hopefully a vision for new paradigms. We are risk takers; we are people who can balance out our concern for the user with a vision for mass impact.</p>
<h3>Transcendent Design Already Exists</h3>
<p>Just as we can acknowledge the remote thickets of subjectivity, we can also cultivate the domain of things that bind us together–things that appeal to a common mythology. </p>
<p> Let’s look at a hypothetical family’s visit to the Seattle’s Space Needle. The father may be going because he feels he has to hit the major landmarks of a short trip with his kid. He’s stressed out with the child’s whining about needing a bathroom, his head buried into his Lonely Planet Guide so he can find how to get to it.  His child may have other goals; he may be thinking, “Why do I have to go to that strange looking tower in the sky? It looks ugly I’d rather go to Gymboree or Disneyland.” (UX designers reading this should already thinking about how to reach these people in their contexts.)</p>
<div>
      <img src="http://www.uxbooth.com/wp-content/uploads/2011/12/needle.jpg"> </p>
<p><a href="http://www.flickr.com/photos/wonderkris/" rel="nofollow">Wonder Kris</a></p>
</div>
<p>When the family gets to the top of the Space Needle, something happens; some great democratizing force of tranquility. The majesty of a panoramic view of the sparkling Puget Sound renders them silent. The father may be thinking about how he’s so happy he can afford to treat his children to travel experiences. He may be feeling simply grateful. His child may be marveling at human engineering. He may be thinking about how mankind could build such a thing.</p>
<p>Together, they share an experience that has somehow transcended their personal contexts. The designer simply and rightly assumed: create a manmade object that delivers something unique, transcendent and undeniably impressive.  Everyone, regardless of their gender, tribe and religion leaves the Space Needle with both a common “experience” and a personal one.</p>
<h3>A Transcendent Design Case Study: Netflix</h3>
<p>If it’s the common experience that we must focus on, it must be awesome and undeniably original. It must unify and go beyond the expected. </p>
<p>Generally, one could argue that transcendent design in digital media usually involves a UX innovator humanizing a new technology on a mass scale. Reed Hastings, the CEO of Netflix, was an engineer at heart.  When he acquired a big late fee for misplacing a video and was afraid to tell his wife, Hastings came up with <a href="http://www.nytimes.com/2006/12/17/jobs/17boss.html" rel="nofollow">the idea for Netflix</a>. Certainly, everyone prior to 1998 could relate to this problem. We all rented videos at the video store. And we all had late fees. </p>
<p>Hastings dreamt of a broad design that allowed people to subscribe and order DVDs to return at their leisure.  No one, regardless of his context or demographic, could deny the new system was better than the last.</p>
<p> </p>
<p>But transcendent design didn’t stop at the inception of Netflix. The company continued to transcend the expected—creating streaming video on-demand for a monthly fee, and by designing a refined recommendation algorithm that allows the product to intelligently suggest titles the user would never have discovered through conventional search. </p>
<p>If Hastings had allowed himself to slog through audience segmentation studies would Netflix have ever been born? Would he have started the company if he didn’t feel on a personal level the problem he was trying to solve? Of course, Netflix is also famous for the personalized algorithms that deliver amazingly accurate recommendations based on user behavior. But this came only after thinking of a disruptive business model that people renting from their local Blockbuster didn’t even think was possible. </p>
<p>As designers, perhaps it’s safe to assume that we are not always that different from each other. If the idea is transcendent enough, focusing on our differences won’t articulate it. Only by looking at our similarities can we find the right vocabulary for a transcendent design.</p>
<h3>Bringing Transcendent Thinking into the Experience Design Process</h3>
<p>Many UX designers have eclectic backgrounds—we might even be accused of being dilettantes. Where I work, I sit across from someone that used to be an underwater videographer. Across the room, there’s an abstract painter. Almost all the UX designers I’ve met are very interested in human beings and harbor a creative impulse to tell a story through design.  Too often, the UX designer is framed to clients as the egghead who comes in after the Creative Director to clean up the design and have it “make sense.” And all too often have I met the UX designer who feels underutilized as a creative partner.</p>
<p>Leveraging transcendent thinking is well within our wheelhouse.  We are not here to simply solve problems but to imagine experiences for which problems don’t yet exist. </p>
<p>Regardless of the design process, we can integrate questions into our workflow that can help us embark on an imaginative undertaking:</p>
<ul>
<li>What makes this product change the behavior of a mass audience (perhaps something that ties together the various audiences you’ve identified in your user research)</li>
<li>What aspect of this product is limited by context?</li>
<li>Are we telling a story through this channel that can’t be told more effectively through another channel?</li>
<li>If we didn’t create this product, would it matter to the people we’re designing for?</li>
<li>What are the archetypal human conditions this product will solve? (i.e. “it will restore love into your life,” etc.)</li>
</ul>
<p>It’s hard to push for ambition and innovation if the culture of your workplace doesn’t really share those values. But life isn’t about just having a job. If you believe experience design can impact millions of people then push for it any way or work somewhere else.  But if we ask these questions we can always move the needle on the UX spectrum closer to innovation and imagination. We can also show that our value is more than in just being brought in to “clean things up,” but to make things that never were.</p>
<p><a href="http://rss.buysellads.com/click.php?z=1259950&amp;k=248c31aa41846f2ed59231ff0d38d0b4&amp;a=24580&amp;c=1454195858"><img src="http://rss.buysellads.com/img.php?z=1259950&amp;k=248c31aa41846f2ed59231ff0d38d0b4&amp;a=24580&amp;c=1454195858" border="0" alt=""></a>
<p><a href="http://buysellads.com/buy/sitedetails/pubkey/248c31aa41846f2ed59231ff0d38d0b4/zone/1259950">Advertise here with BSA</a></p>
<div>
<a href="http://feeds.feedburner.com/~ff/uxbooth?a=Qgnj12biLK0:Hke1tz-bt4w:yIl2AUoC8zA"><img src="http://feeds.feedburner.com/~ff/uxbooth?d=yIl2AUoC8zA" border="0"></a> <a href="http://feeds.feedburner.com/~ff/uxbooth?a=Qgnj12biLK0:Hke1tz-bt4w:D7DqB2pKExk"><img src="http://feeds.feedburner.com/~ff/uxbooth?i=Qgnj12biLK0:Hke1tz-bt4w:D7DqB2pKExk" border="0"></a> <a href="http://feeds.feedburner.com/~ff/uxbooth?a=Qgnj12biLK0:Hke1tz-bt4w:F7zBnMyn0Lo"><img src="http://feeds.feedburner.com/~ff/uxbooth?i=Qgnj12biLK0:Hke1tz-bt4w:F7zBnMyn0Lo" border="0"></a> <a href="http://feeds.feedburner.com/~ff/uxbooth?a=Qgnj12biLK0:Hke1tz-bt4w:TzevzKxY174"><img src="http://feeds.feedburner.com/~ff/uxbooth?d=TzevzKxY174" border="0"></a> <a href="http://feeds.feedburner.com/~ff/uxbooth?a=Qgnj12biLK0:Hke1tz-bt4w:gIN9vFwOqvQ"><img src="http://feeds.feedburner.com/~ff/uxbooth?i=Qgnj12biLK0:Hke1tz-bt4w:gIN9vFwOqvQ" border="0"></a>
</div>
<p><img src="http://feeds.feedburner.com/~r/uxbooth/~4/Qgnj12biLK0" height="1" width="1"></p>
<div class="shr-publisher-1330"></div><!-- Start Shareaholic LikeButtonSetBottom --><!-- End Shareaholic LikeButtonSetBottom -->]]></content:encoded>
			<wfw:commentRss>http://www.colourpencil.com/blog/2011/09/27/design-for-transcendence/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

