<?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>thomashartnell.com &#187; Portfolio</title>
	<atom:link href="http://thomashartnell.com/category/portfolio/feed/" rel="self" type="application/rss+xml" />
	<link>http://thomashartnell.com</link>
	<description></description>
	<lastBuildDate>Thu, 18 Aug 2011 02:05:53 +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>Deskwanted maps</title>
		<link>http://thomashartnell.com/portfolio/deskwanted-maps/</link>
		<comments>http://thomashartnell.com/portfolio/deskwanted-maps/#comments</comments>
		<pubDate>Sat, 06 Aug 2011 02:09:23 +0000</pubDate>
		<dc:creator>tom</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[AJAX]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[maps]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[web]]></category>

		<guid isPermaLink="false">http://tom.dev/?p=478</guid>
		<description><![CDATA[I worked alongside the Ruby development team behind new co-working startup Deskwanted to integrate Google Maps across the site. Using a combination of Google&#8217;s excellent Javascript Maps API and the jQuery framework I developed stylised info pop-ups to display the desk share search results on the maps and replaced all default map controls with custom [...]]]></description>
			<content:encoded><![CDATA[<div class="item_images"><img class="alignnone size-full wp-image-538" title="deskwanted_infowindow" src="http://thomashartnell.com/wp-content/uploads/2011/04/deskwanted_infowindow.jpg" alt="" width="320" height="197" /><img class="alignnone size-full wp-image-539" title="deskwanted_map" src="http://thomashartnell.com/wp-content/uploads/2011/04/deskwanted_map.jpg" alt="" width="320" height="197" /></div>
<div class="item_text">
<p>I worked alongside the Ruby development team behind new co-working startup Deskwanted to integrate Google Maps across the site.</p>
<p>Using a combination of Google&#8217;s excellent Javascript Maps API and the jQuery framework I developed stylised info pop-ups to display the desk share search results on the maps and replaced all default map controls with custom designed elements.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://thomashartnell.com/portfolio/deskwanted-maps/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Doolali iPhone app beta</title>
		<link>http://thomashartnell.com/portfolio/doolali-iphone-app-beta/</link>
		<comments>http://thomashartnell.com/portfolio/doolali-iphone-app-beta/#comments</comments>
		<pubDate>Fri, 05 Aug 2011 02:51:46 +0000</pubDate>
		<dc:creator>tom</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[build]]></category>
		<category><![CDATA[iOS]]></category>

		<guid isPermaLink="false">http://tom.dev/?p=490</guid>
		<description><![CDATA[Doolali is a geo-located social video service allowing users to upload and share short video clips from mobile devices which are instantly viewable by time and location. With a protoype web application in the works, the developers asked me to create the first version of the mobile client for iPhone devices which I completed in [...]]]></description>
			<content:encoded><![CDATA[<div class="item_images"><img class="alignnone size-full wp-image-572" style="padding-left: 70px;" title="Doolali for iPhone - map view" src="http://thomashartnell.com/wp-content/uploads/2011/04/doolali_iphone_hz.png" alt="" width="199" height="389" /></div>
<div class="item_text">
<p>Doolali is a geo-located social video service allowing users to upload and share short video clips from mobile devices which are instantly viewable by time and location.</p>
<p>With a protoype web application in the works, the developers asked me to create the first version of the mobile client for iPhone devices which I completed in little over a month from initial wireframes to AppStore release.</p>
<p>Technology wise the app connects to an OAuth secured JSON API and I was able to use block operations, which had been recently introduced to iOS 4, to efficiently handle the data connection and video upload outbox.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://thomashartnell.com/portfolio/doolali-iphone-app-beta/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Jabbakam iPhone app</title>
		<link>http://thomashartnell.com/portfolio/jabbakam-iphone-app/</link>
		<comments>http://thomashartnell.com/portfolio/jabbakam-iphone-app/#comments</comments>
		<pubDate>Fri, 05 Aug 2011 01:50:27 +0000</pubDate>
		<dc:creator>tom</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[build]]></category>
		<category><![CDATA[iOS]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[UX]]></category>

		<guid isPermaLink="false">http://tom.dev/?p=471</guid>
		<description><![CDATA[The Jabbakam service enables users to monitor, organise and be alerted to clips from their personal or public networks of inexpensive IP security cameras from anywhere through a unique online web application. As the sole iOS developer I was commissioned to build the official iPhone client to replicate many of the features of the web app for [...]]]></description>
			<content:encoded><![CDATA[<div class="item_images"><img class="alignnone size-full wp-image-569" style="padding-left: 70px;" title="Jabbakam for iPhone - inbox" src="http://thomashartnell.com/wp-content/uploads/2011/04/jabbakam_iphone_hz1.png" alt="Jabbakam for iPhone - image of inbox" width="199" height="389" /><img src="http://thomashartnell.com/wp-content/uploads/2011/04/jabbakam_iphone_map.png" alt="Jabbakam for iPhone - image of network map"  style="padding-left: 70px;" title="Jabbakam for iPhone - network map" width="200" height="392" class="alignnone size-full wp-image-596" /></div>
<div class="item_text">
<p>The Jabbakam service enables users to monitor, organise and be alerted to clips from their personal or public networks of inexpensive IP security cameras from anywhere through a unique online web application. As the sole iOS developer I was commissioned to build the official iPhone client to replicate many of the features of the web app for users of the Apple device.</p>
<p>Having worked extensively on the front-end code of the <a href="http://thomashartnell.com/portfolio/jabbakam/" title="View portfolio entry for Jabbakam">existing site</a> I had a good overview of the functionality which needed to be translated to work on the much smaller touch screen display and I opted to, as far as possible, follow Apple UI patterns to offer the user a familiar and intuitive experience.</p>
<p>This challenging project began as a collaboration with the sites backend team to define a suitable API to the cloud-hosted data followed by coding a connection layer (secured with the OAuth protocol) in Objective-C to get user data in and out of the app.</p>
<p>The app features a custom coded clip player to view recordings, the ability to remotely activate and disable your cameras, several tools for searching, discovering and joining other camera networks and the ability to geo-locate a new camera installation using the iPhones built in GPS.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://thomashartnell.com/portfolio/jabbakam-iphone-app/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Peaches Official blog</title>
		<link>http://thomashartnell.com/portfolio/peaches-official-blog/</link>
		<comments>http://thomashartnell.com/portfolio/peaches-official-blog/#comments</comments>
		<pubDate>Thu, 04 Aug 2011 03:04:29 +0000</pubDate>
		<dc:creator>tom</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[build]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://tom.dev/?p=494</guid>
		<description><![CDATA[I worked with Berlin based design and production duo KS12 to implement this blog for electro artist Peaches. The team had been challenged to deliver the new blog site for an imminent public launch date and I consulted them as to what was possible within such a short timescale. From supplied design files I then [...]]]></description>
			<content:encoded><![CDATA[<div class="item_images"><img src="http://thomashartnell.com/wp-content/uploads/2011/08/peaches_site.jpg" alt="" title="peaches_site" width="320" height="197" class="alignnone size-full wp-image-543" /><img src="http://thomashartnell.com/wp-content/uploads/2011/08/peaches_twitter.jpg" alt="" title="peaches_twitter" width="320" height="197" class="alignnone size-full wp-image-544" /></div>
<div class="item_text">
<p>I worked with Berlin based design and production duo KS12 to implement this blog for electro artist Peaches.</p>
<p>The team had been challenged to deliver the new blog site for an imminent public launch date and I consulted them as to what was possible within such a short timescale. From supplied design files I then customised a WordPress theme to provide the desired style and functionality, which includes an interactive tag cloud and multiple twitter feeds from the band members.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://thomashartnell.com/portfolio/peaches-official-blog/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Postcards from Berlin</title>
		<link>http://thomashartnell.com/portfolio/postcards-from-berlin/</link>
		<comments>http://thomashartnell.com/portfolio/postcards-from-berlin/#comments</comments>
		<pubDate>Tue, 05 Jul 2011 02:35:26 +0000</pubDate>
		<dc:creator>tom</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[build]]></category>
		<category><![CDATA[UX]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://tom.dev/?p=483</guid>
		<description><![CDATA[Postcards from Berlin, a website to collect photos, videos and stories from residents of the 32 Berlins in the USA, is the pet project of the duo at KS12 creative studio in Berlin, Germany. Although the project had been meticulously planned conceptually, at the time it had not been realised as a working site. I [...]]]></description>
			<content:encoded><![CDATA[<div class="item_images"><a href="http://www.postcardsfromberlin.com/" target="_blank"><img class="alignnone size-full wp-image-545" title="Visit this site" src="http://thomashartnell.com/wp-content/uploads/2011/08/postcards_site.jpg" alt="" width="320" height="197" /></a></div>
<div class="item_text">
<p>Postcards from Berlin, a website to collect photos, videos and stories from residents of the 32 Berlins in the USA, is the pet project of the duo at KS12 creative studio in Berlin, Germany.</p>
<p>Although the project had been meticulously planned conceptually, at the time it had not been realised as a working site. I worked with producer Gabriel and graphic designer Patricia on the wireframing and experience design and later built a custom WordPress theme, translating their vision into a working prototype in time for the 2009 Power to the Pixel cross media forum in London.</p>
<p>After the conference the team grew to include 2 additional talented developers who built on the initial site and although busy with commercial projects I was pleased to be able to dip in occasionally, contribute the odd line of PHP and work with the great multidisciplinary team on enhancing the project.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://thomashartnell.com/portfolio/postcards-from-berlin/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Jabbakam</title>
		<link>http://thomashartnell.com/portfolio/jabbakam/</link>
		<comments>http://thomashartnell.com/portfolio/jabbakam/#comments</comments>
		<pubDate>Sun, 05 Jun 2011 03:12:57 +0000</pubDate>
		<dc:creator>tom</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[AJAX]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[maps]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[web]]></category>

		<guid isPermaLink="false">http://tom.dev/?p=497</guid>
		<description><![CDATA[Jabbakam is a new web service offering, in their own words, &#8220;Cloud based, self administered security camera networks for communities, businesses &#38; individuals&#8221;. I was brought it at an early stage of the development process to integrate Google Maps across the application for all location related views and went on to work on a large suite of [...]]]></description>
			<content:encoded><![CDATA[<div class="item_images"><img class="alignnone size-full wp-image-556" title="jabbakam_slider" src="http://thomashartnell.com/wp-content/uploads/2011/04/jabbakam_slider1.jpg" alt="" width="320" height="197" /><img class="alignnone size-full wp-image-550" title="jabbakam_map" src="http://thomashartnell.com/wp-content/uploads/2011/04/jabbakam_map.jpg" alt="" width="320" height="197" /></div>
<div class="item_text">
<p>Jabbakam is a new web service offering, in their own words, &#8220;Cloud based, self administered security camera networks for communities, businesses &amp; individuals&#8221;.</p>
<p>I was brought it at an early stage of the development process to integrate Google Maps across the application for all location related views and went on to work on a large suite of jQuery plugins which enable much of the site&#8217;s user-interface.</p>
<p>I was responsible for implementing features such as drag-drop organisation of inboxes and folders, re-orderable lists, many custom modal alerts and dialog boxes and a Google style map-based network search with adjacent paginated results. <br />I also had the opportunity to design and code a unique time range slider which allows intuitive selection within a 24hr time range for viewing recorded clips. A momentary pause while dragging the selector &#8216;handle&#8217; switches the selection snap to detailed 5 minute increments to allow fine tuning with a visual indication before an AJAX based search shows the resulting clips.</p>
<p> My work on this project led to me developing the official <a title="portfolio entry for Jabbakam iPhone app" href="http://thomashartnell.com/portfolio/jabbakam-iphone-app/">Jabbakam iPhone client</a> which was released on the App Store shortly after Jabbakam&#8217;s public unveiling.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://thomashartnell.com/portfolio/jabbakam/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Esher Place website</title>
		<link>http://thomashartnell.com/portfolio/esher-place-website/</link>
		<comments>http://thomashartnell.com/portfolio/esher-place-website/#comments</comments>
		<pubDate>Tue, 05 Apr 2011 02:18:37 +0000</pubDate>
		<dc:creator>tom</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[build]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://tom.dev/?p=501</guid>
		<description><![CDATA[An intranet style site for a residential community in Surrey with image gallery, news blog and live weather and traffic feeds for the local area. From supplied Photoshop templates I built this site as a custom theme running on the WordPress platform, chosen by the agency as it provided a simple, intuitive method of managing [...]]]></description>
			<content:encoded><![CDATA[<div class="item_images"><img src="http://thomashartnell.com/wp-content/uploads/2011/08/esherplace_site.jpg" alt="" title="esherplace_site" width="320" height="197" class="alignnone size-full wp-image-541" /><img src="http://thomashartnell.com/wp-content/uploads/2011/08/esherplace_widgets.jpg" alt="" title="esherplace_widgets" width="320" height="197" class="alignnone size-full wp-image-542" /></div>
<div class="item_text">
<p>An intranet style site for a residential community in Surrey with image gallery, news blog and live weather and traffic feeds for the local area.</p>
<p>From supplied Photoshop templates I built this site as a custom theme running on the WordPress platform, chosen by the agency as it provided a simple, intuitive method of managing content for the end users while also allowing a time and cost effective way to replace the existing static site.</p>
<p>The theme code was written from scratch in PHP and includes custom functionality to provide the weather and traffic feeds in a style defined by the design team.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://thomashartnell.com/portfolio/esher-place-website/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Persefoni Myrtsou website</title>
		<link>http://thomashartnell.com/portfolio/persefoni-myrtsou/</link>
		<comments>http://thomashartnell.com/portfolio/persefoni-myrtsou/#comments</comments>
		<pubDate>Fri, 06 Aug 2010 20:55:53 +0000</pubDate>
		<dc:creator>tom</dc:creator>
				<category><![CDATA[Portfolio]]></category>
		<category><![CDATA[build]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[WordPress]]></category>

		<guid isPermaLink="false">http://tom.dev/?p=229</guid>
		<description><![CDATA[A simple portfolio site for Berlin-based installation artist Persefoni Myrtsou featuring a hand drawn navigation menu, lightbox style image galleries and embedded Vimeo media. The menu is designed to allow the artist to easily create new categories and workpiece titles which are automatically associated with the hand drawn images once uploaded. I worked closely with [...]]]></description>
			<content:encoded><![CDATA[<div class="item_images"><a href="http://www.persefoni.co.uk/" target="_blank"><img src="http://thomashartnell.com/wp-content/uploads/2010/08/persefoni_site.jpg" alt="" title="Visit this site" width="320" height="197" class="alignnone size-full wp-image-533" /></a></div>
<div class="item_text">
<p>A simple portfolio site for Berlin-based installation artist Persefoni Myrtsou featuring a hand drawn navigation menu, lightbox style image galleries and embedded Vimeo media.</p>
<p>The menu is designed to allow the artist to easily create new categories and workpiece titles which<br /> are automatically associated with the hand drawn images once uploaded.</p>
<p>I worked closely with Persefoni to achieve the desired style and functionality within a restricted budget, the choice of WordPress enabling both creative flexibility in development and extremely simple content publishing for the client.</p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://thomashartnell.com/portfolio/persefoni-myrtsou/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

