<?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/"
	xmlns:media="http://search.yahoo.com/mrss/"
	>

<channel>
	<title>View from the 11th floor</title>
	<atom:link href="http://communicationdesign.wordpress.com/feed/" rel="self" type="application/rss+xml" />
	<link>http://communicationdesign.wordpress.com</link>
	<description>Lightweight ruminations and links about communication design</description>
	<lastBuildDate>Mon, 10 Nov 2008 18:53:22 +0000</lastBuildDate>
	<generator>http://wordpress.com/</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<cloud domain='communicationdesign.wordpress.com' port='80' path='/?rsscloud=notify' registerProcedure='' protocol='http-post' />
<image>
		<url>http://www.gravatar.com/blavatar/d28d6b338d3906790ebda4a38e002f27?s=96&#038;d=http://s.wordpress.com/i/buttonw-com.png</url>
		<title>View from the 11th floor</title>
		<link>http://communicationdesign.wordpress.com</link>
	</image>
			<item>
		<title>Kindle: Please learn to share with others</title>
		<link>http://communicationdesign.wordpress.com/2008/11/10/kindle-please-learn-to-share-with-others/</link>
		<comments>http://communicationdesign.wordpress.com/2008/11/10/kindle-please-learn-to-share-with-others/#comments</comments>
		<pubDate>Mon, 10 Nov 2008 18:45:59 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[UI]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[usability]]></category>
		<category><![CDATA[Add new tag]]></category>
		<category><![CDATA[ebooks]]></category>
		<category><![CDATA[Kindle]]></category>
		<category><![CDATA[sharing]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/?p=100</guid>
		<description><![CDATA[I&#8217;d been curious about Amazon&#8217;s Kindle since it came out. But it seemed too expensive to justify trying it out&#8230; until I saw a tweet about a $50 savings coupon available on the Oprah site last month. Taking a peek in the Amazon store, it looked like there was more and more content available on [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=100&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>I&#8217;d been curious about <a title="Kindle" href="http://www.amazon.com/gp/product/B000FI73MA/ref=sa_menu_kdp0" target="_blank">Amazon&#8217;s Kindle</a> since it came out. But it seemed too expensive to justify trying it out&#8230; until I saw a tweet about a $50 savings coupon available on the Oprah site last month. Taking a peek in the Amazon store, it looked like there was more and more content available on it&#8230; books, magazines, newspapers, even blogs. So I took the plunge. $300 and a couple of weeks later, here&#8217;s a perspective on the good, the bad and a fundamental, but hopefully fixable, flaw.<span id="more-100"></span></p>
<p>Sampling: Kindle has a sample feature which allows me to read a substantial portion (usually an intro and part of a first chapter) of books prior to purchasing. So if I see, either on the Kindle connection to Amazon&#8217;s store (it has a constantly available wireless connection which you can turn on or off), or by investigating Amazon online through the browser, books I think I might want to read, I can send them wirelessly to the Kindle almost instantly. As result, as I find books I might like to read, I can queue samples up for reading later, and then purchase directly from the Kindle if I&#8217;m interested.</p>
<p>Enhanced discovery: On a recent visit to my favorite local bookstore, <a href="http://www.keplers.com/" target="_blank">Kepler&#8217;s</a>, (where I did purchase a real book for my daugher) I <a title="jott.com" href="http://jott.com" target="_blank">jotted</a> down a number of books I wanted to download and sample. I would have had to stand around in Kepler&#8217;s for a couple of evenings (not so bad actually, author speakers almost every evening, and discussion groups as well) to be able to read the same samples. Once on the Kindle I can decide to purchase the book at any time while reading the sample. As result, I ended up purchasing and reading two books I would likely never have read beyond wishfully checking out book covers in the store, or listening to author interviews online: Doris Kearns Goodwin&#8217;s <a href="http://www.amazon.com/Team-Rivals-Political-Abraham-Lincoln/dp/B000N2HBSO/ref=sr_1_1?ie=UTF8&amp;s=digital-text&amp;qid=1226335415&amp;sr=1-1" target="_blank">Team of Rivals</a>, and <a title="Anti Cancer" href="http://www.amazon.com/Anti-Cancer-New-Way-Life/dp/B001ANYC64/ref=kinw_dp_ke" target="_blank">Anti-Cancer</a> by <span class="ptBrand">David Servan-Schreiber</span><span class="binding">.</span></p>
<p>It could get expensive: Wish there were a &#8220;save for later&#8221; option as well as a purchase option on the Kindle. Purchasing the books, while less expensive than a paperback or hardback, can get expensive. Just like iTunes, it can rack up a quickly if you have purchasing enabled at the click of a button. Click, 9.99, ka-ching! So please Amazon, I&#8217;d like a &#8220;remind me later&#8221; kind of button at the end of the sample or in the menu.</p>
<p>Free content too: There are apparently LOTS of free books available for Kindle. Many literary classics. And it&#8217;s also possible to translate online content into Kindle-friendly formats. I haven&#8217;t experimented much with this, but here are a few resources (by no means exhaustive): <a title="Feedbooks" href="http://www.feedbooks.com/" target="_blank">feedbooks</a> (wow), <a title="Many Books" href="http://manybooks.net/" target="_blank">manybooks</a>, <a title="Project Gutenberg" href="http://www.gutenberg.org/wiki/Main_Page" target="_blank">Project Gutenberg</a>.</p>
<p>Clipping and bookmarking: It&#8217;s easy to bookmark pages, or highlight sections to clip and move over to my desktop to quote and incorporate into other documents or written materials. This is sort of like highlighting in a traditional book, or putting in post-it notes, but so much easier to follow up on.</p>
<p>Device and interface design: <a title="Kindle review" href="http://ihnatko.com/index.php/2007/12/03/kindle-its-more-than-just-waffles/" target="_blank">Lots of others</a> have commented on the design fairly completely. The scale is wonderful, the interface is very legible, it&#8217;s simplicity and focus on core tasks is admirable (I use it to read, so make that easy, including customizing the type size). The dark flash onscreen at page turn is disconcerting and takes getting used to, the on and off switches on the reverse are odd especially when they&#8217;re obscured by the &#8220;book cover&#8221; holder, I am still trying to figure out some of the buttons on the front, the holder doesn&#8217;t quite fit the device, and the experimental functions are clearly still being worked out. (I can&#8217;t get Gmail access to work, and do I need another device to be constantly connected to email anyway? Please no. Found moments of peace free from email, IM, SMS and various phones are wonderful.)</p>
<p>Sharing: The missed opportunity with Amazon&#8217;s model for content delivery. My entire experience with books has been about sharing since I was two. There&#8217;s the public library, where I&#8217;ve grazed and been nourished by a shared pool of wonderful picture books as a toddler, stacks of books as an early reader, and later by fiction, research and reference, all available to an entire community. There&#8217;s sharing that same resource, as well as a large home library, with my children and family on a continuing basis. There&#8217;s lending books to friends, and donating them to shelters or schools or libraries when I&#8217;ve finished with them. This approach to books as a shared resource seems fundamental to what books are about for many in our culture, and probably in other countries as well.</p>
<p>Online access to books would ideally increase our opportunities to share and learn from each other, not eclipse them. On a fundamental level, why is the internet and the web of information so valuable? Because it enables us to share and help each other.</p>
<p>Amazon will share content I purchase with me, but not enable me to share it with others, beyond recommending it to others (with starring/rating/reviewing on their site) so that they can possibly purchase it too. With iTunes, if I purchase music, I can generally share it between five authorized computers, as well as rating for the larger audience. That means I can share my music with my family or a few friends. But with the Kindle, I can&#8217;t share the books I discover and enjoy with others. Even now, a few books I&#8217;d like to purchase, such as Michael Pollan&#8217;s works on food and the environment, my daughter also needs for her high school research project. But because my Kindle purchase would only be available on one device (if, for instance, we had two Kindles, a whole other issue) it makes it more economical to purchase the paperback book. There are threads of conversation on <a href="http://www.librarything.com" target="_blank">LibraryThing</a> making the same point: &#8220;I&#8217;d lend it to you, but I read it off my Kindle.&#8221;</p>
<p>Especially for the potential educational uses of a device like this, the lack of opportunity to share (within limits, Amazon needs to stay afloat) seems like a missed opportunity. So I hope that as Amazon matures the Kindle and the store, they find ways to enable sharing, and by working with authors and publishers, ways to enable people to purchase and package customizable collections of content for such uses as education or research. Think what a gift to the health of kid&#8217;s backs that could be&#8230; going to school with a single book, rather than the huge backpacks they carry today.</p>
  <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/100/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/100/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/100/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/100/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/100/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/100/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/100/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/100/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/100/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/100/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=100&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2008/11/10/kindle-please-learn-to-share-with-others/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>
	</item>
		<item>
		<title>Other takes on Microsoft</title>
		<link>http://communicationdesign.wordpress.com/2008/07/06/other-takes-on-microsoft/</link>
		<comments>http://communicationdesign.wordpress.com/2008/07/06/other-takes-on-microsoft/#comments</comments>
		<pubDate>Sun, 06 Jul 2008 16:01:19 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[UI]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/?p=80</guid>
		<description><![CDATA[I&#8217;m working on a web design project where we have been asked to use a UI skin and grid system which has some similarities to common Microsoft interface skins&#8230; glassy, similar menu bars, etc. The other designers and I agreed we don&#8217;t want our work to come off as related to Microsoft. However, Microsoft actually [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=80&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>I&#8217;m working on a web design project where we have been asked to use a UI skin and grid system which has some similarities to common Microsoft interface skins&#8230; glassy, similar menu bars, etc. The other designers and I agreed we don&#8217;t want our work to come off as related to Microsoft. However, Microsoft actually has current and developing extensions into all kinds of new interaction models and even visual presentation. <span id="more-80"></span>It&#8217;s a much broader spectrum than we&#8217;ve usually associated with them&#8230; new products, deeper and  richer design ideas. They&#8217;re investing in serious design research and leadership. For instance see <a href="http://www.billbuxton.com/" target="_blank">Bill Buxton</a>, a regular contributor on <a title="Bill Buxton on why products fail" href="http://www.businessweek.com/innovate/content/may2007/id20070518_332210.htm?chan=innovation_innovation+%2B+design_top+stories" target="_blank">businessweek.com</a>, and author of <a title="Sketching User Experiences web site" href="http://books.elsevier.com/companions/defaultindividual.asp?isbn=9780123740373" target="_blank">Sketching User Experiences:  Getting the Design Right and the Right Design</a>. Highly recommend his inspiring lecture to the Stanford HCI Seminar on iTunesU. He talks about the role of design, and the true object of design focus. He says Hendrix had it right with &#8220;Are You Experienced?&#8221;</p>
<p>One new example in the Microsoft design world on the web is <a title="Spectra news reader" href="http://msnbcmedia.msn.com/i/msnbc/components/spectra/index.html" target="_blank">SpectraNews</a>. From MSNBC, it doesn&#8217;t carry the whole weight of the glossy transparent stuff&#8230; nice initial launch experience as the browser expands, and good use of color for meaning unencumbered by shading, transparency, or unnecessary modeling. The illusion of depth is created by the floating and revolving news placards.</p>
<div class="thumbnail"><a href="http://skitch.com/amelia/xdax/spectra-news-reader"><img src="http://img.skitch.com/20080706-dwsrkr7gewg5e62p3ff7shshpj.preview.jpg" alt="Spectra News Reader" /></a><br />
<span style="font-size:10px;font-family:Lucida Grande,Trebuchet,sans-serif,Helvetica,Arial;color:#808080;">Uploaded with <a href="http://plasq.com/">plasq</a>&#8217;s <a href="http://skitch.com">Skitch</a>!</span></div>
<div class="thumbnail">So I&#8217;m thinking it&#8217;s more important for us to focus on the best UI for our specific opportunities, challenges and resources, rather than being too concerned with what the other guys are doing and trying to differentiate. In Microsoft&#8217;s case, that would be dodging alot of bullets.</div>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/80/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/80/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/80/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/80/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/80/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/80/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/80/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/80/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/80/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/80/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/80/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/80/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=80&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2008/07/06/other-takes-on-microsoft/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>

		<media:content url="http://img.skitch.com/20080706-dwsrkr7gewg5e62p3ff7shshpj.preview.jpg" medium="image">
			<media:title type="html">Spectra News Reader</media:title>
		</media:content>
	</item>
		<item>
		<title>Looking for Snagit for Mac?</title>
		<link>http://communicationdesign.wordpress.com/2008/07/05/looking-for-snagit-for-mac/</link>
		<comments>http://communicationdesign.wordpress.com/2008/07/05/looking-for-snagit-for-mac/#comments</comments>
		<pubDate>Sat, 05 Jul 2008 16:32:57 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[Design tools]]></category>
		<category><![CDATA[free stuff]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/?p=78</guid>
		<description><![CDATA[Many of the visitors to this blog are coming to read a post about a year ago on alternatives to Snagit for Mac. There are now two great (and free) alternatives available: Skitch and JingProject.
First, there&#8217;s Skitch

Uploaded with plasq&#8217;s Skitch!
Fabulous and easy image capture. Installs a desktop widget that is available off the top right [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=78&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>Many of the visitors to this blog are coming to read a post about a year ago on alternatives to Snagit for Mac. There are now two great (and free) alternatives available: Skitch and JingProject.<span id="more-78"></span></p>
<p>First, there&#8217;s <a title="skitch home page" href="http://www.skitch.com/" target="_blank">Skitch</a></p>
<div class="thumbnail"><a href="http://skitch.com/amelia/xfp1/skitch.com-amelia"><img src="http://img.skitch.com/20080705-tq4xjikqkfgekm4f8tfi2jajp7.preview.jpg" alt="Skitch.com &gt; amelia" /></a><br />
<span style="font-size:10px;font-family:Lucida Grande,Trebuchet,sans-serif,Helvetica,Arial;color:#808080;">Uploaded with <a href="http://plasq.com/">plasq</a>&#8217;s <a href="http://skitch.com">Skitch</a>!</span></div>
<p>Fabulous and easy image capture. Installs a desktop widget that is available off the top right of the menu bar. Allows you to markup, comment, and then easily upload to a custom url which you can share with others. It even creates a history for you to go back and see what you&#8217;ve snapped. I use it dozens of times a day to easily show people what I&#8217;m talking about and markup and comment on creative work and web interfaces. Now, if they&#8217;d only integrate the kind of tagging and set creation tools we get from <a title="Evernote web clipping tool" href="http://www.evernote.com" target="_blank">Evernote</a>, it would be possible to create searchable and sharable sets. Or maybe the folks at Yahoo will just fold an image capture tool like that into <a title="Flickr from Yahoo!" href="http://www.flickr.com/" target="_blank">Flickr</a> someday&#8230;</p>
<p>Another great option is <a title="Jing Project" href="http://www.jingproject.com/" target="_blank">Jing Project</a> from TechSmith.</p>
<p>Jing is available for both Mac and PC. It installs a cool desktop widget that hides just under the top right corner of your desktop.  Jing hasn&#8217;t offered the same kind of ease or commenting tools on images, so I haven&#8217;t used it as much as Skitch. However, Jing allows you to capture video as well as images, so you can for instance capture a sequence of interactions and verbally comment on them, then post that clip on the web and share with others. Here&#8217;s <a title="Jing capture" href="http://screencast.com/t/d7zWjVXIy" target="_blank">a sample</a>.</p>
<p>One problem I&#8217;ve had with Jing is the lack of visibility into how much online storage space is available for free. The service is initially presented as entirely for free. Or at least, that&#8217;s how it came across to me as a new customer. I captured images and short clips, and shared them with others easily. There were no warnings about storage limitations or offers to upgrade for additional storage should I need it. Then I captured a 5-minute clip, the maximum time for a Jing clip. There were no warnings during the clip that I would max out my storage options with such a long clip. However, once finished I checked upload to the screencapture site to share as I&#8217;d done previously&#8230; and got a message in the interface that I was over capacity. The message suggested that I clear my history to allow more space. I did that but it was still too big. There was no offer to upgrade to a paying account for additional storage space. However, I got an email offer to upgrade later. I would rather have been informed clearly up front about the upgrade options directly in the interface at the moment when I needed the upgrade, and even prior to that when I first tried it out, perhaps after using it once or twice. If I had had my credit card on file with them, I could have made an easy decision at that moment to upgrade so I could accomplish my immediate objective of sharing my 5-minute clip.</p>
<p>So need for Mac users to have Snagit envy anymore&#8230; two options to try out!</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/78/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/78/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/78/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/78/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/78/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/78/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/78/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/78/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/78/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/78/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/78/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/78/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=78&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2008/07/05/looking-for-snagit-for-mac/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>

		<media:content url="http://img.skitch.com/20080705-tq4xjikqkfgekm4f8tfi2jajp7.preview.jpg" medium="image">
			<media:title type="html">Skitch.com &#62; amelia</media:title>
		</media:content>
	</item>
		<item>
		<title>Design tools and documents for a templated site</title>
		<link>http://communicationdesign.wordpress.com/2008/02/24/documenting-design-for-the-web/</link>
		<comments>http://communicationdesign.wordpress.com/2008/02/24/documenting-design-for-the-web/#comments</comments>
		<pubDate>Sun, 24 Feb 2008 17:56:42 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[css]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[training]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/?p=64</guid>
		<description><![CDATA[On our team, we&#8217;re exploring the best process for web design as we work from explorations of flows, into wireframes, finished page designs and on into developed pages. It&#8217;s often an iterative process as we refine how pages and interactive elements will interrelate, the best content to include, media and form factors for the content, [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=64&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>On our team, we&#8217;re exploring the best process for web design as we work from explorations of flows, into wireframes, finished page designs and on into developed pages. It&#8217;s often an iterative process as we refine how pages and interactive elements will interrelate, the best content to include, media and form factors for the content, and how to optimize for user experience. Also, a key objective in the process is to be sure the finished design document relies on the components and css of our templates.  We&#8217;re a relatively small group, so the more seamless and agile we can make the process of wireframing through design and development, the better.<span id="more-64"></span></p>
<p>The use of Indesign for templates and libraries for wireframing is certainly an option. Some members of our team went to a great session led by <a href="http://www.nathancurtis.com/" title="Nathan Curtis's site" target="_blank">Nathan Curtis</a> of <a href="http://www.eightshapes.com/" title="Eight Shapes User Experience and Design" target="_blank">Eight Shapes</a>. Lots of folks must be interested in this topic&#8211;Nathan is giving a sold out session on component libraries at a <a href="http://www.dctalks.org/design/" target="_blank">DC web design conference</a> next week.</p>
<p>However, our team is relatively small, and we frequently need to work quickly from design into development. Also, we&#8217;d like to find a way to build interactive prototypes, to test out the feel of a flow or interactive experience, prior to committing to full development, which can often be a big investment of time and resources&#8212;painful to go down that path and find we aren&#8217;t happy with the experience at the end of it. So we&#8217;re hoping to find a way to use Fireworks, with it&#8217;s <a href="http://www.adobe.com/designcenter/video_workshop/?id=vid0174" title="Using pages in Fireworks" target="_blank">pages and master pages</a>, libraries, <a href="http://www.adobe.com/designcenter/fireworks/articles/frwcs3_richsymbol.html" title="Rich symbols tutorial" target="_blank">rich symbols</a> and 9-slice functionality, as a means to work in a unified process flow through wireframing pages, creating <a href="http://www.adobe.com/go/vid0174" title="Rapid prototyping with rich symbols video" target="_blank">interactive prototypes</a> in some cases, bringing in more refined visuals from Photoshop and Illustrator, and delivering the final design file for development and porting over into our Typo3 templates all by using the same tool. This is a little different than the workflows posted in the Adobe Fireworks resources because we won&#8217;t want to export html or new css out of the Fireworks file in most cases, but be documenting which existing CMS templates and components to use, and be providing the images and text content within Fireworks to be ported over into those templates.</p>
<p>Last week our IA/UE designer, <a href="http://www.informativity.com/" title="Informativity Design" target="_blank">Michael Everitt</a>, attended our local Fireworks user group, <a href="http://www.fireonthebay.org/" title="SF Bay area Fireworks Community" target="_blank">Fireworks on the Bay</a>, and  connected with Adobe&#8217;s Fireworks evangelist, <a href="http://weblogs.macromedia.com/amusselman/" title="Alan Musselman" target="_blank">Alan Musselman</a> there. Apparently he&#8217;s been around the globe (or to Japan anyway) working with groups on this and other opportunities with Fireworks for web design and work flow. He&#8217;s agreed to visit our team so we can pick his brain, get his ideas on how Fireworks could work for us best in the model we&#8217;re envisioning. It&#8217;s a great opportunity for us to take the next step toward getting this into the works in the best way.</p>
<p>I came across a handy set of tools to help with documenting design into development. It&#8217;s a set of html stamps to use as notes on a design, to mark which html tag should be used. These are brush sets and libraries (depending on the application) from Twinsparc. Here&#8217;s their <a href="http://twinsparc.com/a/updated-htmlstamps/" target="_blank">updated post</a> about this, and also their <a href="http://twinsparc.com/a/using-html-stamps/" title="HTML stamps" target="_blank">original post</a> which contained a tutorial on use.</p>
<p>I&#8217;ll try to update here as we evolve our plan for a system of design templates, libraries and documentation for a smooth web design to development flow.</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/64/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/64/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/64/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/64/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/64/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/64/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/64/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/64/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/64/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/64/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/64/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/64/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=64&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2008/02/24/documenting-design-for-the-web/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>
	</item>
		<item>
		<title>Designing the interface, who&#8217;s this persona?</title>
		<link>http://communicationdesign.wordpress.com/2007/07/26/designing-the-interface-whos-this-persona/</link>
		<comments>http://communicationdesign.wordpress.com/2007/07/26/designing-the-interface-whos-this-persona/#comments</comments>
		<pubDate>Thu, 26 Jul 2007 14:40:30 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[UI]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[usability]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/2007/07/26/designing-the-interface-whos-this-persona/</guid>
		<description><![CDATA[There&#8217;s so much research and thinking going on, and great work, to create well-crafted interfaces for software and web apps. However, it boggles my mind thinking about what the future will be like as more and more apps enable the user to create their own interface, both in terms of the visuals and the arrangement [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=59&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>There&#8217;s so much research and thinking going on, and great work, to create well-crafted interfaces for software and web apps. However, it boggles my mind thinking about what the future will be like as more and more apps enable the user to create their own interface, both in terms of the visuals and the arrangement and availability of functional elements. At Word Camp, <a href="http://2007.wordcamp.org/schedule/wp-usability/" target="_blank">Liz Danzico shared</a> the persona-based research they did in the process of redesigning the Word Press admin interface. I saw the following screen on my 13-year-old daughter&#8217;s computer this morning, and wondered, if her persona had been included in research, what would they have discovered?</p>
<p><span id="more-59"></span>(Click on the picture to see the whole screen.)</p>
<p><a href="http://communicationdesign.files.wordpress.com/2007/07/usermodinterface.png" title="User-modified interface example"><img src="http://communicationdesign.files.wordpress.com/2007/07/usermodinterface.png" alt="User-modified interface example" /></a></p>
<p>Of course, it doesn&#8217;t take Facebook and a 13-year old to create a funny UI, I came across a Dracula look-alike in a serious business app yesterday.  More about that later.</p>
<p>To keep in mind, if you check back on her UI tomorrow, it will be entirely different! That&#8217;s why she puts so much energy into it, it&#8217;s actually a creative outlet, a personal expression, just as someone might have used a sketchbook or journal in the past. Here&#8217;s an idea for researchers: What if you could enable some kind of dynamic feed, and see what people are doing with their desktops, or Facebooks, or other modifiable interfaces?</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/59/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/59/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/59/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/59/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/59/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/59/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/59/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/59/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/59/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/59/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/59/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/59/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=59&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2007/07/26/designing-the-interface-whos-this-persona/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>

		<media:content url="http://communicationdesign.files.wordpress.com/2007/07/usermodinterface.png" medium="image">
			<media:title type="html">User-modified interface example</media:title>
		</media:content>
	</item>
		<item>
		<title>The fold is gone, or at least less important</title>
		<link>http://communicationdesign.wordpress.com/2007/07/25/the-fold-is-gone-or-at-least-less-important/</link>
		<comments>http://communicationdesign.wordpress.com/2007/07/25/the-fold-is-gone-or-at-least-less-important/#comments</comments>
		<pubDate>Wed, 25 Jul 2007 04:27:20 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[UI]]></category>
		<category><![CDATA[usability]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/2007/07/25/the-fold-is-gone-or-at-least-less-important/</guid>
		<description><![CDATA[Woah. People really USE the scroll bar. This is like turning a major preconception about web page design on it&#8217;s head. Read this detailed and well-presented story from AOL&#8217;s Director of UI, exploring when, and whether, the old concept of the &#8220;fold&#8221; on web pages (taken from the old newsstand analogy) really matters.
   [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=58&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>Woah. People really USE the scroll bar. This is like turning a major preconception about web page design on it&#8217;s head. Read this <a href="http://www.boxesandarrows.com/view/blasting-the-myth-of " target="_blank">detailed and well-presented story</a> from AOL&#8217;s Director of UI, exploring when, and whether, the old concept of the &#8220;fold&#8221; on web pages (taken from the old newsstand analogy) really matters.</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/58/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/58/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/58/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/58/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/58/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/58/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/58/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/58/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/58/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/58/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/58/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/58/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=58&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2007/07/25/the-fold-is-gone-or-at-least-less-important/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>
	</item>
		<item>
		<title>Icons and graphics in email newsletters</title>
		<link>http://communicationdesign.wordpress.com/2007/07/25/icons-and-graphics-in-email-newsletters/</link>
		<comments>http://communicationdesign.wordpress.com/2007/07/25/icons-and-graphics-in-email-newsletters/#comments</comments>
		<pubDate>Wed, 25 Jul 2007 03:53:21 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[HTML email]]></category>
		<category><![CDATA[conversions]]></category>
		<category><![CDATA[design]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/2007/07/25/icons-and-graphics-in-email-newsletters/</guid>
		<description><![CDATA[ Apple, milking the iPhone craze, sent out a variation on their usual email newsletter design today. It incorporated some icon-like graphics and new buttons with cta&#8217;s.
  
Wonder if these icons and varied buttons are worth thinking about incorporating in some email designs?
Here are some stories from etre.com that seem to substantiate this as [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=54&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><a href="http://communicationdesign.files.wordpress.com/2007/07/apple-email.png" title="Apple email"><img src="http://communicationdesign.files.wordpress.com/2007/07/apple-email.thumbnail.png" alt="Apple email" /></a> Apple, milking the iPhone craze, sent out a variation on their usual email newsletter design today. It incorporated some icon-like graphics and new buttons with cta&#8217;s.</p>
<p><a href="http://communicationdesign.files.wordpress.com/2007/07/applepeople.jpg" title="applepeople.jpg"><img src="http://communicationdesign.files.wordpress.com/2007/07/applepeople.jpg" alt="applepeople.jpg" /></a>  <a href="http://communicationdesign.files.wordpress.com/2007/07/apple_workshops.jpg" title="apple_workshops.jpg"><img src="http://communicationdesign.files.wordpress.com/2007/07/apple_workshops.thumbnail.jpg" alt="apple_workshops.jpg" /></a></p>
<p>Wonder if these icons and varied buttons are worth thinking about incorporating in some email designs?<span id="more-54"></span></p>
<p>Here are some stories from <a href="http://www.etre.com" target="_blank">etre.com</a> that seem to substantiate this as a successful approach.</p>
<p>IBM has had great results using icons and buttons to increase clicks in emails:</p>
<blockquote><p>emails that use clickable graphic icons or buttons to link to more details of a marketing offer drew stronger responses than links that use the text of an Internet address. When IBM incorporated graphical icons and buttons in its emails for its software group, <span class="hilite">click-through rates jumped 60%</span>.</p></blockquote>
<p>And Cisco has tried visuals at the bottom of newsletters to drive the reader&#8217;s eye further into the content:</p>
<blockquote><p>a &#8217;stronger use of imagery at the end of the newsletter so eyes scroll to the bottom,&#8217; says <a href="http://events.unisfair.com/mktprofs/microsite/Bios.asp?code=&amp;BiosName=Brian%20Ellefritz" target="_blank">Brian Ellefritz</a>, Cisco&#8217;s senior manger of Worldwide Demand Generation.</p></blockquote>
<p>This is apparently to offset the usual trend for people to only read/respond to material in the first third of the newsletter, which the article also mentions.</p>
<p><a href="http://www.etre.com/blog/2006/07/eyemail/" target="_blank">Read the story</a> on etre.com</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/54/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/54/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/54/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/54/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/54/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/54/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/54/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/54/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/54/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/54/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/54/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/54/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=54&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2007/07/25/icons-and-graphics-in-email-newsletters/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>

		<media:content url="http://communicationdesign.files.wordpress.com/2007/07/apple-email.thumbnail.png" medium="image">
			<media:title type="html">Apple email</media:title>
		</media:content>

		<media:content url="http://communicationdesign.files.wordpress.com/2007/07/applepeople.jpg" medium="image">
			<media:title type="html">applepeople.jpg</media:title>
		</media:content>

		<media:content url="http://communicationdesign.files.wordpress.com/2007/07/apple_workshops.thumbnail.jpg" medium="image">
			<media:title type="html">apple_workshops.jpg</media:title>
		</media:content>
	</item>
		<item>
		<title>Getting noticed: good design is noisy too</title>
		<link>http://communicationdesign.wordpress.com/2007/07/24/getting-noticed-good-design-is-noisy-too/</link>
		<comments>http://communicationdesign.wordpress.com/2007/07/24/getting-noticed-good-design-is-noisy-too/#comments</comments>
		<pubDate>Tue, 24 Jul 2007 06:38:39 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[conversions]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[web design]]></category>
		<category><![CDATA[web optimization]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/2007/07/24/getting-noticed-good-design-is-noisy-too/</guid>
		<description><![CDATA[Right on the heels of posting about the merits of transparent design, a project today turned that approach right on it&#8217;s head. When you&#8217;re designing a banner ad, or a &#8220;pod&#8221; on a content page, you want to get noticed. The first objective of a banner ad is to attract attention. If it fit in [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=53&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>Right on the heels of posting about <a href="http://communicationdesign.wordpress.com/2007/07/24/not-getting-noticed-good-design-is-invisible/" title="How not to get noticed">the merits of transparent design</a>, a project today turned that approach right on it&#8217;s head. When you&#8217;re designing a banner ad, or a &#8220;pod&#8221; on a content page, you <strong>want</strong> to get noticed. The first objective of a banner ad is to attract attention. If it fit in seamlessly with its surroundings, or looked just like the banner ad you saw (and overlooked) yesterday, why bother? It would just be filler. You can&#8217;t get your message across, much less expect a response, if you can&#8217;t pull them over to your corner in the first place.<span id="more-53"></span></p>
<p>That&#8217;s not to say that you want to be annoying and drown out everybody else, especially if you&#8217;re putting an element on a branded, corporate site. For instance, some web email clients host horrendous animated ads. (Actually they&#8217;d be really funny, if they didn&#8217;t distract so much from trying to read your email). So, that solution isn&#8217;t appropriate: It&#8217;s hard to harmonize with an orchestra when you&#8217;re playing a Hendrix style solo on an electric guitar. On the other hand, a solo on an orchestral instrument is totally appropriate, and even keeps interest going in the piece, or the page, as a whole. Perfect harmony, an entirely predictable page you might have seen yesterday, isn&#8217;t going to spark interest.</p>
<p>A web page which serves as a portal to a huge amount of varying content is a stage for competing elements. There&#8217;s a critical balance to strike. You&#8217;re trying to appeal to many kinds of people with a variety of needs and interests&#8212;and behind the scenes there are business owners with a variety of competing goals. On one side of the scale, each of the page elements wants a voice. On the other side, you&#8217;ve got to have some coherent framework, or harmony. To really work with this balance, you need to go beyond evaluating individual elements on a case-by-case basis, to see if they&#8217;re in tune with the orchestra, and view the noisiness of the page as a whole from the standpoint of your audience. How much dissonance and variety is going to work for what you&#8217;re trying to achieve?<br />
The bigger issue is to make the whole page noisy enough, in the right way, to drive interest in the content and what you offer. Here&#8217;s an old-style example. My dad was a newspaper editor, and since he usually worked for the underdog paper in various cities, newsstand sales were key. For newsstand sales, your front page is everything: it&#8217;s your POP display, your advertising, and your product. His approach was to mix a wide variety of content there to appeal to many kinds of people. If a q and a with a business tycoon didn&#8217;t pull, the story about the trapped elephant or a city hall snafu would. Lots of kinds of noise, skillfully shepherded into one container. If it wasn&#8217;t so skillful one day, it got changed and reinvigorated the next. (That was how early testing went.) I saw the same thing on the <a href="http://www.dailymail.co.uk" target="_blank">London Daily Mail</a> where I worked for a while: put some noisy content out, run out to the newstands to see how sales are going&#8212;did you beat the competition?, run back in and rework for the next edition quick if not.</p>
<p>I&#8217;m not sure if that analogy totally works for a content-heavy company web portal. But today, when the web is so alive, and it is (or should be) so easy to respond and swap out elements, it seems like a good time to take a few risks and try new things, even on a more controlled, corporate presence.</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/53/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/53/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/53/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/53/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/53/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/53/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/53/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=53&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2007/07/24/getting-noticed-good-design-is-noisy-too/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>
	</item>
		<item>
		<title>Personalizing gmail and del.icio.us interface</title>
		<link>http://communicationdesign.wordpress.com/2007/07/24/personalizing-gmail-and-delicious-interface/</link>
		<comments>http://communicationdesign.wordpress.com/2007/07/24/personalizing-gmail-and-delicious-interface/#comments</comments>
		<pubDate>Tue, 24 Jul 2007 05:15:52 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[Design tools]]></category>
		<category><![CDATA[free stuff]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/2007/07/24/personalizing-gmail-and-delicious-interface/</guid>
		<description><![CDATA[Quick tip: Speaking of creating applications that people can modify to suit themselves, here&#8217;s a way to modify your gmail or del.icio.us interface to be friendlier and lots better looking. Thanks to Web Worker Daily.
       <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=51&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>Quick tip: Speaking of creating applications that people can modify to suit themselves, here&#8217;s a way to <a href="http://webworkerdaily.com/2007/04/27/give-your-favorite-web-applications-a-face-lift/" target="_blank">modify your gmail or del.icio.us interface</a> to be friendlier and lots better looking. Thanks to Web Worker Daily.</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/51/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/51/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/51/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/51/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/51/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/51/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/51/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/51/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/51/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/51/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/51/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/51/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=51&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2007/07/24/personalizing-gmail-and-delicious-interface/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>
	</item>
		<item>
		<title>Not getting noticed: Good design is invisible</title>
		<link>http://communicationdesign.wordpress.com/2007/07/24/not-getting-noticed-good-design-is-invisible/</link>
		<comments>http://communicationdesign.wordpress.com/2007/07/24/not-getting-noticed-good-design-is-invisible/#comments</comments>
		<pubDate>Tue, 24 Jul 2007 04:57:49 +0000</pubDate>
		<dc:creator>Amelia</dc:creator>
				<category><![CDATA[blogs]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://communicationdesign.wordpress.com/2007/07/24/not-getting-noticed-good-design-is-invisible/</guid>
		<description><![CDATA[Dateline WordCamp 2007! Wow, so much to learn, and so many great geeks, but one of the most interesting presentations for me was from Information Architect/Usability Expert Liz Danzico of Happy Cog and Boxes and Arrows. She spoke to how great design for interaction is invisible to the user: you only notice design for function [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=50&subd=communicationdesign&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>Dateline <a href="http://2007.wordcamp.org/schedule/wp-usability/" target="_blank">WordCamp 2007</a>! Wow, so much to learn, and so many great geeks, but one of the most interesting presentations for me was from Information Architect/Usability Expert <a href="http://bobulate.com/" title="Liz Danzico's blog" target="_blank">Liz Danzico</a> of <a href="http://www.happycog.com/" title="Happy Cog - Great web design resource" target="_blank">Happy Cog</a> and <a href="http://www.boxesandarrows.com/" title="Boxes and Arrows" target="_blank">Boxes and Arrows</a>. She spoke to how great design for interaction is invisible to the user: you only notice design for function when it&#8217;s bad. When design works there&#8217;s no friction, and you can just go about doing what you intended. Good design anticipates what you need without making a big deal about it.</p>
<p>However, anticipating what people need isn&#8217;t the easiest thing in the world to do, and can have unanticipated pitfalls.<span id="more-50"></span></p>
<p>Liz told a very funny story about fancy new-fangled elevators in New York (apparently they have them at the New York Times) which have been designed to help you out. You tell them where you&#8217;re going, and you get directed to the right elevator bank and the elevator goes to the right floor. But what if you meet a co-worker on the way who tells you about a meeting elsewhere you should be going to? You have no way to redirect. So there&#8217;s been frustration about that. Fortunately, here in Silicon Valley, we usually have buildings with fewer elevators and fewer floors&#8230; so far anyway.</p>
<p>In some cases, if the landscape/interface is too hard to use as designed, people will modify it to suit their needs: look at all the dirt paths that show up, cutting across the corners, for instance on town squares and university quads. (Remember those well at Chapel Hill.)</p>
<p>Happy Cog has used some guiding principles in their usability analysis (and future redesign) of the admin interface for Word Press. One, as above, is to anticipate user needs, but in a more highly functional way. Anticipate peoples&#8217; need to modify the landscape: <strong>allow users to customize the system to make it work for them</strong>. Especially for a system or task people use over and over again this makes so much sense.</p>
<p>For Word Press, Happy Cog constructed five user types, or personas, to help structure their usability research.  These were based on expertise and familiarity with the application, as well as frequency of use. Then, they visited people in their own environments using Word Press.  Apparently this involved lots of smoke and coffee in some cases <img src='http://s.wordpress.com/wp-includes/images/smilies/icon_wink.gif' alt=';-)' class='wp-smiley' />  That way, they got information through observation: how people actually use Word Press as opposed to how they say they use it. Liz did say that Word Press users tended to be a smart bunch, and this often coincided.</p>
<p>One very interesting bit she shared was the idea they tested of basing the admin functions on object-oriented nouns rather than verbs. Many new interfaces, for <a href="http://www.vox.com/" title="Vox Free Blogging" target="_blank">Vox</a>, <a href="http://www.tumblr.com/" title="Tumblr sharing" target="_blank">Tumblr</a>, and iPhone, base functions in the interface on images that represent nouns, rather than verbs, as the Word Press admin interface does (Write, Manage). However, when she tried this model with Word Press users, by using card stacks and other methods, they couldn&#8217;t wrap their heads around it, it just didn&#8217;t make sense. The activity of writing seems to be the compelling concept, not the concept of a collection of things&#8212;posts or pages.</p>
<p>They took a serious look at the log in page, and found that most of the main panel contained content that people almost never use. So it&#8217;s likely to go. (This kind of analysis is related to the ideas <a href="http://2007.wordcamp.org/schedule/designing-the-obvious/" title="Designing the Obvious" target="_blank">Robert Hoekman</a> discussed the previous day, more on that in a future post.) She previewed a few wireframes of design changes that will be coming in the 2.4 version of Word Press. Looks like it will be more widget-based (Netvibes, etc.) which would be wonderful.</p>
<p>Some more guiding principles:</p>
<ul>
<li>Try to BE the user of the software you&#8217;re developing.</li>
<li>Don&#8217;t surprise people.</li>
<li>Show, don&#8217;t tell.</li>
<li>Don&#8217;t be brief at the cost of clarity. (Reminds me of that oft-quoted principle from Einstein, that things should be as simple as possible and no simpler.)</li>
<li>Findability, consistency</li>
<li>But most of all: transparent design, unself-consciously present.</li>
</ul>
<p>Really a fabulous presentation, gave me lots to think about.</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/communicationdesign.wordpress.com/50/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/communicationdesign.wordpress.com/50/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/communicationdesign.wordpress.com/50/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/communicationdesign.wordpress.com/50/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/communicationdesign.wordpress.com/50/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/communicationdesign.wordpress.com/50/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/communicationdesign.wordpress.com/50/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/communicationdesign.wordpress.com/50/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/communicationdesign.wordpress.com/50/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/communicationdesign.wordpress.com/50/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/communicationdesign.wordpress.com/50/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/communicationdesign.wordpress.com/50/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=communicationdesign.wordpress.com&blog=1104710&post=50&subd=communicationdesign&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://communicationdesign.wordpress.com/2007/07/24/not-getting-noticed-good-design-is-invisible/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
	
		<media:content url="http://0.gravatar.com/avatar/c65c353367d9456fc941ff58fe2ba886?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">Amelia</media:title>
		</media:content>
	</item>
	</channel>
</rss>