<?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>Josef Richter &#187; user interface</title>
	<atom:link href="http://www.josefrichter.com/blog/category/user-interface/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.josefrichter.com/blog</link>
	<description>blogging about the world around</description>
	<lastBuildDate>Sat, 14 Jan 2012 10:55:31 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>Android 4.0 Ice Cream Sandwich – Photoshop design startkit</title>
		<link>http://www.josefrichter.com/blog/android-4-0-ice-cream-sandwich-photoshop-design-startkit/</link>
		<comments>http://www.josefrichter.com/blog/android-4-0-ice-cream-sandwich-photoshop-design-startkit/#comments</comments>
		<pubDate>Sat, 14 Jan 2012 10:55:31 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[design]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[4.0]]></category>
		<category><![CDATA[android]]></category>
		<category><![CDATA[guidelines]]></category>
		<category><![CDATA[Ice Cream Sandwich]]></category>
		<category><![CDATA[Photoshop]]></category>
		<category><![CDATA[PSD]]></category>
		<category><![CDATA[startkit]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=365</guid>
		<description><![CDATA[I&#8217;ve been working on an Android app design just when Google finally released Android Design guidelines (ADG). There are also metrics and grids recommendations which I find particularly useful (see http://developer.android.com/design/style/metrics-grids.html). They have a nice sample screen there, but for some reason, no PSD for download is available. I needed to create one myself anyway, [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve been working on an Android app design just when Google finally released Android Design guidelines (ADG). There are also metrics and grids recommendations which I find particularly useful (see <a href="http://developer.android.com/design/style/metrics-grids.html" title="ADG metrics &#038; grids" target="_blank">http://developer.android.com/design/style/metrics-grids.html</a>). They have a nice sample screen there, but for some reason, no PSD for download is available. I needed to create one myself anyway, so I decided to release it for free for other designers. Interesting note: the sample image in the ADG is actually NOT pixel perfect &#8211; pretty scary that they can&#8217;t get this right even in the design guide&#8230;</p>
<p>Feel free to donwload the PSDs at <a href="http://www.androiddesign.info" target="_blank">Android 4.0 Ice Cream Sandwich Photoshop PSD Startkit</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/android-4-0-ice-cream-sandwich-photoshop-design-startkit/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>FEEL Applications &#8211; custom iPhone, Android &amp; HTML5 mobile apps development</title>
		<link>http://www.josefrichter.com/blog/feel-applications-custom-iphone-android-html5-mobile-apps-development/</link>
		<comments>http://www.josefrichter.com/blog/feel-applications-custom-iphone-android-html5-mobile-apps-development/#comments</comments>
		<pubDate>Sun, 27 Nov 2011 15:24:49 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[user interface]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[android]]></category>
		<category><![CDATA[css3]]></category>
		<category><![CDATA[html5]]></category>
		<category><![CDATA[ios]]></category>
		<category><![CDATA[ipad]]></category>
		<category><![CDATA[iphone]]></category>
		<category><![CDATA[media-queries]]></category>
		<category><![CDATA[mobile]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=362</guid>
		<description><![CDATA[I just launched a new website of my company FEEL Applications. We focus on mobile apps development, especially HTML5 based apps, but also on native apps for iOS/iPhone/iPad and Android. See the website here &#8211; FEEL Applications &#8211; mobile applications development. The website is also optimized for mobile use, via media-queries &#8211; try it!]]></description>
			<content:encoded><![CDATA[<p>I just launched a new website of my company FEEL Applications. We focus on mobile apps development, especially HTML5 based apps, but also on native apps for iOS/iPhone/iPad and Android. See the website here &#8211; <a href="http://www.feelapplications.com" title="FEEL Applications - mobile applications development">FEEL Applications &#8211; mobile applications development</a>. The website is also optimized for mobile use, via media-queries &#8211; try it!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/feel-applications-custom-iphone-android-html5-mobile-apps-development/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Dribbble favorites safari extension</title>
		<link>http://www.josefrichter.com/blog/dribbble-favorites-safari-extension/</link>
		<comments>http://www.josefrichter.com/blog/dribbble-favorites-safari-extension/#comments</comments>
		<pubDate>Sun, 25 Jul 2010 17:20:44 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[apple]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[dribbble]]></category>
		<category><![CDATA[extension]]></category>
		<category><![CDATA[safari]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=343</guid>
		<description><![CDATA[Dribbble is an invitation only service (which is great). However, when you are unregistered user, you cannot save your favorites. So I made this Safari 5 Extension which saves your favorites in your browser when you click the heart icon+link. It makes use of html5 localStorage. This means your favorites will be available to you [...]]]></description>
			<content:encoded><![CDATA[<p>Dribbble is an invitation only service (which is great). However, when you are unregistered user, you cannot save your favorites. </p>
<p>So I made this Safari 5 Extension which saves your favorites in your browser when you click the heart icon+link. It makes use of html5 localStorage. This means your favorites will be available to you every time you access dribbble.com, even upon browser restart, etc.</p>
<p>As you can see on the screenshot, you will get new &#8216;my favorites&#8217; tab, which displays your favorites only. Each favorite also gets &#8216;remove&#8217; link.</p>
<p><img src="http://www.josefrichter.com/blog/wp-content/uploads/Screenshot-2010-07-25-19h-03m-05s.png" alt="" title="Screenshot 2010-07-25 19h 03m 05s" width="500" height="275" class="alignnone size-full wp-image-344" /></p>
<p>Try the extension yourself and please let me know any bugs. Thanks.</p>
<p><a href="http://www.josefrichter.com/dribbble_favorites.safariextz">Download here</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/dribbble-favorites-safari-extension/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Helvetimail is here</title>
		<link>http://www.josefrichter.com/blog/helvetimail-is-here/</link>
		<comments>http://www.josefrichter.com/blog/helvetimail-is-here/#comments</comments>
		<pubDate>Sun, 13 Sep 2009 15:37:04 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[design]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[gmail]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[helvetical]]></category>
		<category><![CDATA[helvetimail]]></category>
		<category><![CDATA[helvetireader]]></category>
		<category><![CDATA[helvetwitter]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=338</guid>
		<description><![CDATA[So you can finally grab the Helvetimail at josefrichter.com/helvetimail. This took a lot of time, because Gmail html, css and js are extremely messy. Does anyone know why? If you like Helvetimail, please see also my Helvetwitter. Please use discussion under this blogpost to submit comments, report problems, etc. I am aware that Helvetimail is [...]]]></description>
			<content:encoded><![CDATA[<p>So you can finally grab the Helvetimail at <a href="http://www.josefrichter.com/helvetimail">josefrichter.com/helvetimail</a>. This took a lot of time, because Gmail html, css and js are extremely messy. Does anyone know why?</p>
<p>If you like <a href="http://www.josefrichter.com/helvetimail">Helvetimail</a>, please see also my <a href="http://www.josefrichter.com/helvetwitter">Helvetwitter</a>.</p>
<p>Please use discussion under this blogpost to submit comments, report problems, etc. I am aware that Helvetimail is far from perfect and probably never will be, but I did what I could to make at least the basic functionality ok.</p>
<p>Thank you and enjoy!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/helvetimail-is-here/feed/</wfw:commentRss>
		<slash:comments>84</slash:comments>
		</item>
		<item>
		<title>Helvetwitter to accompany Helvetireader and Helvetical</title>
		<link>http://www.josefrichter.com/blog/helvetwitter-to-accompany-helvetireader-and-helvetical/</link>
		<comments>http://www.josefrichter.com/blog/helvetwitter-to-accompany-helvetireader-and-helvetical/#comments</comments>
		<pubDate>Mon, 07 Sep 2009 12:37:09 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[design]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[helvetical]]></category>
		<category><![CDATA[helvetireader]]></category>
		<category><![CDATA[helvetwitter]]></category>
		<category><![CDATA[twitter]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=329</guid>
		<description><![CDATA[Probably everyone, including me, likes Helvetireader and the new kid on the block, Helvetical. My despair with Twitter website as well as standalone clients, made me create a minimalist twitter client, using custom CSS and Fluid. Please click the icon to go to special Helvetwitter subpage. This blogpost is mainly a support for Helvetwitter. If [...]]]></description>
			<content:encoded><![CDATA[<p>Probably everyone, including me, likes Helvetireader and the new kid on the block, Helvetical. My despair with Twitter website as well as standalone clients, made me create a minimalist twitter client, using custom CSS and Fluid.</p>
<p><strong>Please click the icon to go to special Helvetwitter subpage.</strong></p>
<p><a href="http://www.josefrichter.com/helvetwitter"><img src="http://www.josefrichter.com/blog/wp-content/uploads/helvetwitter_icon.png" alt="helvetwitter_icon" title="helvetwitter_icon" width="359" height="454" class="alignnone size-full wp-image-330" /></a></p>
<p>This blogpost is mainly a support for Helvetwitter. If you are having some problems making it work, please check also my older blog posts <a href="http://www.josefrichter.com/blog/offline-gmail-google-docs-helvetireader-etc-using-fluid/">here</a> and <a href="http://www.josefrichter.com/blog/gmail-as-a-stand-alone-offline-application-using-gears-and-prism/">here</a>.</p>
<p>If you still have any problem, please leave a comment under this blogpost. Thank you!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/helvetwitter-to-accompany-helvetireader-and-helvetical/feed/</wfw:commentRss>
		<slash:comments>37</slash:comments>
		</item>
		<item>
		<title>Helvetireader 512px mac dock icon</title>
		<link>http://www.josefrichter.com/blog/helvetireader-512px-mac-dock-icon/</link>
		<comments>http://www.josefrichter.com/blog/helvetireader-512px-mac-dock-icon/#comments</comments>
		<pubDate>Sun, 23 Aug 2009 13:06:39 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[user interface]]></category>
		<category><![CDATA[dock]]></category>
		<category><![CDATA[fluid]]></category>
		<category><![CDATA[helvetireader]]></category>
		<category><![CDATA[icon]]></category>
		<category><![CDATA[prism]]></category>
		<category><![CDATA[rss]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=291</guid>
		<description><![CDATA[UPDATE: Helvetwitter is out! check www.josefrichter.com/helvetwitter If you are using Helvetireader, maybe incorporated into Fluid or Mozilla Prism, you might have been looking for a nice 512px icon. As I didn&#8217;t find any nice one, I decided to make one myself. So here is the result. Feel free to donwnload and share it (please include [...]]]></description>
			<content:encoded><![CDATA[<p>UPDATE: <strong>Helvetwitter</strong> is out! check <a href="http://www.josefrichter.com/helvetwitter">www.josefrichter.com/helvetwitter</a></p>
<p>If you are using Helvetireader, maybe incorporated into Fluid or Mozilla Prism, you might have been looking for a nice 512px icon. As I didn&#8217;t find any nice one, I decided to make one myself. So here is the result. Feel free to donwnload and share it (please include link to my blog if redistributing).</p>
<p>UPDATE: I made the icon a little bit smaller to better fit among others and to nicely accomodate the unread count.</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/dock_cut.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/dock_cut.png" alt="dock_cut" title="dock_cut" width="335" height="122" class="alignnone size-full wp-image-321" /></a></p>
<p>just right-click and download the icon:</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/helvetireader_icon_3.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/helvetireader_icon_3.png" alt="Helvetireader 512 dock icon" title="Helvetireader 512 dock icon" width="512" height="512" class="alignnone size-full wp-image-319" /></a></p>
<p>If you don&#8217;t know how to turn Helvetireader into stand alone desktop application, please see <a href="http://www.josefrichter.com/blog/offline-gmail-google-docs-helvetireader-etc-using-fluid/">my older post</a>.</p>
<p>You can change the application icon using <a href="http://www.panic.com/candybar/">Candybar</a>, or just select the PNG icon file when creating new Fluid app.  </p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/helvetireader-512px-mac-dock-icon/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>Clear and re-fill form fields using jQuery</title>
		<link>http://www.josefrichter.com/blog/clear-and-re-fill-form-fields-using-jquery/</link>
		<comments>http://www.josefrichter.com/blog/clear-and-re-fill-form-fields-using-jquery/#comments</comments>
		<pubDate>Tue, 16 Jun 2009 22:36:09 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[user interface]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=209</guid>
		<description><![CDATA[This piece of code makes form fields more intelligent and usable. It clears the field on focus and if nothing is filled-in, it puts back the default value. There is a single line function MooTools for this, but I used jQuery elsewhere on the web, so I needed jQuery solution. But couldn&#8217;t find any good [...]]]></description>
			<content:encoded><![CDATA[<p>This piece of code makes form fields more intelligent and usable. It clears the field on focus and if nothing is filled-in, it puts back the default value. There is a <a href="http://mootools.net/docs/more/Forms/OverText">single line function MooTools</a></p>
<p>for this, but I used jQuery elsewhere on the web, so I needed jQuery solution. But couldn&#8217;t find any good one, so I put together my own.</p>
<p>The form can be seen in action at <a href="http://www.fofrem.info/objednat.html">http://www.fofrem.info/objednat.html</a></p>
<p>Usage:</p>
<p>Just put the default text into alt attribute of the text field, like this:</p>
<div style="font-size: 10px;">
<pre class="brush: html; gutter: false; auto-links: false; tab-size: 2;" >
<input class="text" alt="E-mail" name="email" type="text" />
</pre>
</div>
<p>For some reason, I couldn&#8217;t make it work by using value attribute. The <code>if($(this).val()==$(this).attr("value"))</code> part doesn&#8217;t work. Anyone knows why?</p>
<p>The script will do the rest. It is pretty obvious from the code how it works, even if you know little about jQuery.</p>
<div style="font-size: 10px;">
<pre class="brush: javascript; gutter: false; auto-links: false; font-size: 5%; tab-size: 2;">
<script src="javascript/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
			$(document).ready(function(){

				// set all input.text default value according to alt attribute
				$("input.text").each(function(){
					$(this).val($(this).attr("alt"));
				});

				// clear input.text on focus, if still in default
				$("input.text").focus(function() {

					if($(this).val()==$(this).attr("alt")) {
						$(this).val("");
					}
				});

				// if field is empty afterward, add text again
				$("input.text").blur(function() {
					if($(this).val()=="") {
						$(this).val($(this).attr("alt"));
					}
				});

			});

</script>
</pre>
</div>
<p>Please don&#8217;t hesitate to leave a comment if you need more details. Enjoy!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/clear-and-re-fill-form-fields-using-jquery/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Offline Gmail, Google Docs, Helvetireader, etc. using Fluid</title>
		<link>http://www.josefrichter.com/blog/offline-gmail-google-docs-helvetireader-etc-using-fluid/</link>
		<comments>http://www.josefrichter.com/blog/offline-gmail-google-docs-helvetireader-etc-using-fluid/#comments</comments>
		<pubDate>Tue, 26 May 2009 23:47:22 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[apple]]></category>
		<category><![CDATA[google]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[fluid]]></category>
		<category><![CDATA[gmail]]></category>
		<category><![CDATA[google docs]]></category>
		<category><![CDATA[google gears]]></category>
		<category><![CDATA[google reader]]></category>
		<category><![CDATA[helvetireader]]></category>
		<category><![CDATA[mozilla prism]]></category>
		<category><![CDATA[offline]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/offline-gmail-google-docs-helvetireader-etc-using-fluid/</guid>
		<description><![CDATA[UPDATE: Helvetwitter is out! See www.josefrichter.com/helvetwitter In a previous post, I was explaining how to enable Google Gears within Mozilla Prism to turn Gmail, Google Docs and other Google Applications into stand-alone offline applications, that may come useful e.g. when you are in plane or train. You may know, that specifically for Mac, there is [...]]]></description>
			<content:encoded><![CDATA[<p>UPDATE: <strong>Helvetwitter</strong> is out! See <a href="http://www.josefrichter.com/helvetwitter">www.josefrichter.com/helvetwitter</a></p>
<p style="clear: both">In a <a href="http://www.josefrichter.com/blog/gmail-as-a-stand-alone-offline-application-using-gears-and-prism/">previous post</a>, I was explaining how to enable Google Gears within Mozilla Prism to turn Gmail, Google Docs and other Google Applications into stand-alone offline applications, that may come useful e.g. when you are in plane or train.</p>
<p style="clear: both">You may know, that specifically for Mac, there is an alternative to Mozilla Prism, that is called <a href="http://fluidapp.com/">Fluid</a>. In principle, it is the same as Prism, i.e. &#8220;site specific browser&#8221;. It is just based on <a href="http://webkit.org/">WebKit engine</a> (like Safari) instead of <a href="https://developer.mozilla.org/en/Gecko">Gecko engine</a> (like Firefox).</p>
<p style="clear: both">In Prism, enabling Gears required a simple &#8220;hack&#8221;, changing the target application descriptor. I was quite surprised that in Fluid, this is not a problem. You just click the Offline link (at top right) in Gmail or Google Docs to activate Gears. You will be then redirected to Google Gears package download, which you need to install. Then you just restart Fluid applications and there you are! No problem, it just works.</p>
<p style="clear: both">It seems Fluid is much more configurable than Prism. For example, it nicely integrates with 1Password, which makes moving your favourite web applications under Fluid even easier.</p>
<p style="clear: both">What&#8217;s more, the Gmail icon (use the nice one I provided in <a href="http://www.josefrichter.com/blog/gmail-as-a-stand-alone-offline-application-using-gears-and-prism/">previous post</a>}, if placed in Dock, even shows the number of unread emails, just like Mail.app does!</p>
<p style="clear: both">Now the <a href="http://helvetireader.com/">Helvetireader</a>. Fluid makes it super easy to include user scripts. So here are the steps to be taken:</p>
<p style="clear: both">UPDATE: step 0. Download my new <a href="http://www.josefrichter.com/blog/helvetireader-512px-mac-dock-icon/" target="_blank">Helvetireader icon</a>.</p>
<p style="clear: both">1. Create new Fluid app from Google Reader. Select to use the icon downloaded in step 0.</p>
<p style="clear: both">2. Download the <a href="http://helvetireader.com/helvetireader.user.js">helvetireader.user.js</a> file.</p>
<p style="clear: both">3. In the newly created Google Reader Fluid app, click on the script icon on the top menu bar and select New Userscript&#8230;</p>
<p style="clear: both">4. Call it Helvetireader and you will get a Dashcode opened. Now copy all contents of helvetireader.user.js and paste it into this widow instead of the comment &#8220;// do yer thang!&#8221;. The result shall look like this:</p>
<p style="clear: both"><a class="image-link" href="http://www.josefrichter.com/blog/wp-content/uploads/voila-capture15-full.png"><img class="linked-to-original" style=" display: inline; float: left; margin: 0 10px 10px 0;" src="http://www.josefrichter.com/blog/wp-content/uploads/voila-capture15-thumb.png" alt="" width="500" height="562" align="left" /></a><br style="clear: both" />5. Save &amp; close &amp; refresh Google Reader.</p>
<p style="clear: both">6. Activate the offline Gears mode.</p>
<p>Done! You should have one of the most beautiful, full fledget RSS reader around!</p>
<p style="clear: both">See a screenshot with offline Gmail, Google Docs and Helvetireader:</p>
<p style="clear: both"><a class="image-link" href="http://www.josefrichter.com/blog/wp-content/uploads/voila-capture14-full.png"><img class="linked-to-original" style=" display: inline; float: left; margin: 0 10px 10px 0;" src="http://www.josefrichter.com/blog/wp-content/uploads/voila-capture14-thumb.png" alt="" width="499" height="312" align="left" /></a><br style="clear: both" />So if you are on Mac, your life is easier (as always <img src='http://www.josefrichter.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':-)' class='wp-smiley' />  ), if you go with Fluid. Enjoy!</p>
<p><br class="final-break" style="clear: both" /></p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/offline-gmail-google-docs-helvetireader-etc-using-fluid/feed/</wfw:commentRss>
		<slash:comments>14</slash:comments>
		</item>
		<item>
		<title>One more wallpaper with The Hit List to-dos</title>
		<link>http://www.josefrichter.com/blog/one-more-wallpaper-with-the-hit-list-to-dos/</link>
		<comments>http://www.josefrichter.com/blog/one-more-wallpaper-with-the-hit-list-to-dos/#comments</comments>
		<pubDate>Tue, 26 May 2009 15:04:04 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[apple]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[appscript]]></category>
		<category><![CDATA[dynamic]]></category>
		<category><![CDATA[geektool]]></category>
		<category><![CDATA[gtd]]></category>
		<category><![CDATA[potion factory]]></category>
		<category><![CDATA[ruby]]></category>
		<category><![CDATA[scripting]]></category>
		<category><![CDATA[the hit list]]></category>
		<category><![CDATA[todo]]></category>
		<category><![CDATA[wallpaper]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=151</guid>
		<description><![CDATA[My friend Vojto from http://www.infinite.sk/(check his portfolio, talented guy!) sent me his variation on my wallpaper, which displays to-dos from The Hit List. The Hit List is a really very nice alternative to Things. I used it before Things, but I was missing the iPhone version. I beleive they will be adding iPhone version sooner [...]]]></description>
			<content:encoded><![CDATA[<p>My friend Vojto from <a href="http://www.infinite.sk/">http://www.infinite.sk/</a>(check his portfolio, talented guy!) sent me his variation on my wallpaper, which displays to-dos from The Hit List. <a href="http://www.potionfactory.com/thehitlist/">The Hit List</a> is a really very nice alternative to Things. I used it before Things, but I was missing the iPhone version. I beleive they will be adding iPhone version sooner or later, though. It&#8217;s a must. But I just LOVE their icon. Maybe the most beautiful one on my MacBook.</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/thehitlisticon.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/thehitlisticon-500x500.png" alt="thehitlisticon" title="thehitlisticon" width="500" height="500" class="alignnone size-large wp-image-152" /></a></p>
<p>Here is the screenshot of Vojto&#8217;s wallpaper &#8220;in action&#8221;. It&#8217;s for tiny displays: 1680&#215;1050 <img src='http://www.josefrichter.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':-)' class='wp-smiley' /> </p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/blue_screenshot.jpg"><img src="http://www.josefrichter.com/blog/wp-content/uploads/blue_screenshot-500x312.jpg" alt="blue dynamic wallpaper" title="blue dynamic wallpaper" width="500" height="312" class="alignnone size-large wp-image-153" /></a></p>
<p>Grab the underlying JPG wallpaper <a href="http://www.josefrichter.com/blog/wp-content/uploads/blue-wallpaper.jpg">here</a>.</p>
<p>Now the scripting. It&#8217;s going to be just a little bit more difficult than with Things, but nothing to be scared of.</p>
<p>If you need the introduction to GeekTool, please see the <a href="http://www.josefrichter.com/blog/dynamic-gtd-wallpaper-with-things-to-dos/">previous post</a>.</p>
<p>1. You will need <a href="http://developer.apple.com/Tools/">Apple Developer Tools</a> and <a href="http://www.ruby-lang.org/en/downloads/">Ruby</a>, which should both be included in your Mac OS installation.</p>
<p>2. You will need <a href="http://appscript.sourceforge.net/">rb-appscript</a> which you install by entering &#8220;sudo gem install rb-appscript&#8221; in terminal. This makes application scriptable using Ruby (alternatively Python or ObjC). If you don&#8217;t know what the hell does it mean, just don&#8217;t care and proceed <img src='http://www.josefrichter.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':-)' class='wp-smiley' /> </p>
<p>3. Now create file ~/.hitlist and put in the following code UPDATE: the new code checks if The Hit List is open, and if not, it will close it again after taking the to-dos from it.</p>
<div style="font-size: 10px;">
<pre class="brush: ruby; gutter: false; auto-links: false; font-size: 5%; tab-size: 2;">
#!/usr/bin/ruby 

# Load up appscript
begin; require 'rubygems'; rescue LoadError; end
require 'appscript'

# Load Hit List and check if running
thl=Appscript.app('The Hit List')
begin
  wasnt_running = true
  thl.run
end unless thl.is_running?

# Get todos
puts thl.today_list.tasks.get.find_all { |t|
  !t.completed.get
}.map{ |t|
  t.title.get
}.join("\n")

thl.quit if wasnt_running
</pre>
</div>
<p>Save &#038; close</p>
<p>4. In terminal, type &#8220;chmod +x ~/.hitlist&#8221; to allow reading from this file.</p>
<p>5. Open the geek tool and add new item as follows:</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/hitlist_geektool.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/hitlist_geektool-500x355.png" alt="hitlist_geektool" title="hitlist_geektool" width="500" height="355" class="alignnone size-large wp-image-154" /></a></p>
<p>And you should be done! Enjoy!</p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/one-more-wallpaper-with-the-hit-list-to-dos/feed/</wfw:commentRss>
		<slash:comments>29</slash:comments>
		</item>
		<item>
		<title>Dynamic GTD wallpaper with Things to dos</title>
		<link>http://www.josefrichter.com/blog/dynamic-gtd-wallpaper-with-things-to-dos/</link>
		<comments>http://www.josefrichter.com/blog/dynamic-gtd-wallpaper-with-things-to-dos/#comments</comments>
		<pubDate>Sun, 24 May 2009 20:02:24 +0000</pubDate>
		<dc:creator>Josef Richter</dc:creator>
				<category><![CDATA[apple]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[applesctipt]]></category>
		<category><![CDATA[culturedcode]]></category>
		<category><![CDATA[date]]></category>
		<category><![CDATA[dynamic]]></category>
		<category><![CDATA[geektool]]></category>
		<category><![CDATA[gtd]]></category>
		<category><![CDATA[things]]></category>
		<category><![CDATA[time]]></category>
		<category><![CDATA[todo]]></category>
		<category><![CDATA[wallpaper]]></category>

		<guid isPermaLink="false">http://www.josefrichter.com/blog/?p=136</guid>
		<description><![CDATA[I&#8217;ve made myself a simple wallpaper with categorized sections, which helps me be more organized. I am also recently using great Things by CulturedCode to do manager. I made use of Things scripting capabilities to display Today&#8217;s to-dos on the wallpaper. Here is what the result looks like: So here is how to do that: [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve made myself a simple wallpaper with categorized sections, which helps me be more organized. I am also recently using great <a href="http://www.culturedcode.com/things/">Things by CulturedCode</a> to do manager. I made use of Things scripting capabilities to display Today&#8217;s to-dos on the wallpaper.</p>
<p>Here is what the result looks like:</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/screenshot1.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/screenshot1-500x312.png" alt="GTD wallpaper screenshot" title="GTD wallpaper screenshot" width="500" height="312" class="alignnone size-large wp-image-138" /></a></p>
<p>So here is how to do that:</p>
<p>1. Grab <a href="http://www.josefrichter.com/blog/wp-content/uploads/gtd_wallpaper.png">my wallpaper</a> or use your own, as you wish. My wallpaper is in 1920&#215;1200. If you would like a smaller version, please let me know, I will try to add them asap if demanded.</p>
<p>2. Get the <a href="http://projects.tynsoe.org/en/geektool/">GeekTool</a>. It allows adding the dynamic elements to desktop.</p>
<p>3. Open the GeekTool in System Preferences and add the &#8220;Time&#8221; item with following content:</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/voila_capture4.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/voila_capture4-500x355.png" alt="Time added in GeekTool" title="Time added in GeekTool" width="500" height="355" class="alignnone size-large wp-image-144" /></a></p>
<p>Adjust the font style, size, colors and position according to your needs. It&#8217;s kinda self obvious how to do that.</p>
<p>3. Add &#8220;Date&#8221; item as follows:</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/voila_capture5.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/voila_capture5-500x355.png" alt="Date added in GeekTool" title="Date added in GeekTool" width="500" height="355" class="alignnone size-large wp-image-145" /></a></p>
<p>GeekTool uses standard PHP date and time formatting. So if you want them in different format than I have, use <a href="http://cz2.php.net/manual/en/function.date.php">this</a> as a reference.</p>
<p>4. Now the Things thing. Open Script Editor.app and fill in with the following code (if you are lazy or want to avoid typos, download the <a href="http://www.josefrichter.com/blog/wp-content/uploads/todo.scpt">todo.scpt</a> directly):</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/voila_capture12.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/voila_capture12-500x460.png" alt="Things AppleScript" title="Things AppleScript" width="500" height="460" class="alignnone size-large wp-image-157" /></a></p>
<p>It&#8217;s written in AppleScript. Don&#8217;t worry, I haven&#8217;t done anything in AppleScript before this, but the nice thing about it it&#8217;s pretty obvious what the code does, cos it&#8217;s almost plain English. <del datetime="2009-05-26T08:43:10+00:00">The only &#8220;strange&#8221; thing in the code is the first line, which just makes a line break between the todo items.</del> UPDATE: the new script will open Things, get the to-dos and will close it again, if it wasn&#8217;t open before. You may want to change the update interval from 10sec to something like 10 minutes or so.</p>
<p>If you want to change the script to display not only items in Today, but maybe others as well, just replace &#8220;Today&#8221; with &#8220;Inbox&#8221; or &#8220;Scheduled&#8221; or whatever. It&#8217;s that easy. If you want some more complex functionality, like also showing the tags, due date, etc., please refer to the full <a href="http://www.culturedcode.com/things/wiki/index.php/Welcome">Things AppleScript Guide</a>.</p>
<p>Save the script anywhere you wish (just remember where it is <img src='http://www.josefrichter.com/blog/wp-includes/images/smilies/icon_smile.gif' alt=':-)' class='wp-smiley' /> )</p>
<p>5. Now add the &#8220;ToDo&#8221; item in GeekTool which should look like this:</p>
<p><a href="http://www.josefrichter.com/blog/wp-content/uploads/voila_capture6.png"><img src="http://www.josefrichter.com/blog/wp-content/uploads/voila_capture6-500x355.png" alt="Todo in GeekTool" title="Todo in GeekTool" width="500" height="355" class="alignnone size-large wp-image-147" /></a></p>
<p>Of course, use your own path to the script file. Again adjust the formatting and the position of the list.</p>
<p>Done! Now you should have Things to-dos, time and date at your desktop. Enjoy! And leave a comment how you like it! Thank you.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.josefrichter.com/blog/dynamic-gtd-wallpaper-with-things-to-dos/feed/</wfw:commentRss>
		<slash:comments>15</slash:comments>
		</item>
	</channel>
</rss>

