<?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>David Little</title>
	<atom:link href="http://www.littled.net/category/interaction-design/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.littled.net</link>
	<description>User interface designer</description>
	<lastBuildDate>Sun, 22 Jan 2012 17:21:16 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1</generator>
		<item>
		<title>The innovative museum</title>
		<link>http://www.littled.net/2011/12/01/the-innovative-museum/</link>
		<comments>http://www.littled.net/2011/12/01/the-innovative-museum/#comments</comments>
		<pubDate>Thu, 01 Dec 2011 14:07:38 +0000</pubDate>
		<dc:creator>wdavid</dc:creator>
				<category><![CDATA[crowdsourcing]]></category>
		<category><![CDATA[cultural heritage]]></category>
		<category><![CDATA[interaction design]]></category>
		<category><![CDATA[museums]]></category>

		<guid isPermaLink="false">http://www.littled.net/?p=1575</guid>
		<description><![CDATA[I attended the UK Museums on the Web conference last week and was very impressed with the kinds of digital projects that were being undertaken and the user-centric methodologies underpinning the design and delivery of them. <a href="http://www.littled.net/2011/12/01/the-innovative-museum/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>I attended my first <a href="http://museumscomputergroup.org.uk/2011/08/26/uk-museums-on-the-web-2011-2/">UK Museums on the Web</a> conference last week at the <a href="http://www.iwm.org.uk/">Imperial War Museum</a> and have to say was very impressed with the kinds of digital projects that were being undertaken and the user-centric methodologies underpinning the design and delivery of them.</p>
<p>The presentations covered a wide range of topics relating to digital museums, from planning a realistic digital strategy to refining your metadata but those I found of particular interest related to engaging and involving users in building and using digital resources, a topic I&#8217;ve been finding myself more and more interested in of late&#8211;addressing those nagging questions about exactly why and for whom we in the digital cultural heritage and humanities sectors are building these resources in the first place.</p>
<p>Museums and galleries arguably have a head start when it comes to involving users in projects: direct access to them as visitors to their institutions. This is something that the <a href="http://blogs.iwm.org.uk/social-interpretation/">Social Interpretation</a> project at the Imperial War Museum (IWM) is making the most of: a project to record visitors&#8217; interpretations of exhibits, bringing them the same ability to share and discuss found on the social web to the museum space, via in-museum devices, the web and mobile apps.</p>
<p>This project is putting the user at the centre of the design process, both directly via testing of prototypes and observation of user behaviour in the galleries.  Interestingly, it&#8217;s also been run entirely according to an <a href="http://agilemanifesto.org/">agile methodology</a>&#8211;not just the development but the design and management, so I&#8217;m really looking forward to hearing more about this.</p>
<p>Another participatory IWM project being developed is Lives of the Great War&#8211;a crowdsourced project to create stories of those who served and died in the First World War. This is being done principally by enabling access to the various appropriate information sources distributed across the Web, some of which are behind paywalls, via a single access point. The plan is to archive the resource permanently and also to release the data under a &#8220;<a href="http://creativecommons.org/publicdomain/zero/1.0/">CCO</a>&#8221; licence (the most permissive Creative Commons licence); making the data available for reuse in a number of contexts.</p>
<p>The <a href="http://www.outsidein.org.uk/">Outside In</a> project, run by the <a href="http://www.pallant.org.uk/">Pallant House Gallery</a> is a slightly different participatory project&#8211;providing a space for artists traditionally unable to engage with the artistic mainstream due to disability or social circumstance to display their work. The interface for doing this was developed iteratively, including in workshops with the artists themselves. The next stage is a mobile app&#8211;not for the sake of developing one but because interaction via a mobile device involves fewer cognitive steps, e.g. the need to understand concepts such as file structures when uploading content from your computer&#8217;s file storage. With a mobile app, the device which records the art work can also be used to upload it directly.</p>
<p>I was fortunate enough to be elected to the committee of the conference&#8217;s organising body, the <a href="http://www.museumscomputergroup.org.uk/">Museums Computer Group</a>&#8211;something I&#8217;m very excited about. The levels of innovation and creativity in the sector are very impressive and I&#8217;m looking forward to learning and sharing more with all involved.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.littled.net/2011/12/01/the-innovative-museum/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Reading digitally</title>
		<link>http://www.littled.net/2011/04/21/reading-digitally/</link>
		<comments>http://www.littled.net/2011/04/21/reading-digitally/#comments</comments>
		<pubDate>Thu, 21 Apr 2011 12:21:54 +0000</pubDate>
		<dc:creator>wdavid</dc:creator>
				<category><![CDATA[interaction design]]></category>
		<category><![CDATA[reading]]></category>

		<guid isPermaLink="false">http://www.littled.net/?p=1301</guid>
		<description><![CDATA[Dead books? I recently rediscovered the dissertation for my Master&#8217;s degree in library and information studies back in 1999. Having struggled to find anything that really interested me in the rest of that course, my module in &#8220;electronic publishing&#8221; inspired &#8230; <a href="http://www.littled.net/2011/04/21/reading-digitally/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<div id="dig-reading-intro" class="line">
<div class="bodyContent unit size1of2">
<h3 id="dig-reading-dead-books">Dead books?</h3>
<p>I recently rediscovered the dissertation for my Master&#8217;s degree in library and information studies back in 1999. Having struggled to find anything that really interested me in the rest of that course, my module in &#8220;electronic publishing&#8221; inspired me to go for the slightly sensationalist title, &#8220;A history of the death of the book 1990-2000&#8243;. In it I looked at  contemporary views on the death of the printed book, examining the utopian views of post-modernist literary theorists on the potentials of hypertext fiction and the opposing dystopian fears that moving from print to digital posed little less than a fundamental threat to Western civilisation.</p>
<p>It&#8217;s not a great piece of work&#8211;it was written in a bit of a hurry while holding down a temporary job. However it&#8217;s interesting to me not only as a personal historical document, but also for its mention of what were becoming known as &#8216;e-book readers&#8217;. References to ClearType and &#8216;digital paper&#8217; aside it&#8217;s clear that these devices were for early adopters only.</p>
<p>Fast-forward another eleven or so years and I&#8217;m the proud new owner of an Amazon Kindle, astounded by the quality of the e-ink display. However there&#8217;s something about it that reminds me of the Web back in the early to mid &#8217;90s: a technology full of potential but one that is a little limited in its current format. A reminder perhaps that we&#8217;re not yet in a brave new age of digital reading but rather starting to explore new modes of publishing and reading.</p>
</div>
<div class="bodyContent unit size1of2 last">
<ul class="toc">
<li class="toc-item"><strong>Table of contents</strong></li>
<li class="toc-item"><a href="#dig-reading-dead-books">Dead books?</a></li>
<li class="toc-item"><a href="#dig-reading-long-short">Long and short form digital reading</a></li>
<li class="toc-item"><a href="#dig-reading-current-models">The current landscape</a></li>
<li class="toc-item"><a href="#dig-reading-challenges">Challenges</a></li>
<li class="toc-item"><a href="#dig-reading-ways-forward">The way forward</a></li>
<li class="toc-item"><a href="#dig-reading-design-distribution">Design and distribution</a></li>
<li class="toc-item"><a href="#dig-reading-good-news">Good news for trees?</a></li>
</ul>
<h3 id="dig-reading-long-short">Long and short form digital reading</h3>
<p>In this post I want to concentrate on the current situation of&#8211;and possibilities for&#8211;digital long-form reading. When I say long-form reading I specifically mean books, or longer texts. Short-form reading (blog posts and magazine articles etc.) is undergoing its own revolution, with tools such as <a href="http://reederapp.com/">Reeder</a>, <a href="http://www.instapaper.com/">Instapaper</a>, <a href="http://www.treesaver.net/">Treesaver</a>, <a href="https://www.readability.com/">Readability</a> and <a href="http://flipboard.com/">Flipboard</a> helping to transform the way this content is produced and consumed.</p>
<p>Long-form digital reading I believe faces a number of challenges. Leaving aside any copyright etc. issues and concentrating on the experience of reading itself I see these principally as device limitations and uncertain publishing ecosystems.</p>
</div>
</div>
<div id="dig-reading-current-models" class="line thick-separator grey">
<div class="bodyContent unit size1of2">
<h3>The current landscape</h3>
<p>Digital long-form reading can currently be experienced in a number of ways. <a href="http://blog.archive.org/2010/10/22/books-in-browsers-keynote-speech-by-brewster-kahle/">Brewster Kahle in his speech to the 2010 Books in Browsers conference</a> summarised these as in-device, in-app and in-browser&#8211;terms which I will shamelessly borrow here.</p>
<p><strong>In-device</strong></p>
<p>Specialised ebook readers such as the <a href="http://www.amazon.co.uk/dp/B002Y27P46">Kindle</a> allow readers to purchase titles from an online store and transfer them to their device via a network.</p>
<p>These kind of devices tend to use advanced text-rendering technology, such as the Kindle&#8217;s e-ink which makes them pretty much as easy to read as a printed book, although they are limited in terms of only being monochromatic and feature limited typographic and formatting choices. As a result they tend to be best for what <a href="http://craigmod.com/journal/ipad_and_books/">Craig Mod calls &#8220;formless content&#8221;</a>, i.e. text that can be consumed divorced from any particular requirements of layout, such as novels or common non-fiction works. They&#8217;re not so good at displaying content that depends on layout for its comprehension &#8211;e.g. works displaying complex data or with more advanced layout needs.</p>
<p>Smart phones such as the iPhone are similar to e-book readers in that they have limited screen real estate, although they may also be able to make use of the device&#8217;s OS to provide more layout options (changing orientations, more fonts, colour displays, embedded multimedia options etc.). Tablets such as the iPad provide increased screen space, although usually with less detailed screen resolutions.</p>
</div>
<div class="unit size1of2 bodyContent">
<p><strong>In-app</strong></p>
<p>Amazon offers Kindle as an app&#8211;for iOS, Android, Mac and PC. This allows readers to access their library of purchased and free items on a number of devices. Kindle app still provides limited formatting possibilities, and clearly cannot provide such an easy reading experience as the content is now divorced from the e-ink screen.</p>
<p>Other app-based publishers include <a href="http://www.enhanced-editions.com/">Enhanced Editions</a> which produces digital texts for iPhone only&#8211;in addition to the text of a work they also provide an audio soundtrack of the content read by the author and additional embedded video components. <a href="http://www.inkling.com/"></a></p>
<p><strong>In-browser</strong></p>
<p>As soon as content moves to the browser it is free of the limitations of proprietary technologies and can be consumed with any device with a browser and network connection. Craig Mod has produced a layout framework for formatting long-form texts, <a href="http://craigmod.com/bibliotype/">Bibliotype</a> and the Internet Archive&#8217;s <a href="http://openlibrary.org/">Open Library</a> is an impressive endeavour to provide access to digitised texts via the browser: readers can view texts online, &#8220;borrow&#8221; them from the library or where available, buy them from a supplier.</p>
<p>Open Library has a very usable interface and allows the reader to read page by page, skip ahead using a slider, view page thumbnails or search the text. The texts are scanned digital images so it is not possible to highlight, copy or paste content. However, they are of course perfect reproductions of printed works.</p>
</div>
</div>
<div class="line thick-separator grey">
<div class="unit size1of3 bodyContent">
<p><a href="http://localhost:8888/pog/wp-content/uploads/2011/04/kindle.jpg"></a><a rel="attachment wp-att-1305" href="http://www.littled.net/?attachment_id=1305"><img class="alignnone size-full wp-image-1305" title="Kindle" src="http://localhost:8888/littled/wp-content/uploads/2011/04/kindle1.jpg" alt="" width="260" height="355" /></a></p>
<p>In-device: Kindle</p>
</div>
<div class="unit size1of3 bodyContent">
<p><a href="http://localhost:8888/pog/wp-content/uploads/2011/04/ibooks.jpg"></a><a rel="attachment wp-att-1306" href="http://www.littled.net/?attachment_id=1306"><img class="alignnone size-full wp-image-1306" title="iBooks" src="http://localhost:8888/littled/wp-content/uploads/2011/04/ibooks.jpg" alt="" width="260" height="355" /></a></p>
<p>In-app: iBooks on iPhone</p>
</div>
<div class="unit size1of3 bodyContent">
<p><a href="http://localhost:8888/pog/wp-content/uploads/2011/04/open-lib.png"></a><a rel="attachment wp-att-1307" href="http://www.littled.net/?attachment_id=1307"><img class="alignnone size-full wp-image-1307" title="Open Library" src="http://localhost:8888/littled/wp-content/uploads/2011/04/open-lib.png" alt="" width="260" height="355" /></a></p>
<p>In-browser: Open Library</p>
</div>
</div>
<div id="dig-reading-challenges" class="line thick-separator grey">
<div class="bodyContent unit size1of2">
<h3>Challenges</h3>
<p>Digital reading devices all have their own shortcomings. The Kindle and similar devices are bound by screen size and limited formatting possibilities, phones have an even more limited screen sizes and phones, tablets and laptop or desktop computers all use back-lit screens which, even with high resolutions, are tiring to read on for any length of time.</p>
<p>Devices other than dedicated e-book readers also run a multitude of other applications all vying for the user&#8217;s attention. It is difficult to concentrate on a text at the same time as being open to incoming phone calls, emails and Tweets.</p>
<p><a href="http://www.zeldman.com/2010/10/17/ipad-as-the-new-flash/">Like others far wiser than me</a> I&#8217;m sceptical about pushing content via native apps when the browser can provide much the same functionality and experience, with the added advantage that it is device-agnostic&#8211;as long as your device can run an up-to date browser and has connectivity.</p>
<p>Sellers and publishers might prefer the app environment as it allows them to sell content in a controlled and locked-down ecosystem. But what happens if you move away from a device-specific environment to another. For example you can&#8217;t view your ePub files on a Kindle or your Kindle files on iBooks. You can of course convert them if you wish using software such as <a href="http://calibre-ebook.com/">Calibre</a>, but even then it&#8217;s unlikely you&#8217;ll get a faithful copy of the original.</p>
</div>
<div class="unit size1of2 bodyContent last">
<h3 id="dig-reading-ways-forward">The way forward</h3>
<p>Take a look at <a href="http://www.amazon.co.uk/gp/bestsellers/digital-text/341689031/ref=pd_ts_zgc_kinc_341689031_mor1?pf_rd_p=213619787&amp;pf_rd_s=right-5&amp;pf_rd_t=101&amp;pf_rd_i=341689031&amp;pf_rd_m=A3P5ROKL5A1OLE&amp;pf_rd_r=0HPGZ1KYVPR7NR71REMY">Amazon&#8217;s top ten selling books for the Kindle</a> and you&#8217;ll see that they&#8217;re pretty much crime fiction and thrillers. Making predictions is a mug&#8217;s game but I&#8217;d be surprised if the mainstreaming of digital texts will herald a desire for the kind of hypertext fiction that late Twentieth century literary theorists got so excited about.</p>
<p>We&#8217;re still bound by the notion of the page with e-books. Open Library and iBooks use page turning interaction metaphors and <a href="http://www.amazon.com/gp/help/customer/display.html?nodeId=200529700">Amazon recently announced it would be including page numbers for Kindle books</a>. This is an indication of both the printed book&#8217;s place in culture and society and the fact as a technology it&#8217;s pretty much faultless.</p>
<p>So&#8211;I can&#8217;t see the form or content of digital texts departing radically from their printed counterparts at any time soon. The main reason electronic texts are becoming so popular is that they offer convenience above all else. They are easily purchased, transported and, in the case of more &#8220;disposable&#8221; texts don&#8217;t even clog up much-needed space on your bookshelves. Bad news for charity shops though.</p>
<p>I believe the way forward is to improve the e-book experience&#8211;from the ways electronic texts are designed and can be read to the ways they can be purchased or &#8220;borrowed&#8221;.</p>
</div>
</div>
<div class="line thick-separator grey">
<div class="unit size1of2 bodyContent">
<h3 id="dig-reading-design-distribution">Design</h3>
<p>Maybe unsurprisingly I do believe the browser is the way forward. Digitised images of texts are fine for older works or works where a copy of the physical presentation of the text is important but HTML makes more sense for new titles. Ever improving typographic possibilities in browsers and the wider adoption of HTML5 mean that in-browser books can provide a richer experience for the reader that could be achieved in-device or in-app.</p>
<p>The creation of new <a href="http://en.wikipedia.org/wiki/Canons_of_page_construction">canons for e-book design</a> will ultimately need to reflect what readers read (or what they&#8217;d like to read), how and when they read and the kind of devices they read on. Interfaces need to be &#8220;quiet&#8221;  and cut down on clutter so as not to encourage the attention away from the text. The Kindle (device), iBooks, Open Library and Bibliotype are already  doing this very well.</p>
<p>The design needs to be responsive to the device being used. Again Bibliotype shows a way that this can be done. Laptops and desktops might need special consideration&#8211;after all if I choose to maximise a reading window to reduce visual noise from other applications I still want to be able to read text that&#8217;s not huge or running on forever. Having said that, I don&#8217;t think laptops or desktops are ever going to be the best tool for long-form reading.</p>
</div>
<div class="unit size1of2 bodyContent">
<p>We need better displays too. The best e-book design in the world is still going to be difficult to read for any extended period of time on a back-lit screen. Whether the solution is a wider adoption of e-ink style technology (in colour) or some kind of ability to switch between types of screen display I don&#8217;t really know. However it is an issue. The best back-lit screen I currently use is my iPhone&#8217;s Retina display. Even with this incredibly detailed resolution and the ability to dim the screen in iBooks, it can&#8217;t compare to the Kindle in terms of easiness on the eye.</p>
<h3>Distribution</h3>
<p>As a reader I want to be able to easily purchase and view books without being locked in to any particular device&#8217;s or manufacturer&#8217;s platform or store. I want to own my e-books and be able to take my library with me should I change device or if support for older formats is discontinued.</p>
<p>Open Library has made some efforts to replicate &#8220;lending&#8221; of e-books but I&#8217;m not convinced that the one copy to one reader model is practical in the longer term, particularly as Open Library&#8217;s membership grows. What about lending on the basis of limiting the time e-books can be viewed or downloaded for, along the lines of the <a href="http://www.bbc.co.uk/iplayer/">BBC iPlayer</a> model?</p>
</div>
</div>
<div class="line thick-separator grey">
<div class="unit size1of1 bodyContent">
<h3 id="dig-reading-good-news">Good news for trees?</h3>
<p>E-books are not only here and being used, <a href="http://www.guardian.co.uk/books/2011/apr/15/ebook-sales-milestone">they&#8217;re becoming increasingly popular</a>. What will this mean for print books? I&#8217;m convinced by Craig Mod&#8217;s view that &#8220;formless&#8221; content is best suited for the current breed of e-book readers and devices, whilst content which has more exacting layout and design needs is best handled by print media, and the iPad and similar devices.</p>
<p>However, we&#8217;re still at an early stage with e-books and it&#8217;s anyone&#8217;s guess what will happen in the coming years. Ultimately E-books need to be not just easy to buy but also to manage, archive, be viewable on any device, but above all, be readable.</p>
<p><strong>Note</strong>: just as I was preparing to publish this I noticed a news story on the Guardian website: <a href="http://www.guardian.co.uk/books/2011/apr/21/kindle-borrow-ebooks-libraries-amazon">Kindle readers can now borrow ebooks from libraries</a> (21 April 2011). This looks like promising news, although it currently only relates to the US.</p>
</div>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.littled.net/2011/04/21/reading-digitally/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Some thoughts on the Kindle</title>
		<link>http://www.littled.net/2011/03/22/some-thoughts-on-the-kindle/</link>
		<comments>http://www.littled.net/2011/03/22/some-thoughts-on-the-kindle/#comments</comments>
		<pubDate>Tue, 22 Mar 2011 15:08:19 +0000</pubDate>
		<dc:creator>wdavid</dc:creator>
				<category><![CDATA[interaction design]]></category>
		<category><![CDATA[reading]]></category>

		<guid isPermaLink="false">http://www.littled.net/?p=1282</guid>
		<description><![CDATA[I&#8217;ve had my Kindle for just under a week and am really enjoying it, although on (electronic ink-enhanced) paper its chances don&#8217;t too good. Let&#8217;s face it, it&#8217;s not going to have people cooing over its interaction design, more likely &#8230; <a href="http://www.littled.net/2011/03/22/some-thoughts-on-the-kindle/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve had my Kindle for just under a week and am really enjoying it, although on (electronic ink-enhanced) paper its chances don&#8217;t too good. Let&#8217;s face it, it&#8217;s not going to have people cooing over its interaction design, more likely squinting to read the tiny keyboard trying to find where the numbers have gone (under &#8220;Sym&#8221; naturally). Its browser wouldn&#8217;t look out of place on a <a href="http://en.wikipedia.org/wiki/Zx81">ZX81</a> and the flash of black that occurs when the page is &#8220;turned&#8221; should come with a warning for epileptics.</p>
<p>Still, the Kindle&#8217;s weaknesses are really its strength: in my view it&#8217;s good for one thing and one thing only &#8212; reading with no distractions. And at that it pretty much excels. The electronic ink display is amazing. When I first got it out of its box I thought I had to peel a sticker off before I used it, not realising it was actually in sleep mode and displaying one of its wallpaper images of famous authors.</p>
<p>I don&#8217;t claim to understand how the E-ink works but it looks pretty close to a printed page, making it a complete joy to read. The iPad may be streets ahead in every other respect but are you really going to want to read a book on a back-lit screen &#8212; I know I wouldn&#8217;t. If you want a comparison between the two displays (literally under the gaze of a microscope), check out this blog post: <a href="http://www.bit-101.com/blog/?p=2722">Kindle and iPad displays: up close and personal</a>.</p>
<p>So, I&#8217;m undecided what I&#8217;m going to use it for. My main reason for justifying it to myself was I could use it as a way of catching up on all those blog posts I never get round to reading. If you use <a href="http://www.instapaper.com/">Instapaper</a> you can download your subscriptions and email them or transfer them via USB to the Kindle, meaning you never need to feel guilty about hitting the &#8220;Read later&#8221; button again.</p>
<p>I think it&#8217;s also the natural home for tech books, well at least the ones that don&#8217;t have high production values and pretty photos &#8212; which is most of them. I might try some newspaper / magazine subscriptions too (come on Guardian, your iPhone app is fantastic, it would be great to have some kind of Kindle version too). Although I&#8217;m still attached to printed books in so many ways I could imagine reading a novel on it too, so we&#8217;ll see.</p>
<p>I bought the Wifi only version and to be honest can&#8217;t really imagine any situation in which I&#8217;d need the 3G. I have tried to read my Gmail via the browser but to be honest it&#8217;s about as much fun as stabbing a fork in your head so I think I can live without instant Web access.</p>
<p><em>Originally posted on <a href="http://littled.posterous.com/some-thoughts-on-the-kindle">Posterous</a> (6 November 2010)</em>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.littled.net/2011/03/22/some-thoughts-on-the-kindle/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Weave: visualising browser data</title>
		<link>http://www.littled.net/2009/09/25/weave-visualising-browser-data/</link>
		<comments>http://www.littled.net/2009/09/25/weave-visualising-browser-data/#comments</comments>
		<pubDate>Fri, 25 Sep 2009 07:24:13 +0000</pubDate>
		<dc:creator>wdavid</dc:creator>
				<category><![CDATA[interaction design]]></category>

		<guid isPermaLink="false">http://www.littled.net/new/?p=338</guid>
		<description><![CDATA[Mozilla&#8217;s Web Weave UI design challenge seeks to find solutions to the issue of visualising browser data accumulated across a number of devices, such as: Bookmarks History Tabs Stored credentials The Mozilla Weave project aims to allow synchronisation of this &#8230; <a href="http://www.littled.net/2009/09/25/weave-visualising-browser-data/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Mozilla&#8217;s Web Weave UI design challenge seeks to find solutions to the issue of visualising browser data accumulated across a number of devices, such as:</p>
<ul>
<li>Bookmarks</li>
<li>History</li>
<li>Tabs</li>
<li>Stored credentials</li>
</ul>
<p>The Mozilla Weave project aims to allow synchronisation of this information across different Firefox instances. However, this particular design challenge is looking at ways that this information may be shared across different browsing devices when access to Firefox isn&#8217;t possible, i.e. via a web page.</p>
<p>Details of my proposal follow. It has been in part influenced by the findings of one of the Challenge&#8217;s recommended readings: Jason Hong, <a href="http://www.cs.cmu.edu/~jasonh/publications/CHI2009-contextual-web-history-submitted.pdf">Contextual Web History: Using Visual and Contextual Cues to Improve Web Browser History</a> (PDF), and other existing web-based mechanisms for managing visual assets (e.g. Flickr).</p>
<p>One of the findings of the paper was that visual cues in the shape of thumbnail images of visited websites helped users to better identify sites in their browsing history: the most useful size of these thumbnails was found to be around 235 by 148 pixels (p.5). This visual approach to representing history is being used by other browsers, including Safari and Chrome.</p>
<p>My idea expands on the use of visual cues for browsing history and also applies them them to bookmarks, tabs, credentials and history. As the data in this example becomes visual, it also lends itself to being managed by tools similar to those for managing photos and other visual assets on social networking sites. The <a href="http://www.flickr.com">Flickr</a> model of page layout and set (&#8220;folder&#8221;) management, mainly due to its familiarity to me seemed to be of particular use.</p>
<p>The prototypes presented have been created by <a href="http://www.balsamiq.com/products/mockups">Balsamiq Mockups</a> and are deliberately lo-fi. However, they help to clarify some of my concepts. They leave aside logging in, Web Weave account management and help screens etc. and are broken down into the following screens:</p>
<ul>
<li>Bookmarks</li>
<li>Browsing history</li>
<li>Tabs</li>
<li>Web accounts</li>
<li>Preferences</li>
</ul>
<p><strong>Main menu</strong></p>
<p><a title="Mozilla Design Challenge by reynard, on Flickr" href="http://www.flickr.com/photos/littled/3952836626/"><img src="http://farm4.static.flickr.com/3483/3952836626_e9b12a2217.jpg" alt="Mozilla Design Challenge" width="100%" height="100%" /></a></p>
<p>The main menu provides an overview visualisation of all stored data. All main headings, &#8220;Bookmarks&#8221;, &#8220;My browsing history&#8221; etc. can be expanded and hidden and show recent activity.</p>
<p>A search box enables users to search across all stored data (with the exception of passwords) &#8212; searches would also be filtered by data type (bookmarks, history, tabs etc.).</p>
<hr class="colbreak" />
<strong>Bookmarks</strong></p>
<p><a title="Mozilla Design Challenge 1 by reynard, on Flickr" href="http://www.flickr.com/photos/littled/3950425321/"><img src="http://farm3.static.flickr.com/2667/3950425321_469488733d.jpg" alt="Mozilla Design Challenge 1" width="100%" height="100%" /></a></p>
<p>Both Firefox&#8217;s existing method of organising bookmarks and the bookmarking sharing service <a href="http://delicious.com/">Delicious</a> allow users to file bookmarks of  websites and categorise these by tags (Firefox and Delicious) and / or sorting by folder (Firefox). Whilst this allows for cross-referencing of bookmarks, bookmarks are presented textually as the title of the website, its URL, user generated tags, and in the case of Delicious, a textual description.</p>
<p>My model presents the data visually, showing thumbnail images for each bookmark, alongside its metadata, some of which is automatically generated (URL, site title, date visited), other parts of which are user generated (tags). In this visualisation, all data can be edited in place (as with editing photo metadata in Flickr). Bookmarks can also be deleted via clicking on an icon with a suitable &#8220;delete&#8221; metaphor, and filed in one or more folders (like Flickr &#8220;sets&#8221;). The method for filing shown in the prototype was also influenced by <a href="http://www.google.com/mail">Google Mail</a> and <a href="http://www.google.com/reader">Reader</a>&#8216;s method of associating emails / feeds with one or more folders.</p>
<p>The folders created by the user are shown to the right, much like sets in Flickr. These can be edited by activation of the relevant edit link. Users may wish to edit the folder&#8217;s title and thumbnail image, using either the thumbnail of a representative website or an image selected by URL or direct upload. A default placeholder image would be used in the absence of a selected image.</p>
<p><strong>Browsing history</strong></p>
<p><a title="Mozilla Design Challenge 2 by reynard, on Flickr" href="http://www.flickr.com/photos/littled/3950425493/"><img src="http://farm4.static.flickr.com/3438/3950425493_6f4e81e3fc.jpg" alt="Mozilla Design Challenge 2" width="100%" height="100%" /></a></p>
<p>Firefox&#8217;s current &#8220;show history&#8221; option presents a textual list of previously visited sites, showing the following metadata: site title, tags and location (URL).</p>
<p>Jason Hong&#8217;s paper cites research that, although up to 81 per cent of web pages visited by users are revisits, web browser history functions are only used around 0.2 per cent of the time to initiate these visits.</p>
<p>In this model, browser history is visualised as it is to an extent in Safari and Chrome, but with more accompanying metadata and the ability to add the sites as bookmarks. Selecting the &#8220;Add to bookmarks&#8221; functionality allows users to add and amend site metadata and file the bookmark in an existing folder (or in  a a new folder).</p>
<p>The time periods selected for differentiating browsing sessions are kept as per the standard Firefox organisation, i.e. today, this week, then previous months. A calendar widget is suggested as an alternative way of browsing by particular day, with the page content updated dynamically as the user clicks through dates. Other sort options which might suggest themselves are: web site title, URL, the device the page was accessed on or by tabs.</p>
<p><a href="/2009/09/25/weave-visualising-browser-data-part-2/">Part 2: tabs, web accounts (credentials) and preferences</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.littled.net/2009/09/25/weave-visualising-browser-data/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Weave: visualising browser data: part 2</title>
		<link>http://www.littled.net/2009/09/25/weave-visualising-browser-data-part-2/</link>
		<comments>http://www.littled.net/2009/09/25/weave-visualising-browser-data-part-2/#comments</comments>
		<pubDate>Fri, 25 Sep 2009 07:23:48 +0000</pubDate>
		<dc:creator>wdavid</dc:creator>
				<category><![CDATA[interaction design]]></category>

		<guid isPermaLink="false">http://www.littled.net/new/?p=342</guid>
		<description><![CDATA[Mozilla&#8217;s Web Weave UI design challenge seeks to find solutions to the issue of visualising browser data accumulated across a number of devices. This is part 2 of an article which outlines a potential solution to some of the issues &#8230; <a href="http://www.littled.net/2009/09/25/weave-visualising-browser-data-part-2/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Mozilla&#8217;s Web Weave UI design challenge seeks to find solutions to the issue of visualising browser data accumulated across a number of devices. This is part 2 of an article which outlines a potential solution to some of the issues raised. It covers the visualisation of tabs, accounts and preferences.<a href="new/2009/09/24/weave-visualising-browser-data"></a></p>
<p>Please read: <a href="new/2009/09/24/weave-visualising-browser-data">part one: introduction, bookmarks and browsing history</a> first.</p>
<p><strong>Tabs</strong></p>
<p><a title="Mozilla Design Challenge 3 by reynard, on Flickr" href="http://www.flickr.com/photos/littled/3951204490/"><img src="http://farm4.static.flickr.com/3429/3951204490_1c42ab2039.jpg" alt="Mozilla Design Challenge 3" width="100%" height="100%" /></a></p>
<p>Visualising tab history across a number of devices is possibly a little more challenging than considering bookmarks and general browsing history. Tabs can be open on any number of the user&#8217;s devices so one obvious question to be considered is how to arrange this information.</p>
<p>The tabs visualisation stays with the main visual metaphor, with history broken down per tab per device. This assumes the user has some way of adding and deleting participating devices &#8212; e.g. a copy of Firefox at home, or another browser running on another computer such as a work PC, laptop or mobile browsing device.</p>
<p>Tab data includes the title of the page being viewed and the tab history. The visualisation displays a thumbnail of the currently open page and previously visited pages. There should be a straightforward way for users to open this on their current device (and possibly all tabs open on other devices), and to save to bookmarks (or if the site is already stored as a bookmark to easily see this).</p>
<p>Views may change slightly depending on how the data is sorted &#8212; for instance, if the list were sorted by device name, then the displayed metadata could include information about the device the site was initially opened on.</p>
<p><strong>Accounts (credentials)</strong></p>
<p><a title="Mozilla Design Challenge 5 by reynard, on Flickr" href="http://www.flickr.com/photos/littled/3951204866/"><img src="http://farm3.static.flickr.com/2626/3951204866_016493b6ef.jpg" alt="Mozilla Design Challenge 5" width="100%" height="100%" /></a></p>
<hr class="colbreak" />
<p>Whilst it might be useful for users to synchronise account data across a number of devices, it is also the type of data which lends itself least readily to being visualised; in fact it is not appropriate to visualise data such as passwords.</p>
<p>In this model, sites with stored credentials are again presented as browsable thumbnails lending the user the ability to log in directly to protected sites. Some sites may offer API functionality which allows users to manage their credentials via Weave, but the majority will require the user to visit them in order to do so. Any changes to credentials would need to be synchronised immediately in Weave.</p>
<p><strong>Preferences</strong></p>
<p><a title="Mozilla Design Challenge 4 by reynard, on Flickr" href="http://www.flickr.com/photos/littled/3950425869/"><img src="http://farm4.static.flickr.com/3441/3950425869_9972dbfa0a.jpg" alt="Mozilla Design Challenge 4" width="100%" height="100%" /></a></p>
<p>Firefox preferences include a number of different options, the more obvious being browser home page, or Firefox persona. Some of this information may be Firefox-specific, other less so (e.g. home page). The visual metaphor can still be used, employing site thumbnails for selected home page or a visual representation of the selected persona. It could also be useful for users to be able to export the relevant parts of this information for use with other browsers if it cannot be directly applied (e.g. for Internet Explorer, Safari or Chrome); similarly options should be available to import data from a file generated by another browser or to be accessed via Firefox&#8217;s preferences menu, providing an option to pull the information directly in from Weave.</p>
<p><strong>Summary</strong></p>
<p>The model presented is quite simple and does not attempt any advanced data visualisation. Instead it uses models of organisation and interaction that users may be familiar with from using other social networking / asset organising websites. It is particularly influenced by models for organising visual information, for instance Flickr&#8217;s model of managing photo metadata.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.littled.net/2009/09/25/weave-visualising-browser-data-part-2/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Review of Designing Web Interfaces on DRB</title>
		<link>http://www.littled.net/2009/07/21/review-of-designing-web-interfaces-on-designers-review-of-book/</link>
		<comments>http://www.littled.net/2009/07/21/review-of-designing-web-interfaces-on-designers-review-of-book/#comments</comments>
		<pubDate>Tue, 21 Jul 2009 20:53:13 +0000</pubDate>
		<dc:creator>wdavid</dc:creator>
				<category><![CDATA[interaction design]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://www.littled.net/new/2009/07/21/review-of-designing-web-interfaces-on-designers-review-of-book/</guid>
		<description><![CDATA[My review of Designing Web Interfaces by Bill Scott and Theresa Neil (O&#8217;Reilly, 2009) is now up on the Designers&#8217; Review of Books website.]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.designersreviewofbooks.com/2009/07/designing-web-interfaces/">My review of Designing Web Interfaces</a> by Bill Scott and Theresa Neil (O&#8217;Reilly, 2009) is now up on the Designers&#8217; Review of Books website.</p>
<hr class="colbreak" />
]]></content:encoded>
			<wfw:commentRss>http://www.littled.net/2009/07/21/review-of-designing-web-interfaces-on-designers-review-of-book/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>On finishing M873: some thoughts</title>
		<link>http://www.littled.net/2009/04/25/on-finishing-m873-some-thoughts/</link>
		<comments>http://www.littled.net/2009/04/25/on-finishing-m873-some-thoughts/#comments</comments>
		<pubDate>Sat, 25 Apr 2009 13:15:32 +0000</pubDate>
		<dc:creator>wdavid</dc:creator>
				<category><![CDATA[interaction design]]></category>

		<guid isPermaLink="false">http://www.littled.net/new/?p=193</guid>
		<description><![CDATA[Yesterday I had my exam for my Open University course, M873: User Interface Design and Evaluation. This brings to an end a pretty intensive six months of work. I&#8217;m still feeling a little shell-shocked after the exam but while I &#8230; <a href="http://www.littled.net/2009/04/25/on-finishing-m873-some-thoughts/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Yesterday I had my exam for my Open University course, <a href="http://www3.open.ac.uk/courses/bin/p12.dll?C01M873">M873: User Interface Design and Evaluation</a>. This brings to an end a pretty intensive six months of work. I&#8217;m still feeling a little shell-shocked after the exam but while I catch my breath before moving on to the next tranche of things I need to look at, I thought I&#8217;d share my thoughts about the course.</p>
<p>M873 is a postgraduate module which you can take either as a standalone or as part of various MScs in Computing. I took it for professional development reasons: having realised that my real passion in Web work is designing and building usable interfaces, I wanted to get a stronger theoretical background in the area.</p>
<p>The course is designed to be practical &#8212; although it provides an overview of key concepts in Human-Computer Interaction (HCI), it always has an eye to how these would be applied outside of academic discourse. There are three course books covering the various iterations of the user-centred design process: requirements, design and evaluation.</p>
<p>Personally, I found the design book and related assessment most enjoyable. You need to produce three Tutor-Marked Assessments (TMAs) for the course, and these are all focussed on a particular system you have chosen to look at. I chose <a href="/new/portfolio/birkbeck-events-calendar-ui-redesign-case-study/">a section of a website at work</a> to look at, mainly because I was getting funding from work to do the course, but also because I hoped it would give me the opportunity to implement any design changes I came up with. You could choose any system in theory, from a DVD player remote control to an existing website.</p>
<p>The TMAs were incredibly time-consuming. The course notes suggested you should take around 10-15 hours for each one, but in practice I (and others I spoke to) took far longer: at least twice of this. Which brings me to my biggest complaint about the course. The overall mark is based on the TMA marks and the exam marks. You need to get 40% in both to pass which I feel isn&#8217;t a fair weighting: after all you might spend between forty and sixty hours on the TMAs and you get just three hours in the exam hall.</p>
<p>I thought the exam expected a little too much: both in the amount of questions you were supposed to answer (four in three hours) and the amount of lists and tables you were expected to learn by heart. If the course must be assessed by an exam, I&#8217;d prefer to see the course weighted more in favour of the assessments or at least fewer exam questions.</p>
<hr class="colbreak" />
The material ranged from incredibly interesting and engaging (aspects of the design book, how to &#8220;sell&#8221; UCD to your organisation) to the far dryer, verbose and repetitive (most of the first book and parts of the last). The materials were also outdated: the course was last updated in 2000, although there were some revisions in 2004. This means screenshots of websites in Netscape 4 and photos of virtual reality gloves (yeah, so they turned out to be the future of interface design didn&#8217;t they). But, it should be borne in mind that this is not a technical course but a conceptual and design course and as such is technology-agnostic so will not date as quickly as say, a course on Web development. You could pretty much do the whole thing with a pen and paper. For my part I prototyped with Photoshop, HTML and Balsamiq Mockups.</p>
<p>I wouldn&#8217;t say the course was enjoyable as such: it was very demanding and there were many concepts to try and understand. However, it was very useful and although it&#8217;s not going to guarantee me a glowing future as a usability professional in itself, I&#8217;ve already employed many of the concepts and ideas in my day-to-day work. Would I recommend it? Yes, but with caveats: I think the course materials could be slimmed down and I do think the coursework / exam mark ratios should be addressed.</p>
<p>It&#8217;s also worth bearing in mind how you will cope with distance learning: it worked well for me, fitting in with other commitments, but you do feel you&#8217;re on your own and there were few opportunities to bounce ideas off other people or to get a tutor to go over a particular issue. There was a course forum, but this seemed to die about a month into the course. One of my co-students set up a Facebook group which saw a little more action, but not much.</p>
<p>As a postscript: it should be pointed out that apparently this course is not going to last much longer in its current format. It&#8217;s been long overdue for review, so I think that it&#8217;s not going to be offered after this year or next (but please don&#8217;t take my word for it!).</p>
]]></content:encoded>
			<wfw:commentRss>http://www.littled.net/2009/04/25/on-finishing-m873-some-thoughts/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

