<?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>Tobias Toft &#187; eleventh week</title>
	<atom:link href="http://tobiastoft.dk/tag/eleventh-week/feed" rel="self" type="application/rss+xml" />
	<link>http://tobiastoft.dk</link>
	<description>About interaction design, geeky things and maybe even Helvetica.</description>
	<lastBuildDate>Thu, 22 Apr 2010 14:31:56 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Graphical User Interface design &#8211; Part 1</title>
		<link>http://tobiastoft.dk/graphical-user-interface-design-part-1</link>
		<comments>http://tobiastoft.dk/graphical-user-interface-design-part-1#comments</comments>
		<pubDate>Mon, 22 Dec 2008 12:31:12 +0000</pubDate>
		<dc:creator>Tobias</dc:creator>
				<category><![CDATA[Blog]]></category>
		<category><![CDATA[arduino]]></category>
		<category><![CDATA[ciid]]></category>
		<category><![CDATA[elderly]]></category>
		<category><![CDATA[electronics]]></category>
		<category><![CDATA[eleventh week]]></category>
		<category><![CDATA[exhibition]]></category>
		<category><![CDATA[flash]]></category>
		<category><![CDATA[gui]]></category>
		<category><![CDATA[physical computing]]></category>
		<category><![CDATA[tenth week]]></category>
		<category><![CDATA[users]]></category>

		<guid isPermaLink="false">http://tobiastoft.dk/?p=242</guid>
		<description><![CDATA[After having spent time with the elderly, we started thinking in concepts that could improve the life of the elderly. We had the honour of having Niels Clausen-Stuck as guest teacher for the first two weeks of our GUI design module, where he, along with Alex from CIID, helped us through the whole design process. [...]]]></description>
			<content:encoded><![CDATA[<p>After having spent time with the elderly, we started thinking in concepts that could improve the life of the elderly. We had the honour of having <a title="CIID/DKDS visiting faculty profile page" href="http://ciid.dkds.dk/people/visiting-faculty/niels-clausen-stuck/" target="_blank">Niels Clausen-Stuck</a> as guest teacher for the first two weeks of our GUI design module, where he, along with <a title="Alex's faculty profile page " href="http://ciid.dkds.dk/people/faculty/alexander-wiethoff/" target="_blank">Alex from CIID</a>, helped us through the whole design process. A process looking a lot like the good old <a title="Take a look at ISO13407" href="http://www.usabilitynet.org/tools/13407stds.htm" target="_blank">ISO13407</a> which I am quite familiar with after having studied <a title="Design-Ing.dk" href="http://www.design-ing.dk" target="_blank">product development</a> at <a title="The Technical University of Denmark" href="http://www.dtu.dk" target="_blank">DTU </a>for 5 years. Well, this post is not going to be about design processes (though it&#8217;s a topic that I&#8217;m very interested in).</p>
<p>After having visited the elderly, we found out that they are no longer interested in creating and sharing new memories, they are more interested in <a title="See the end of this post" href="http://tobiastoft.dk/a-week-with-the-elderly" target="_self">re-living old memories</a>, with people that can help them filling in the gaps and completing their stories from the past. But it&#8217;s not always easy to find people at your own age that you can actually do this with, as almost 85% of the residents on the old folks homes have dementia to some degree. And as the course was about graphical user interfaces, we also had to create some kind of device. After lots of thinking and another visit to Plejehjemmet Aftensol, we decided to develop a &#8220;time machine&#8221;. Well, not a time machine in the traditional sense, but at least something that would help you think back in time.</p>
<p style="text-align: center;"><img class="size-medium wp-image-248 aligncenter" title="Radio in BW" src="http://tobiastoft.dk/wp-content/uploads/gui-class-part-1-58-small-450x300.jpg" alt="Radio in BW" width="450" height="300" /></p>
<p>We decided to build a radio, that could go back in time. Instead of having a frequency scale, this radio has a time scale. Turn the knob back to the year you would like to get refreshed, and the radio will start playing content from that period. If you only want to listen to specific types of content, there is a knob for selecting that, e.g. news, radio-theater or classical music. I won&#8217;t go into the details of the UI, but we put a lot of thought into arranging the buttons and the graphical layout of the screen, to be as intuitive as possible. As this mock-up was developed in the second iteration, it is still very early &#8211; unfortunately we didn&#8217;t have time to take it to the elderly to evaluate it.</p>
<p style="text-align: center;"><img class="size-medium wp-image-244  aligncenter" title="The time radio" src="http://tobiastoft.dk/wp-content/uploads/gui-class-part-1-64-small-450x300.jpg" alt="The radio set to 1978" width="450" height="300" /></p>
<p>Technically speaking the radio is just a device with a wifi connection, and access to digitalised radio archives, e.g. from Danmarks Radio or BBC. The interface is kept &#8220;old-fashioned&#8221; on purpose, to keep a higher level of familiarity to the user. Our philosophy was, that this concept is a radio and therefore it should look and feel like a radio. Not a computer or streaming mp3-player.</p>
<p>Electronics-wise the mock-up (or hardware sketch) was built using Flash, Arduino (+ potmeters), a hacked Nokia speaker and an Asus Eee 901, all put into a cabinet covered with sheets of paper with a wood texture printed on them. The picture below is showing the radio when it&#8217;s not covered by the fake table.</p>
<p style="text-align: center;"><img class="size-medium wp-image-245  aligncenter" title="Radio opened" src="http://tobiastoft.dk/wp-content/uploads/gui-class-part-1-47-small-450x299.jpg" alt="Under the hood of the radio: Arduino and Eee 901" width="450" height="299" /></p>
<p>In general the GUI class resulted in some really nice models, considering we had very short time for the projects. Take a look at some of the other mock-ups in my <a title="My Flickr photostream" href="http://www.flickr.com/photos/tobiastoft/" target="_blank">Flickr photostream</a>. If you don&#8217;t want to go to Flickr, the photos from the exhibition (and some from the process) can also be found here.</p>
<div style="text-align:center">
<a class="flickr-image" title="Marcin's smurf" href="http://www.flickr.com/photos/30656616@N02/3070445735/"><img src="http://farm4.static.flickr.com/3051/3070445735_4159348ae5_s.jpg" alt="Marcin's smurf" /></a><a class="flickr-image" title="First concept sketch" href="http://www.flickr.com/photos/30656616@N02/3071289396/"><img src="http://farm4.static.flickr.com/3151/3071289396_67d0e214ce_s.jpg" alt="First concept sketch" /></a><a class="flickr-image" title="Putting Post-Its on the wall" href="http://www.flickr.com/photos/30656616@N02/3071298912/"><img src="http://farm4.static.flickr.com/3159/3071298912_782df782e0_s.jpg" alt="Putting Post-Its on the wall" /></a><a class="flickr-image" title="Messy" href="http://www.flickr.com/photos/30656616@N02/3071315190/"><img src="http://farm4.static.flickr.com/3033/3071315190_ba3e72ecd9_s.jpg" alt="Messy" /></a><a class="flickr-image" title="Brainstorming" href="http://www.flickr.com/photos/30656616@N02/3070486649/"><img src="http://farm4.static.flickr.com/3291/3070486649_b15cbcc4f8_s.jpg" alt="Brainstorming" /></a><a class="flickr-image" title="Key value" href="http://www.flickr.com/photos/30656616@N02/3070510147/"><img src="http://farm4.static.flickr.com/3144/3070510147_31cf60ac15_s.jpg" alt="Key value" /><br />
</a><a class="flickr-image" title="Discussing ideas" href="http://www.flickr.com/photos/30656616@N02/3071360340/"><img src="http://farm4.static.flickr.com/3040/3071360340_14fb0e4cf2_s.jpg" alt="Discussing ideas" /></a><a class="flickr-image" title="Good or bad?" href="http://www.flickr.com/photos/30656616@N02/3071372182/"><img src="http://farm4.static.flickr.com/3273/3071372182_5bef1f92b7_s.jpg" alt="Good or bad?" /></a><a class="flickr-image" title="In or out?" href="http://www.flickr.com/photos/30656616@N02/3070539595/"><img src="http://farm4.static.flickr.com/3212/3070539595_6ab9d5168f_s.jpg" alt="In or out?" /></a><a class="flickr-image" title="Scenarios" href="http://www.flickr.com/photos/30656616@N02/3071389188/"><img src="http://farm4.static.flickr.com/3154/3071389188_cc46780fd3_s.jpg" alt="Scenarios" /></a><a class="flickr-image" title="Scenario sketches" href="http://www.flickr.com/photos/30656616@N02/3071402496/"><img src="http://farm4.static.flickr.com/3199/3071402496_3a78bb5fd3_s.jpg" alt="Scenario sketches" /></a><a class="flickr-image" title="Interviewing" href="http://www.flickr.com/photos/30656616@N02/3070574051/"><img src="http://farm4.static.flickr.com/3211/3070574051_2588c8dbee_s.jpg" alt="Interviewing" /><br />
</a><a class="flickr-image" title="Taking notes" href="http://www.flickr.com/photos/30656616@N02/3070581585/"><img src="http://farm4.static.flickr.com/3165/3070581585_4463346016_s.jpg" alt="Taking notes" /></a><a class="flickr-image" title="Interviewing" href="http://www.flickr.com/photos/30656616@N02/3071428462/"><img src="http://farm4.static.flickr.com/3250/3071428462_7302d02c79_s.jpg" alt="Interviewing" /></a><a class="flickr-image" title="Interviewing" href="http://www.flickr.com/photos/30656616@N02/3070600855/"><img src="http://farm4.static.flickr.com/3033/3070600855_2fd47893fb_s.jpg" alt="Interviewing" /></a><a class="flickr-image" title="Interviewing Ebba" href="http://www.flickr.com/photos/30656616@N02/3070610465/"><img src="http://farm4.static.flickr.com/3223/3070610465_3b3d301533_s.jpg" alt="Interviewing Ebba" /></a><a class="flickr-image" title="Sid's fist snow" href="http://www.flickr.com/photos/30656616@N02/3070619167/"><img src="http://farm4.static.flickr.com/3009/3070619167_717988c2eb_s.jpg" alt="Sid's fist snow" /></a><a class="flickr-image" title="Nordic Brainstorming" href="http://www.flickr.com/photos/30656616@N02/3071464460/"><img src="http://farm4.static.flickr.com/3063/3071464460_641d09eae9_s.jpg" alt="Nordic Brainstorming" /><br />
</a><a class="flickr-image" title="Deciding placement" href="http://www.flickr.com/photos/30656616@N02/3071473010/"><img src="http://farm4.static.flickr.com/3008/3071473010_247d078b4a_s.jpg" alt="Deciding placement" /></a><a class="flickr-image" title="Deciding placement" href="http://www.flickr.com/photos/30656616@N02/3071484136/"><img src="http://farm4.static.flickr.com/3049/3071484136_fa4677b5cf_s.jpg" alt="Deciding placement" /></a><a class="flickr-image" title="Setting up Arduino" href="http://www.flickr.com/photos/30656616@N02/3070658899/"><img src="http://farm4.static.flickr.com/3238/3070658899_d1853f44e8_s.jpg" alt="Setting up Arduino" /></a><a class="flickr-image" title="Andreas finishing the fake wood" href="http://www.flickr.com/photos/30656616@N02/3071504870/"><img src="http://farm4.static.flickr.com/3241/3071504870_0b9a61cb04_s.jpg" alt="Andreas finishing the fake wood" /></a><a class="flickr-image" title="Almost ready" href="http://www.flickr.com/photos/30656616@N02/3071511008/"><img src="http://farm4.static.flickr.com/3061/3071511008_c27aea2126_s.jpg" alt="Almost ready" /></a><a class="flickr-image" title="Cool proto. Great UI." href="http://www.flickr.com/photos/30656616@N02/3070678775/"><img src="http://farm4.static.flickr.com/3138/3070678775_da6baa7e08_s.jpg" alt="Cool proto. Great UI." /><br />
</a><a class="flickr-image" title="Cool proto. Great UI." href="http://www.flickr.com/photos/30656616@N02/3071522980/"><img src="http://farm4.static.flickr.com/3165/3071522980_952dd45111_s.jpg" alt="Cool proto. Great UI." /></a><a class="flickr-image" title="Controlling the show" href="http://www.flickr.com/photos/30656616@N02/3070692421/"><img src="http://farm4.static.flickr.com/3239/3070692421_eaefa74ca1_s.jpg" alt="Controlling the show" /></a><a class="flickr-image" title="Nice drawings" href="http://www.flickr.com/photos/30656616@N02/3071537774/"><img src="http://farm4.static.flickr.com/3008/3071537774_59fd373680_s.jpg" alt="Nice drawings" /></a><a class="flickr-image" title="Setting the mood" href="http://www.flickr.com/photos/30656616@N02/3070706799/"><img src="http://farm4.static.flickr.com/3044/3070706799_37b5e313e7_s.jpg" alt="Setting the mood" /></a><a class="flickr-image" title="Andreas demonstrating" href="http://www.flickr.com/photos/30656616@N02/3070713287/"><img src="http://farm4.static.flickr.com/3138/3070713287_8ef0792a8e_s.jpg" alt="Andreas demonstrating" /></a><a class="flickr-image" title="Andreas adjusting" href="http://www.flickr.com/photos/30656616@N02/3070718257/"><img src="http://farm4.static.flickr.com/3195/3070718257_4201198ea2_s.jpg" alt="Andreas adjusting" /><br />
</a><a class="flickr-image" title="Hmm..." href="http://www.flickr.com/photos/30656616@N02/3071559732/"><img src="http://farm4.static.flickr.com/3182/3071559732_8ae48cba1e_s.jpg" alt="Hmm..." /></a><a class="flickr-image" title="Singing or presenting? Or both?" href="http://www.flickr.com/photos/30656616@N02/3070725517/"><img src="http://farm4.static.flickr.com/3246/3070725517_f61a1944bf_s.jpg" alt="Singing or presenting? Or both?" /></a><a class="flickr-image" title="Memory proto" href="http://www.flickr.com/photos/30656616@N02/3071567382/"><img src="http://farm4.static.flickr.com/3028/3071567382_e50cbf91e1_s.jpg" alt="Memory proto" /></a><a class="flickr-image" title="Tired girls" href="http://www.flickr.com/photos/30656616@N02/3071573776/"><img src="http://farm4.static.flickr.com/3222/3071573776_9ba008e3b0_s.jpg" alt="Tired girls" /></a><a class="flickr-image" title="Filming" href="http://www.flickr.com/photos/30656616@N02/3070743775/"><img src="http://farm4.static.flickr.com/3034/3070743775_04533d9b99_s.jpg" alt="Filming" /></a><a class="flickr-image" title="Nice setup" href="http://www.flickr.com/photos/30656616@N02/3070750661/"><img src="http://farm4.static.flickr.com/3245/3070750661_dc5b137fc8_s.jpg" alt="Nice setup" /><br />
</a><a class="flickr-image" title="Simona" href="http://www.flickr.com/photos/30656616@N02/3071593668/"><img src="http://farm4.static.flickr.com/3241/3071593668_3779ff6b48_s.jpg" alt="Simona" /></a><a class="flickr-image" title="Active wall" href="http://www.flickr.com/photos/30656616@N02/3071599666/"><img src="http://farm4.static.flickr.com/3070/3071599666_ffdef50b28_s.jpg" alt="Active wall" /></a><a class="flickr-image" title="Kevin and Sid" href="http://www.flickr.com/photos/30656616@N02/3071605098/"><img src="http://farm4.static.flickr.com/3232/3071605098_0cccdafaac_s.jpg" alt="Kevin and Sid" /></a><a class="flickr-image" title="Ujj pretending not to have a camera around" href="http://www.flickr.com/photos/30656616@N02/3071612102/"><img src="http://farm4.static.flickr.com/3042/3071612102_d36da213b9_s.jpg" alt="Ujj pretending not to have a camera around" /></a><a class="flickr-image" title="Just tired" href="http://www.flickr.com/photos/30656616@N02/3070784747/"><img src="http://farm4.static.flickr.com/3072/3070784747_a683dd7c5a_s.jpg" alt="Just tired" /></a><a class="flickr-image" title="Tired of it" href="http://www.flickr.com/photos/30656616@N02/3071631714/"><img src="http://farm4.static.flickr.com/3218/3071631714_9d725d6ef7_s.jpg" alt="Tired of it" /><br />
</a><a class="flickr-image" title="Calendar system" href="http://www.flickr.com/photos/30656616@N02/3071638394/"><img src="http://farm4.static.flickr.com/3209/3071638394_546c142c44_s.jpg" alt="Calendar system" /></a><a class="flickr-image" title="Visitors from Japan" href="http://www.flickr.com/photos/30656616@N02/3070810039/"><img src="http://farm4.static.flickr.com/3229/3070810039_87f0e170fa_s.jpg" alt="Visitors from Japan" /></a><a class="flickr-image" title="Radio proto" href="http://www.flickr.com/photos/30656616@N02/3071649382/"><img src="http://farm4.static.flickr.com/3147/3071649382_0e7aa59732_s.jpg" alt="Radio proto" /></a><a class="flickr-image" title="Thumbnail sketches" href="http://www.flickr.com/photos/30656616@N02/3071356103/"><img src="http://farm4.static.flickr.com/3189/3071356103_357e84865f_s.jpg" alt="Thumbnail sketches" /></a><a class="flickr-image" title="Thumbnail sketches" href="http://www.flickr.com/photos/30656616@N02/3072197632/"><img src="http://farm4.static.flickr.com/3052/3072197632_7331b75c3a_s.jpg" alt="Thumbnail sketches" /></a><a class="flickr-image" title="Thumbnail sketches" href="http://www.flickr.com/photos/30656616@N02/3071370323/"><img src="http://farm4.static.flickr.com/3060/3071370323_0ae4a66a37_s.jpg" alt="Thumbnail sketches" /></a></div>
]]></content:encoded>
			<wfw:commentRss>http://tobiastoft.dk/graphical-user-interface-design-part-1/feed</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
	</channel>
</rss>
