<?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/"
	xmlns:georss="http://www.georss.org/georss" xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#" xmlns:media="http://search.yahoo.com/mrss/"
	>

<channel>
	<title>Dolcini &#187; Design Examples</title>
	<atom:link href="http://dolcini.wordpress.com/category/design-examples/feed/" rel="self" type="application/rss+xml" />
	<link>http://dolcini.wordpress.com</link>
	<description>Design &#38; tech advice from DOLCE DESIGN. Plus examples of great design and godawful design. Just because.</description>
	<lastBuildDate>Wed, 18 Nov 2009 17:11:30 +0000</lastBuildDate>
	<generator>http://wordpress.com/</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<cloud domain='dolcini.wordpress.com' port='80' path='/?rsscloud=notify' registerProcedure='' protocol='http-post' />
<image>
		<url>http://www.gravatar.com/blavatar/0232a03b15ab76ee4b8ca356d31d2a7f?s=96&#038;d=http://s.wordpress.com/i/buttonw-com.png</url>
		<title>Dolcini &#187; Design Examples</title>
		<link>http://dolcini.wordpress.com</link>
	</image>
			<item>
		<title>&#8220;I want a portfolio/gallery/slideshow to show off my work.&#8221;</title>
		<link>http://dolcini.wordpress.com/2009/11/16/i-want-a-portfoliogalleryslideshow-to-show-off-my-work/</link>
		<comments>http://dolcini.wordpress.com/2009/11/16/i-want-a-portfoliogalleryslideshow-to-show-off-my-work/#comments</comments>
		<pubDate>Mon, 16 Nov 2009 23:42:39 +0000</pubDate>
		<dc:creator>bdarcey</dc:creator>
				<category><![CDATA[Design Examples]]></category>
		<category><![CDATA[Design Process]]></category>
		<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[comparison]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[flash]]></category>
		<category><![CDATA[galleries]]></category>
		<category><![CDATA[gallery]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[portfolio]]></category>
		<category><![CDATA[pros and cons]]></category>
		<category><![CDATA[slideshow]]></category>

		<guid isPermaLink="false">http://dolcini.wordpress.com/?p=90</guid>
		<description><![CDATA[Comparison of Flash versus jQuery slideshow/gallery/portfolios. The Pros and Cons of a simple slider versus a gallery. In plain English.<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=dolcini.wordpress.com&blog=1844318&post=90&subd=dolcini&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p>Well kitten, there are a lotta options out there, and very few explain in plain English what they do and don&#8217;t offer, or how they might actually be of use. Plus, most of them are written for pure geeks, since that&#8217;s who generally implements them. As your translator and guide, I&#8217;m going to help you narrow it down from the point of what you need, versus what&#8217;s being sold.</p>
<p>MINIMAL<br />
If what you need is a clean, simple slideshow for a half a dozen shots (e.g. to add some ambience/fun to a page), then what you want to ask for is a &#8220;basic slideshow with automatic transitions, no captions, no controls.&#8221; Something like <a title="LightBox" href="http://leandrovieira.com/projects/jquery/lightbox/" target="_blank">this</a> or <a href="http://medienfreunde.com/lab/innerfade/" target="_blank">this</a> (scroll down) or <a href="http://demos.flesler.com/jquery/scrollShow/" target="_blank">this</a>.</p>
<p>STANDARD<br />
If what you want is a larger gallery of images, with thumbnails, captions, user-navigation controls, then what you want to ask for is &#8220;a gallery slideshow with customizable captions, transitions, and user-nav controls.&#8221; Something like <a href="http://devkick.com/lab/galleria/demo_01.htm#img/grass-blades.jpg" target="_blank">this</a>, or <a href="http://pikachoose.com/demo/" target="_blank">this</a>, or <a href="http://imageflow.finnrudolph.de/" target="_blank">this</a> (which is similar to iTunes CoverFlow). Or even a super-sized version, like <a href="http://www.buildinternet.com/project/supersized/default.php" target="_blank">this</a>.</p>
<p>DELUXE<br />
If you have multiple categories of images (e.g. photos separated into &#8220;interiors&#8221; &#8220;exteriors&#8221; &#8220;annoying in-laws&#8221;) etc then you need to add &#8220;multiple galleries&#8221; to the description. As with cars, more options = higher price. At this point, you&#8217;re probably looking at a Flash option.</p>
<p>Thumbnails: don&#8217;t settle for a row of numbers. Tiny preview versions of each image make navigation much more intuitive and efficient. This is an automatic process with most plug-ins, so the cost difference is minimal.</p>
<p>WHICH FORMAT?<br />
Most options boil down to 2 choices: Flash or jQuery. Both are fully compatible with most modern browsers. They can both be customized to match the look and feel of your brand. While some search engines do not scan the text captions in either option well, fret not, as there are legitimate workarounds. Both can be embedded in your page alongside scannable text and other navigation (i.e. your site does not have to be all Flash, and yes, you can have permalink pages with flash embedded for easier sharing and bookmarking). Both can display video. Here&#8217;s where they differ:</p>
<p>FLASH (with XML)<br />
Pros:<br />
1) More features for animation, games, or video.<br />
2) Better quality results for video using .flv format.<br />
3) Audio (sound/music options) is more developed in flash.<br />
4) Plug-in is free to download in the unlikely event that a user has an ancient browser (circa 2001).<br />
5) All images display in a uniform size = formal, consistent presentation.<br />
6) Considered more deluxe (more features) and more robust as it&#8217;s been around longer than jQuery.</p>
<p>Cons:<br />
1) Does not display on iPhones (yet).<br />
2) Old versions of flash slideshows use a client side plugin = possible slower downloads (translation: your user&#8217;s computer must do the heavy work, so mileage may vary, depending on age/speed of each user&#8217;s computer). Be sure to ask for Flash + XML/actionscript to avoid this.<br />
3) All images must be the same width/height ratio to avoid distortion. Yes, the images can be auto-processed to achieve this with mixed results. If you&#8217;re big on quality, don&#8217;t skimp on this, have the images processed manually in Photoshop.<br />
4) Can be more expensive as it requires a Flash programmer to create the initial file.</p>
<p>jQuery<br />
Pros: the current darling of developers, it has fewer features than Flash, and is therefore simpler to code. It&#8217;s perfect for basic slideshows and galleries.</p>
<p>1) Displays on iPhones and other mobile smart phones. Yay!<br />
2) Overlay effect (page dims in background, image gallery floats above it) = users less likely to leave your site or get lost. Great for large sized images.<br />
3) Images can vary in width/height = less prep time for each image = cheaper maintenance.<br />
4) Server-side includes = fast downloads (translation: all the heavy lifting is done by the website server, not your user&#8217;s computer)<br />
5) No download necessary. Ever.</p>
<p>Cons:<br />
1) Fewer features than flash.<br />
2) Images display at different height/width sizes = less formal, less cohesive visuals. While this might be a plus for some brands, if you&#8217;re aiming for a high-end market, casual is generally not advised.</p>
<p>So. Do you need a deluxe version or a basic?</p>
  <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/dolcini.wordpress.com/90/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/dolcini.wordpress.com/90/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/dolcini.wordpress.com/90/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/dolcini.wordpress.com/90/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/dolcini.wordpress.com/90/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/dolcini.wordpress.com/90/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/dolcini.wordpress.com/90/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/dolcini.wordpress.com/90/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/dolcini.wordpress.com/90/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/dolcini.wordpress.com/90/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=dolcini.wordpress.com&blog=1844318&post=90&subd=dolcini&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://dolcini.wordpress.com/2009/11/16/i-want-a-portfoliogalleryslideshow-to-show-off-my-work/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/f20550b92e5ca47e6daaacea775b8ddd?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">bdarcey</media:title>
		</media:content>
	</item>
		<item>
		<title>Art and Design in the Montreal metro</title>
		<link>http://dolcini.wordpress.com/2007/10/30/design-in-the-montreal-metro/</link>
		<comments>http://dolcini.wordpress.com/2007/10/30/design-in-the-montreal-metro/#comments</comments>
		<pubDate>Tue, 30 Oct 2007 17:00:09 +0000</pubDate>
		<dc:creator>bdarcey</dc:creator>
				<category><![CDATA[Design Examples]]></category>
		<category><![CDATA[montreal metro design art installation]]></category>

		<guid isPermaLink="false">http://dolcini.wordpress.com/2007/10/30/design-in-the-montreal-metro/</guid>
		<description><![CDATA[I bet New Yorkers can&#8217;t believe their eyes (or ears) when they first encounter the Montreal metro&#8230;
AESTHETICS
Every station is designed by a different architect, and each one is home to giant works of art, from walls of stained glass to exquisite modern tile patterns. (View a quick photo line-up of the many different interiors.) But [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=dolcini.wordpress.com&blog=1844318&post=53&subd=dolcini&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><a href="http://dolcini.files.wordpress.com/2007/10/berri_stained3.jpg" title="berri_stained3.jpg"><img src="http://dolcini.files.wordpress.com/2007/10/berri_stained3.jpg" alt="berri_stained3.jpg" align="left" /></a>I bet New Yorkers can&#8217;t believe their eyes (or ears) when they first encounter the Montreal metro&#8230;<span style="font-weight:bold;"></span></p>
<p><span style="font-weight:bold;">AESTHETICS</span><br />
Every station is designed by a different architect, and each one is home to giant works of art, from walls of stained glass to exquisite modern tile patterns. (<a href="http://mic-ro.com/metro/montreal.html">View</a> a quick photo line-up of the many different interiors.) But that&#8217;s just the beginning. The next thing you notice is the general cleanliness and lack of graffiti. There are no signs of neglect (no broken railings, no torn seating, no leaking roofs, or vermin). The temperature in the stations and on the trains is air-conditioned in summer, heated in winter. The cars look new, but in fact are 40 years old; they were refurbished in 1999. Not only are there clean trash cans, there are <span style="font-style:italic;">recycle</span> bins at every turn. A single one-way ticket is $2.50, but the public certainly gets its money&#8217;s worth, and there are substantial discounts for commuter passes.</p>
<p><span style="font-weight:bold;">SAFETY</span><br />
The absence of aggression is palpable. I&#8217;ve traveled several times via metro at 1am on a Saturday by myself and never felt concerned for my safety, either in the station or on the platform. I haven&#8217;t figured that part out yet. Maybe it&#8217;s the clear sight lines and good lighting. Maybe it&#8217;s just a general satisfaction with the high quality of life in Quebec.</p>
<p><span style="font-weight:bold;">EFFICIENCY<br />
</span>On the platforms, giant electronic LCD screens display useful information: time, weather, news updates and&#8230; the estimated time of arrival of the next train. Transportation and city maps are where you need them and&#8230; they&#8217;re current! Trains generally run on time (every 3 &#8211; 5 minutes at peak times, every 12 minutes off peak). Each train is monitored electronically to optimize performance.</p>
<p><span style="font-weight:bold;">THOUGHTFUL DESIGN<br />
</span><a href="http://dolcini.files.wordpress.com/2007/10/metro_over_ramp1.jpg" title="Beaudry train station platform"><img src="http://dolcini.files.wordpress.com/2007/10/metro_over_ramp1.thumbnail.jpg" alt="Beaudry train station platform" align="left" /></a><a href="http://dolcini.files.wordpress.com/2007/10/metro_seating.jpg" title="Metro seating"><img src="http://dolcini.files.wordpress.com/2007/10/metro_seating.thumbnail.jpg" alt="Metro seating" /></a><a href="http://dolcini.files.wordpress.com/2007/10/metro_seats.jpg" title="platform seats in use"><img src="http://dolcini.files.wordpress.com/2007/10/metro_seats.thumbnail.jpg" alt="platform seats in use" /></a>Overhead walkways allow you to see arriving and departing trains, when you&#8217;re still close enough to sprint to catch one or slow down if you see you&#8217;ve just missed a train. Platforms are intelligently designed. Lighting is focused where you need it at the edge of the platform, and dimmed in the seating area so you can relax more easily while waiting. Seating is set in to the walls. When no-one is seated, the platform is completely clear of obstruction. If the seats are occupied, only ones knees protrude, so others can see you (for safety&#8217;s sake) yet you&#8217;re not blocking the flow of traffic. Brilliant.
<p>
<a href="http://dolcini.files.wordpress.com/2007/10/beaudry_straight_on2.jpg" title="beaudry_straight_on2.jpg"><img src="http://dolcini.files.wordpress.com/2007/10/beaudry_straight_on2.thumbnail.jpg" alt="beaudry_straight_on2.jpg" style="float:left;cursor:pointer;margin:0 10px 10px 0;" /></a>Even the typography makes sense: letters are wide-kerned (spaced out) so that the station name can more easily be read from the window of a moving car.</p>
<p>And of course, the crowning glory is the French-inspired color-coded metro system, with each line logically named after its 2 end stations (none of this vague &#8220;A train&#8221; or &#8220;# 2 line&#8221;, which is utterly useless for visitors). If the sign above the platform station is orange and says &#8220;Cote-Vertu&#8221;, then you are on the orange line, headed in the direction of Cote-Vertu. So simple to use. So well-conceived.</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/dolcini.wordpress.com/53/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/dolcini.wordpress.com/53/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/dolcini.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/dolcini.wordpress.com/53/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/dolcini.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/dolcini.wordpress.com/53/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/dolcini.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/dolcini.wordpress.com/53/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/dolcini.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/dolcini.wordpress.com/53/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/dolcini.wordpress.com/53/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/dolcini.wordpress.com/53/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=dolcini.wordpress.com&blog=1844318&post=53&subd=dolcini&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://dolcini.wordpress.com/2007/10/30/design-in-the-montreal-metro/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/f20550b92e5ca47e6daaacea775b8ddd?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">bdarcey</media:title>
		</media:content>

		<media:content url="http://dolcini.files.wordpress.com/2007/10/berri_stained3.jpg" medium="image">
			<media:title type="html">berri_stained3.jpg</media:title>
		</media:content>

		<media:content url="http://dolcini.files.wordpress.com/2007/10/metro_over_ramp1.thumbnail.jpg" medium="image">
			<media:title type="html">Beaudry train station platform</media:title>
		</media:content>

		<media:content url="http://dolcini.files.wordpress.com/2007/10/metro_seating.thumbnail.jpg" medium="image">
			<media:title type="html">Metro seating</media:title>
		</media:content>

		<media:content url="http://dolcini.files.wordpress.com/2007/10/metro_seats.thumbnail.jpg" medium="image">
			<media:title type="html">platform seats in use</media:title>
		</media:content>

		<media:content url="http://dolcini.files.wordpress.com/2007/10/beaudry_straight_on2.thumbnail.jpg" medium="image">
			<media:title type="html">beaudry_straight_on2.jpg</media:title>
		</media:content>
	</item>
		<item>
		<title>Signage in Montreal</title>
		<link>http://dolcini.wordpress.com/2007/10/26/signage-in-montreal/</link>
		<comments>http://dolcini.wordpress.com/2007/10/26/signage-in-montreal/#comments</comments>
		<pubDate>Fri, 26 Oct 2007 02:24:29 +0000</pubDate>
		<dc:creator>bdarcey</dc:creator>
				<category><![CDATA[Design Examples]]></category>
		<category><![CDATA[Montreal]]></category>
		<category><![CDATA[signage]]></category>
		<category><![CDATA[street signs]]></category>

		<guid isPermaLink="false">http://dolcini.wordpress.com/2007/10/26/signage-in-montreal/</guid>
		<description><![CDATA[
Montreal has some of the most artsy storefront signs in the world. Not content with the usual 2 dimensional retail signs, they add on these massive 3-D sculptures that extend out into the street, looming over you like modern gargoyles, only much friendlier.
In the winter, they gather snow and icicles; in the summer, pigeons.
I decided [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=dolcini.wordpress.com&blog=1844318&post=41&subd=dolcini&ref=&feed=1" />]]></description>
			<content:encoded><![CDATA[<div class='snap_preview'><br /><p><a href="http://dolcini.files.wordpress.com/2007/10/kilo_sign1.jpg" title="Kilo sign"><img src="http://dolcini.files.wordpress.com/2007/10/kilo_sign1.thumbnail.jpg" alt="Kilo sign" /></a><a href="http://dolcini.files.wordpress.com/2007/10/convertible_front.jpg" title="convertible_front.jpg"><img src="http://dolcini.files.wordpress.com/2007/10/convertible_front.thumbnail.jpg" alt="convertible_front.jpg" /></a><a href="http://dolcini.files.wordpress.com/2007/10/mado_sign2.jpg" title="mado_sign2.jpg"><img src="http://dolcini.files.wordpress.com/2007/10/mado_sign2.thumbnail.jpg" alt="mado_sign2.jpg" /></a><br />
Montreal has some of the most artsy storefront signs in the world. Not content with the usual 2 dimensional retail signs, they add on these massive 3-D sculptures that extend out into the street, looming over you like modern gargoyles, only much friendlier.</p>
<p>In the winter, they gather snow and icicles; in the summer, pigeons.</p>
<p>I decided to photograph them now, before they are hidden beneath holiday decorations, as is often the case. (Click the images for full-size photos).</p>
<p>Want more? See my Flickr <a href="http://www.flickr.com/gp/14552557@N04/X9AD18">collection of Montreal signs</a>.</p>
<img alt="" border="0" src="http://feeds.wordpress.com/1.0/categories/dolcini.wordpress.com/41/" /> <img alt="" border="0" src="http://feeds.wordpress.com/1.0/tags/dolcini.wordpress.com/41/" /> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gocomments/dolcini.wordpress.com/41/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/comments/dolcini.wordpress.com/41/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godelicious/dolcini.wordpress.com/41/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/delicious/dolcini.wordpress.com/41/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/gostumble/dolcini.wordpress.com/41/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/stumble/dolcini.wordpress.com/41/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/godigg/dolcini.wordpress.com/41/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/digg/dolcini.wordpress.com/41/" /></a> <a rel="nofollow" href="http://feeds.wordpress.com/1.0/goreddit/dolcini.wordpress.com/41/"><img alt="" border="0" src="http://feeds.wordpress.com/1.0/reddit/dolcini.wordpress.com/41/" /></a> <img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=dolcini.wordpress.com&blog=1844318&post=41&subd=dolcini&ref=&feed=1" /></div>]]></content:encoded>
			<wfw:commentRss>http://dolcini.wordpress.com/2007/10/26/signage-in-montreal/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/f20550b92e5ca47e6daaacea775b8ddd?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">bdarcey</media:title>
		</media:content>

		<media:content url="http://dolcini.files.wordpress.com/2007/10/kilo_sign1.thumbnail.jpg" medium="image">
			<media:title type="html">Kilo sign</media:title>
		</media:content>

		<media:content url="http://dolcini.files.wordpress.com/2007/10/convertible_front.thumbnail.jpg" medium="image">
			<media:title type="html">convertible_front.jpg</media:title>
		</media:content>

		<media:content url="http://dolcini.files.wordpress.com/2007/10/mado_sign2.thumbnail.jpg" medium="image">
			<media:title type="html">mado_sign2.jpg</media:title>
		</media:content>
	</item>
	</channel>
</rss>