<?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>pix.l&#124;ne &#039;s Journal &#187; Design</title>
	<atom:link href="http://pixeline.be/blog/category/design/feed" rel="self" type="application/rss+xml" />
	<link>http://pixeline.be/blog</link>
	<description>pixeline is a Brussels-based web developer &#38; designer</description>
	<lastBuildDate>Fri, 25 Jun 2010 18:49:37 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.1</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>simplyTabs: new jquery plugin to create tab interfaces</title>
		<link>http://pixeline.be/blog/2009/simplytabs-new-jquery-plugin-to-create-tab-interfaces.html</link>
		<comments>http://pixeline.be/blog/2009/simplytabs-new-jquery-plugin-to-create-tab-interfaces.html#comments</comments>
		<pubDate>Wed, 04 Mar 2009 12:51:40 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[interface]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[plugin]]></category>
		<category><![CDATA[simplyTabs]]></category>
		<category><![CDATA[tabs]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/?p=387</guid>
		<description><![CDATA[Yesterday i released a jquery plugin to create tabbed interfaces easily: simplyTabs .
There are several existing outthere, but they were all bloated for my needs. See, i don&#8217;t need to download the jquery ui tabs 122k of code when i can achieve the same result with, 4kb unminified, js+css.

My other intention was that the plugin [...]]]></description>
			<content:encoded><![CDATA[<p>Yesterday i released a <strong>jquery plugin to create tabbed interfaces easily: <a href="http://www.pixeline.be/experiments/simplyTabs">simplyTabs</a> .</strong></p>
<p>There are several existing outthere, but they were all bloated for my needs. See, i don&#8217;t need to download the jquery ui tabs 122k of code when i can achieve the same result with, 4kb unminified, js+css.<br />
<span id="more-387"></span></p>
<p>My other intention was that the plugin would not mess around with css properties, only with css class names. With this design, the tabs are fully configurable only via css.</p>
<p>You can find more about the plugin on <a href="http://www.pixeline.be/experiments/simplyTabs">simplyTabs dedicated page</a>. It&#8217;s still fresh out of the egg, so let me know if you find bugs, or if you have ideas for improvement.</p>
<p><script type="text/javascript"><!--
google_ad_client = "pub-3742303038324792";
google_ad_slot = "4068026704";
google_ad_width = 468;
google_ad_height = 60;
//--></script>
<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
</p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2009/simplytabs-new-jquery-plugin-to-create-tab-interfaces.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>New website: Lisa Pram</title>
		<link>http://pixeline.be/blog/2008/new-website-lisa-pram.html</link>
		<comments>http://pixeline.be/blog/2008/new-website-lisa-pram.html#comments</comments>
		<pubDate>Tue, 11 Nov 2008 00:08:15 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[Interfaces]]></category>
		<category><![CDATA[interactivity]]></category>
		<category><![CDATA[interface]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[progressive enhancement]]></category>
		<category><![CDATA[website]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/?p=338</guid>
		<description><![CDATA[I&#8217;m proud to officially announce the launch of a new website for Barcelona-based professional photographer Lisa Pram.
As you&#8217;ll see it&#8217;s quite an experimental project in terms of interface and interactivity. We ended up calling it an &#8220;interactive barcode&#8221;. And in fact, the &#8220;barcode&#8221; term is well suited to the concept behind the interface: to generate [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;m proud to officially announce the launch of a new website for <a href="http://lisapram.com/" target="_blank">Barcelona-based professional photographer Lisa Pram</a>.</p>
<p>As you&#8217;ll see it&#8217;s quite an experimental project in terms of interface and interactivity. We ended up calling it an &#8220;interactive barcode&#8221;. And in fact, the &#8220;barcode&#8221; term is well suited to the concept behind the interface: to generate a unique representation of Lisa&#8217;s work in a non-metaphorical manner, but rather through indexing of her image sets according to four main keywords.</p>
<p>
<a href="http://lisapram.com/" target="_blank" title="lisapram.com"><img src="http://www.pixeline.be/blog/wp-content/uploads/2008/11/lisapram_capture.png" alt="" title="lisapram.com" width="406" height="356" class="alignnone size-full wp-image-339" /></a></p>
<p><span id="more-338"></span></p>
<p>
Via four clickable keywords representing the main areas of her work &#8211; <strong>Professional</strong>, <strong>Experimental </strong>, <strong>Advertising</strong> and <strong>Editorial</strong> &#8211; the visitor can filter through her image galleries.
</p>
<p>Each gallery is represented by a line which thickness reflects the number of images it contains &#8211; 1 image is 1 pixel width. Clicking each of these lines unfolds its pictures in a continuous strip inside the barcode, thus introducing the user into the colors and contrasts of her work.</p>
<p>
Finally, an additional navigation system is laid out underneath the barcode, to ensure that this interface website, although experimental, achieves a good level of usability.</p>
<p>the interface was entirely done with <a href="http://en.wikipedia.org/wiki/Progressive_enhancement" target="_blank">progressive enhancement </a>in mind. No Flash plugin was hurt in the making of this website, thanks to the outstanding <a href="http://www.jquery.com" target="_blank">jQuery </a>javascript library.</p>
<p>Finally, i would like to thank Lisa for giving me so much freedom, for trusting me on this, and for being such a kewl customer. I wish you the best with your new website and for your professional career.</p>
<p>PS: i did some extensive testing, but if you happen to encounter issues with the website, let me know, thanks !</p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2008/new-website-lisa-pram.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>ListNav jquery plugin _ really nice UI !</title>
		<link>http://pixeline.be/blog/2008/listnav-jquery-plugin-_-really-nice-ui.html</link>
		<comments>http://pixeline.be/blog/2008/listnav-jquery-plugin-_-really-nice-ui.html#comments</comments>
		<pubDate>Thu, 02 Oct 2008 20:58:36 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[Interfaces]]></category>
		<category><![CDATA[ergonomy]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/?p=303</guid>
		<description><![CDATA[Among the bunch of new entries added to the jquery plugin repository today, one of them caught my attention as being a really clever way to display a huge list of entries  in a nicely digestible manner: the ListNav jquery plugin.

Basically, it generates out of your long (un)ordered list of elements, a series of [...]]]></description>
			<content:encoded><![CDATA[<p>Among the bunch of new entries added to the<a href="http://plugins.jquery.com/" target="_blank"> jquery plugin repository</a> today, one of them caught my attention as being a really clever way to display a huge list of entries  in a nicely digestible manner: the <a href="http://www.ihwy.com/labs/jquery-listnav-plugin.aspx" target="_blank">ListNav jquery plugin</a>.<br />
<span id="more-303"></span><br />
Basically, it generates out of your long (un)ordered list of elements, a series of small alphabetical tabs, each displaying on mouseover the number of items it contains. </p>
<p><img src="http://www.pixeline.be/blog/wp-content/uploads/2008/10/listnavplugin.jpg" alt="" title="listnavplugin" width="499" height="218" class="alignnone size-full wp-image-304" /></p>
<p>Very clever, very few screen asset, very usable. Well done! Check the <a href="http://www.ihwy.com/labs/Demos/Current/jquery-listnav-plugin.aspx" target="_blank">demo here</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2008/listnav-jquery-plugin-_-really-nice-ui.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Amazing online 3D</title>
		<link>http://pixeline.be/blog/2008/amazing-online-3d.html</link>
		<comments>http://pixeline.be/blog/2008/amazing-online-3d.html#comments</comments>
		<pubDate>Thu, 05 Jun 2008 21:13:39 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[flash]]></category>
		<category><![CDATA[papervision3D]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/2008/amazing-online-3d/</guid>
		<description><![CDATA[I couldn&#8217;t care less for the actual content of this EcoDazoo website, but the 3D rendering is blazingly fast! 
I suspect this was done with Papervision 3D.
Watch it here.
]]></description>
			<content:encoded><![CDATA[<p>I couldn&#8217;t care less for the actual content of this EcoDazoo website, but the 3D rendering is blazingly fast! </p>
<p>I suspect this was done with Papervision 3D.</p>
<p>Watch it <a href="http://ecodazoo.com/">here</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2008/amazing-online-3d.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>3D on the web: has the time arrived?</title>
		<link>http://pixeline.be/blog/2008/3d-on-the-web-has-the-time-arrived.html</link>
		<comments>http://pixeline.be/blog/2008/3d-on-the-web-has-the-time-arrived.html#comments</comments>
		<pubDate>Fri, 18 Apr 2008 07:50:35 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[Interfaces]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[flash]]></category>
		<category><![CDATA[vrml]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/2008/3d-on-the-web-has-the-time-arrived/</guid>
		<description><![CDATA[A few years ago, we did experiments in 3D on the web using the VRML technology. A heavy argument was a hefty 5 megs plugin to install, and only on Internet Explorer. No mac, no firefox, no nothing. VRML is now a almost forgotten technology and it seemed no one saw a reason to pursue [...]]]></description>
			<content:encoded><![CDATA[<p>A few years ago, we did experiments in 3D on the web using the VRML technology. A heavy argument was a hefty 5 megs plugin to install, and only on Internet Explorer. No mac, no firefox, no nothing. VRML is now a almost forgotten technology and it seemed no one saw a reason to pursue the quest for a proper 3D rendering engine to consult and interact in 3D inside your favorite browser.  Until&#8230;<span id="more-295"></span></p>
<p>Until the arrival of Actionscript 3 and such 3D frameworks as <a href="http://blog.papervision3d.org/category/demos/" target="_blank">papervision3D</a>  and the most astonishing one i found this morning: the <a href="http://blog.alternativaplatform.com/en/" target="_blank">Alternativa3D engine</a>.</p>
<p>Check out the   <a href="http://blog.alternativaplatform.com/en/2008/04/18/alternativa3d-5-m1/">Alternativa3D demos</a> it&#8217;s simply amazing to be able to have such fluidity and details from within the flash plaer. Note how the mapping images are lazy loading a la google Maps, gradually showing more details.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2008/3d-on-the-web-has-the-time-arrived.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Experiencing Experience</title>
		<link>http://pixeline.be/blog/2007/experiencing-experience.html</link>
		<comments>http://pixeline.be/blog/2007/experiencing-experience.html#comments</comments>
		<pubDate>Thu, 12 Jul 2007 00:15:37 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Interfaces]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/2007/experiencing-experience/</guid>
		<description><![CDATA[I thought my readers might enjoy a good read about user experience.  Here is a very interesting article about user experience, from a  phenomenologistic point of view, by Tom Guarriello, which might give you a a killer argument the next time your marketing manager burst into your office using the buzzword &#8220;user experience&#8221; [...]]]></description>
			<content:encoded><![CDATA[<p>I thought my readers might enjoy a good read about user experience.  Here is a very interesting article about user experience, from a  phenomenologistic point of view, by Tom Guarriello, which might give you a a killer argument the next time your marketing manager burst into your office using the buzzword &#8220;user experience&#8221; every two sentences&#8230;</p>
<p>long story short: <strong>Designers design occasions for experiences; experiences themselves are personal.</strong></p>
<blockquote><p>More accurately, what the experience designer is doing is creating conditions that invite the participant to engage with the atmosphere from a particular perspective and therein experience this range of meaning. (This is what we mean when we talk about “suspending disbelief” in the theatre or films).
</p></blockquote>
<p>hope this initiative of mine gives your experience of the day a little &#8220;plus&#8221;, whatever the context you are in <img src='http://pixeline.be/blog/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
<p><a href="http://www.uxmag.com/features/101/experiencing-and-designing-experience" target="_blank">read it all at UXMAGAZINE</a></p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2007/experiencing-experience.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Fancy Form Design Using CSS</title>
		<link>http://pixeline.be/blog/2007/fancy-form-design-using-css.html</link>
		<comments>http://pixeline.be/blog/2007/fancy-form-design-using-css.html#comments</comments>
		<pubDate>Fri, 01 Jun 2007 15:28:42 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[Interfaces]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/2007/fancy-form-design-using-css/</guid>
		<description><![CDATA[The ultimate and state-of-the-art theory about web form design. accessible, pretty, unobtrusive, ergonomic. I&#8217;m impressed !
Read it all at sitepoint: Fancy Form Design Using CSS [CSS Tutorials]
]]></description>
			<content:encoded><![CDATA[<p>The ultimate and state-of-the-art theory about web form design. accessible, pretty, unobtrusive, ergonomic. I&#8217;m impressed !<br />
Read it all at sitepoint: <a href="http://www.sitepoint.com/article/fancy-form-design-css">Fancy Form Design Using CSS [CSS Tutorials]</a></p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2007/fancy-form-design-using-css.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Timeline</title>
		<link>http://pixeline.be/blog/2007/timeline.html</link>
		<comments>http://pixeline.be/blog/2007/timeline.html#comments</comments>
		<pubDate>Mon, 21 May 2007 17:50:37 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Interfaces]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/2007/timeline/</guid>
		<description><![CDATA[SIMILE &#124; Timeline
Timeline is a DHTML-based AJAXy widget for visualizing time-based events. It is like Google Maps for time-based information. Below is a live example that you can play with. Pan the timeline by dragging it horizontally.
Impressive what you can do with javascript these days!
]]></description>
			<content:encoded><![CDATA[<p><a href="http://simile.mit.edu/timeline/">SIMILE | Timeline</a><br />
Timeline is a DHTML-based AJAXy widget for visualizing time-based events. It is like Google Maps for time-based information. Below is a live example that you can play with. Pan the timeline by dragging it horizontally.</p>
<p>Impressive what you can do with javascript these days!</p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2007/timeline.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Boomshine</title>
		<link>http://pixeline.be/blog/2007/boomshine.html</link>
		<comments>http://pixeline.be/blog/2007/boomshine.html#comments</comments>
		<pubDate>Sat, 19 May 2007 09:55:22 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Development]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[Interfaces]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/2007/boomshine/</guid>
		<description><![CDATA[Boomshine is a beautifully addictive, smart, simple and beautiful flash game based on chain reactions. You have to hit the minimum bobbles of sound in one click. Try it.
]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.k2xl.com/games/boomshine/">Boomshin</a>e is a beautifully addictive, smart, simple and beautiful flash game based on chain reactions. You have to hit the minimum bobbles of sound in one click. Try it.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2007/boomshine.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>pixel skull tee shirt</title>
		<link>http://pixeline.be/blog/2007/pixel-skull-tee-shirt.html</link>
		<comments>http://pixeline.be/blog/2007/pixel-skull-tee-shirt.html#comments</comments>
		<pubDate>Thu, 10 May 2007 15:29:49 +0000</pubDate>
		<dc:creator>pixeline</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[General]]></category>

		<guid isPermaLink="false">http://www.pixeline.be/blog/2007/todoist/</guid>
		<description><![CDATA[Hey!
I submitted a tee shirt  design called Pixel Jack to Threadless.com to be voted on and hopefully  printed.
If I get enough high scores the shirt will be printed and sold  from the site and I will win some prizes. Take a look at it and if you like it,  sign up [...]]]></description>
			<content:encoded><![CDATA[<p><font color="#000000" face="Georgia" size="3">Hey!</font></p>
<p><font color="#000000" face="Georgia" size="3">I submitted a tee shirt  design called Pixel Jack to Threadless.com to be voted on and hopefully  printed.</font></p>
<p><font color="#000000" face="Georgia" size="3">If I get enough high scores the shirt will be printed and sold  from the site and I will win some prizes. Take a look at it and if you like it,  sign up and give it a score.</font></p>
<p><font color="#000000" face="Georgia" size="3"><a href="http://www.threadless.com/submission/118857/Pixel_Jack" target="_top"><img src="http://www.threadless.com/subbanner/118857/banner1.png" alt="My Threadless.com Submission " border="0" height="119" width="220" /></a></font></p>
<p><font color="#000000" face="Georgia" size="3">Thanks!<br />
</font></p>
]]></content:encoded>
			<wfw:commentRss>http://pixeline.be/blog/2007/pixel-skull-tee-shirt.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
