<?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>Random Fractals&#187; 3D</title>
	<atom:link href="http://randomfractals.com/blog/flex/3d/feed/" rel="self" type="application/rss+xml" />
	<link>http://randomfractals.com/blog</link>
	<description></description>
	<lastBuildDate>Sat, 27 Mar 2010 13:57:26 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=abc</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Another hit&#8230;</title>
		<link>http://randomfractals.com/blog/2008/12/19/another-hit/</link>
		<comments>http://randomfractals.com/blog/2008/12/19/another-hit/#comments</comments>
		<pubDate>Fri, 19 Dec 2008 18:21:08 +0000</pubDate>
		<dc:creator>Taras</dc:creator>
				<category><![CDATA[Flex]]></category>
		<category><![CDATA[photos]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[Flickorama]]></category>
		<category><![CDATA[Flickr]]></category>
		<category><![CDATA[interactive]]></category>
		<category><![CDATA[mashup]]></category>
		<category><![CDATA[photoset]]></category>
		<category><![CDATA[viewer]]></category>
		<category><![CDATA[visualization]]></category>

		<guid isPermaLink="false">http://tarasnovak.com/blog/?p=299</guid>
		<description><![CDATA[Flickorama finally got approved on programmableweb.com and was selected as the Mashup of the Day today.

I only noticed it because after reading The 3D Web in 2008 by Sarah Perez on readwriteweb.com last night,  I started considering getting back to it and adding some new features to keep me busy.
Eric Miraglia posted an encouraging Flickorama [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://tarasnovak.com/blog/2008/11/03/flickorama-update/" target="_self">Flickorama</a> finally got approved on programmableweb.com and was selected as the <a href="http://www.programmableweb.com/mashup/flickorama-3d-flickr-photoset-viewer/date">Mashup of the Day</a> today.</p>
<p><a href="http://www.programmableweb.com/mashup/flickorama-3d-flickr-photoset-viewer/date" target="_blank"><img class="alignright size-full wp-image-307" title="Flickorama on ProgrammableWeb.com" src="http://tarasnovak.com/blog/wp-content/uploads/2008/12/flickoramaonprogwebsmall.jpg" alt="Flickorama on ProgrammableWeb.com" width="157" height="136" /></a></p>
<p>I only noticed it because after reading <a href="http://www.readwriteweb.com/archives/the_3d_web_in_2008.php" target="_blank">The 3D Web in 2008</a> by <a href="http://www.readwriteweb.com/about_sarah.php">Sarah Perez</a> on readwriteweb.com last night,  I started considering getting back to it and adding some new features to keep me busy.</p>
<p>Eric Miraglia posted an <a href="http://ericmiraglia.com/blog/?p=115" target="_blank">encouraging Flickorama review</a> on his Impressive Pixel blog with good suggestions on improving ergonomics of this application, making it more responsive to mouse gestures, improving large photo view and taking screen resolution into consideration when displaying the photo sets.</p>
<p>I really liked the <a href="http://joshblog.net/2008/12/04/open-source-flex-component-popupthumbnail/" target="_blank">Popup Thumbnail component</a> Josh posted recently with the <a href="http://www.huddletogether.com/projects/lightbox2/" target="_blank">Lightbox</a> popup effect. I think that will make my large photo view really pop and create a much smoother image loading effect with the added animation. That&#8217;s one area I&#8217;ve been struggling with when designing this photo viewer.</p>
<p>I&#8217;ve started <a href="http://tarasnovak.com/blog/2008/11/03/flickorama-update/#nextRev" target="_self">my own wish list</a> in my previous update on Flickorama. Also, I&#8217;ve been doing some custom Wordpress build outs lately. More on this later, but what struck me is the staggering number of Wordpress plugins available, and I&#8217;ve been itching to do a plug-in of my own to get my hands dirty in some php.</p>
<p>So, I&#8217;ll be plugging away on Flickorama over the next two weeks.  Please drop me a note with your comments and suggestions on improving user interface, interactions, adding additional data sources or parametrized widgets/plugins you&#8217;d like to see.</p>
<p>Yes, 3D browsing is finally here and I think it will become mainstream for multimedia and news browsing in 2009.  <a href="http://www.thephotostream.com/" target="_blank">The PhotoStream</a> is a good example of such a news site.</p>
<p>As Sarah notes in her 3D Web in 2008 article:</p>
<blockquote><p>Where 3D is Cool: Browsing</p>
<p>&#8230; we&#8217;ve seen some developments in the use of 3D to deliver better visual browsing experiences. <a href="http://www.readwriteweb.com/archives/go_virtual_window_shopping_at_amazon.php">Amazon launched</a> their 3D <a href="http://windowshop.com/">Winodwshop site</a> which lets you virtually browse through the company&#8217;s top products.</p>
<p><img src="http://www.readwriteweb.com/images/windowshop.jpg" alt="" /></p>
<p>We&#8217;ve also seen other web applications integrate this 3D visual browsing technology including <a href="http://www.readwriteweb.com/archives/will_managedq_be_disruptive_to.php">ManagedQ&#8217;s semantic Google-based search</a>, <a href="http://www.readwriteweb.com/archives/the_photo_stream.php">Photo Stream&#8217;s visual newsroom</a> as well as <a href="http://www.readwriteweb.com/archives/3_unique_search_engines_of_the.php">newer search engines like Viewzi and SearchMe</a>. Although none of those have hit the mainstream, they all are interesting experiments.</p>
<p>However, one of our favorite 3D browsing tools is the technology from <a href="http://cooliris.com/">Cooliris</a>, a browser plugin that lets you transform the web into an immersive 3D experience. With Cooliris, you can surf a &#8220;wall of content&#8221; from sources like <a href="http://www.google.com/">Google</a>, <a href="http://www.flickr.com/">Flickr</a>, <a href="http://www.yahoo.com/">Yahoo</a>, <a href="http://www.smugmug.com/">SmugMug</a>, and <a href="http://www.deviantart.com/">DeviantArt</a>.</p></blockquote>
<h3  class="related_post_title">Related Posts</h3><ul class="related_post"><li><a href="http://randomfractals.com/blog/2008/11/03/flickorama-update/" title="Flickorama update">Flickorama update</a></li><li><a href="http://randomfractals.com/blog/2008/10/20/flickorama-openflux-plexiglass-flickr-mashup/" title="Flickorama &#8211; OpenFlux PlexiGlass Flickr Mashup">Flickorama &#8211; OpenFlux PlexiGlass Flickr Mashup</a></li><li><a href="http://randomfractals.com/blog/2008/11/11/2008-campaign-finances-remix-mashup-of-the-day/" title="2008 Campaign Finances Remix &#8212; Mashup of the Day!">2008 Campaign Finances Remix &#8212; Mashup of the Day!</a></li><li><a href="http://randomfractals.com/blog/2009/01/19/some-cool-3d-stuff-and-degrafa-maps-coming-soon/" title="Some cool 3D stuff and Degrafa Maps coming soon">Some cool 3D stuff and Degrafa Maps coming soon</a></li><li><a href="http://randomfractals.com/blog/2009/01/15/treemap-history/" title="Treemap History">Treemap History</a></li></ul>]]></content:encoded>
			<wfw:commentRss>http://randomfractals.com/blog/2008/12/19/another-hit/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Flickorama update</title>
		<link>http://randomfractals.com/blog/2008/11/03/flickorama-update/</link>
		<comments>http://randomfractals.com/blog/2008/11/03/flickorama-update/#comments</comments>
		<pubDate>Mon, 03 Nov 2008 22:45:21 +0000</pubDate>
		<dc:creator>Taras</dc:creator>
				<category><![CDATA[3D]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[photos]]></category>
		<category><![CDATA[Flickorama]]></category>
		<category><![CDATA[Flickr]]></category>
		<category><![CDATA[mashup]]></category>
		<category><![CDATA[OpenFlux]]></category>
		<category><![CDATA[PlexiGlass]]></category>

		<guid isPermaLink="false">http://tarasnovak.com/blog/?p=190</guid>
		<description><![CDATA[I&#8217;ve spent more time on Flickorama aesthetics last week. Here is the latest screenshot:

New Features:

Slideshow thumbnail photo strip
Large Photo View
Full Screen View
Link to the photographer&#8217;s photostream
Photo highlights, transparency, borders, drop shadows and typography enhancements


Slideshow Photo Strip
The most notable change is the new slideshow control bar at the bottom of the application screen:

You&#8217;ll notice large Start [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve spent more time on <a title="Flickorama - OpenFlux PlexiGlass Flickr Mashup" href="http://tarasnovak.com/blog/2008/10/20/flickorama-openflux-plexiglass-flickr-mashup/" target="_blank">Flickorama</a> aesthetics last week. Here is the latest screenshot:</p>
<p style="text-align: center;"><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red" target="_blank"><img class="aligncenter size-full wp-image-192" title="Flickorama" src="http://tarasnovak.com/blog/wp-content/uploads/2008/11/flickorama3red.jpg" alt="" width="450" height="283" /></a></p>
<p><strong>New Features:</strong></p>
<ul>
<li>Slideshow thumbnail photo strip</li>
<li>Large Photo View</li>
<li>Full Screen View</li>
<li>Link to the photographer&#8217;s photostream</li>
<li>Photo highlights, transparency, borders, drop shadows and typography enhancements</li>
</ul>
<p><span id="more-190"></span></p>
<p><strong>Slideshow Photo Strip</strong></p>
<p>The most notable change is the new slideshow control bar at the bottom of the application screen:</p>
<p style="text-align: center;"><a href="http://tarasnovak.com/blog/wp-content/uploads/2008/11/photostrip.jpg"><img class="aligncenter size-full wp-image-196" title="Slideshow Control Bar" src="http://tarasnovak.com/blog/wp-content/uploads/2008/11/photostrip.jpg" alt="" width="450" height="44" /></a></p>
<p>You&#8217;ll notice large Start Slideshow (play) button on the left and a scrollable photo strip control with thumbnails from the currently displayed photo set. The photo strip control will display left and right scroll buttons automatically if all the thumbnails from the currently displayed photoset don&#8217;t fit on your screen. Photo strip scrolling is enabled on mouse over. You still need to click on the Next/Previous Set buttons to load photo sets.</p>
<p>The photo strip is fully synchronized with the <a title="OpenFlux Project Home" href="http://code.google.com/p/openflux/" target="_blank">OpenFlux</a> PlexiGlass list view. So, when you shuffle images in the main 3D view by dragging images around, you&#8217;ll notice they are shuffled in the photo strip as well.</p>
<p>I also added photo highlighting and tooltips that display photo title and clearly indicate the selected photo in PlexiGlass list view and photo strip. In addition, the slideshow control bar, buttons and image boxes now have a refined treatment of borders, transparency, caption display with text truncation, drop shadows and glow filters.</p>
<p><strong>Large Photo View</strong></p>
<p>I am still not completely satisfied with the Large Photo view, but the latest version has some new features that make it more flexible and usable for the slideshow and different 3D photo set layouts. Here is the snapshot of the Large Photo View canvas:</p>
<p style="text-align: center;"><a href="http://tarasnovak.com/blog/wp-content/uploads/2008/11/preview.jpg"><img class="aligncenter size-full wp-image-198" title="Photo View" src="http://tarasnovak.com/blog/wp-content/uploads/2008/11/preview.jpg" alt="" width="450" height="425" /></a></p>
<p>When you click on the selected photo or double click on the photo thumbnail, the Large Photo view is displayed. This photo view canvas is draggable and you can reposition it in the main view to place it in the most convenient location. You can also toggle between medium (500&#215;500) and large (750&#215;750) photo view by double-clicking on the Large Photo image.</p>
<p>The caption box in the Large Photo view displays photo title, date taken, and has a link to the photographer&#8217;s photostream. The photostream link opens new browser window and links directly to the flickr photostream page for now. I plan to extend this feature to load the original photographer&#8217;s photostream in <a title="Red Flickorama" href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red" target="_blank">Flickorama</a> in the future.</p>
<p><strong>Full Screen View</strong></p>
<p>The top application control bar has two new buttons: Large Photo on the left and Full Screen View button on the right:</p>
<p><a href="http://tarasnovak.com/blog/wp-content/uploads/2008/11/layoutcontrols.jpg"><img class="aligncenter size-full wp-image-201" title="Layout Controls" src="http://tarasnovak.com/blog/wp-content/uploads/2008/11/layoutcontrols.jpg" alt="" width="405" height="91" /></a></p>
<p>The Large Photo button opens the Large Photo View and Full Screen button allows to break out of the browser window and view <a title="Red Flickorama" href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red" target="_blank">Flickorama</a> full screen.</p>
<p>The toggle buttons in the middle are for switching between the different 3D Photoset Layouts. The currently supported layouts are:</p>
<ul>
<li><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red&amp;layout=horizontalFlow" target="_blank">Cover Flow</a></li>
<li><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red&amp;layout=verticalFlow" target="_blank">Vertical Cover Flow</a></li>
<li><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red&amp;layout=carousel" target="_blank">Carousel</a></li>
<li><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red&amp;layout=flow" target="_blank">Grid</a></li>
<li><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red&amp;layout=spiral" target="_blank">Spiral</a></li>
<li><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red&amp;layout=rollerCoaster" target="_blank">Roller Coaster</a></li>
<li><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#text=red&amp;layout=timeMachine" target="_blank">Time Machine</a></li>
</ul>
<p>I am considering adding Book, Sphere and Collage photo set layouts eventually.</p>
<p><strong>Under the Covers</strong></p>
<p>Quite a few changes, bug fixes and enhancements were added behind the scene. Images are now pulled directly from flickr without an extra pass through the image proxy on my server. I also switched to using <a href="http://www.quietlyscheming.com/blog/2007/01/23/some-thoughts-on-doubt-on-flex-as-the-best-option-orhow-i-made-my-flex-images-stop-dancing/" target="_blank">Ely&#8217;s Super Image</a> for image loading and caching.  Image caching and direct loading from flickr gave flickorama a noticeable performance boost.</p>
<p>I still need to play a little with image caching settings and profile the whole application. It performs well for a casual user, but you might encounter problems if you go through over a thousand of photos.</p>
<p><a id="nextRev"></a><br />
<strong>What&#8217;s next?</strong></p>
<p>I am planning to add Advanced Search options and Tag Cloud, generated from the currently displayed photo set, to provide extra search and explore options.</p>
<p>Other ideas:</p>
<ul>
<li>Going AIR :)</li>
<li>Multi-tab Flickorama</li>
<li>Save your favorite pics and searches</li>
<li>Geo-search</li>
</ul>
<h3  class="related_post_title">Related Posts</h3><ul class="related_post"><li><a href="http://randomfractals.com/blog/2008/10/20/flickorama-openflux-plexiglass-flickr-mashup/" title="Flickorama &#8211; OpenFlux PlexiGlass Flickr Mashup">Flickorama &#8211; OpenFlux PlexiGlass Flickr Mashup</a></li><li><a href="http://randomfractals.com/blog/2008/12/19/another-hit/" title="Another hit&#8230;">Another hit&#8230;</a></li><li><a href="http://randomfractals.com/blog/2009/01/19/some-cool-3d-stuff-and-degrafa-maps-coming-soon/" title="Some cool 3D stuff and Degrafa Maps coming soon">Some cool 3D stuff and Degrafa Maps coming soon</a></li><li><a href="http://randomfractals.com/blog/2008/11/11/2008-campaign-finances-remix-mashup-of-the-day/" title="2008 Campaign Finances Remix &#8212; Mashup of the Day!">2008 Campaign Finances Remix &#8212; Mashup of the Day!</a></li></ul>]]></content:encoded>
			<wfw:commentRss>http://randomfractals.com/blog/2008/11/03/flickorama-update/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Flickorama &#8211; OpenFlux PlexiGlass Flickr Mashup</title>
		<link>http://randomfractals.com/blog/2008/10/20/flickorama-openflux-plexiglass-flickr-mashup/</link>
		<comments>http://randomfractals.com/blog/2008/10/20/flickorama-openflux-plexiglass-flickr-mashup/#comments</comments>
		<pubDate>Tue, 21 Oct 2008 04:58:16 +0000</pubDate>
		<dc:creator>Taras</dc:creator>
				<category><![CDATA[3D]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[photos]]></category>
		<category><![CDATA[Flickorama]]></category>
		<category><![CDATA[Flickr]]></category>
		<category><![CDATA[mashup]]></category>
		<category><![CDATA[OpenFlux]]></category>
		<category><![CDATA[PlexiGlass]]></category>

		<guid isPermaLink="false">http://tarasnovak.com/blog/?p=141</guid>
		<description><![CDATA[Quick Flickr mashup using OpenFlux 3D PlexiGlass to browse fractal pictures. Actually, you can search for any pics with this app :)
Here is the Flickorama with sample layouts:
Cover Flow:

Roller Coaster:

Time Machine:

There are more layouts available and a larger photo preview feature that is currently in beta.
With Flickorama you can search public Flickr photos by tags, [...]]]></description>
			<content:encoded><![CDATA[<p>Quick Flickr mashup using <a href="http://www.bobjim.com/2008/04/04/updated-plexiglass-openflux-3d-example/" target="_blank">OpenFlux 3D PlexiGlass</a> to browse fractal pictures. Actually, you can search for any pics with this app :)</p>
<p>Here is the <a href="http://www.randomfractals.com/Flickorama/Flickorama.html" target="_blank">Flickorama</a> with sample layouts:</p>
<p>Cover Flow:</p>
<p style="text-align: center;"><a href="http://www.randomfractals.com/Flickorama/Flickorama.html" target="_blank"><img class="aligncenter size-full wp-image-153" title="Flickorama Cover Flow" src="http://tarasnovak.com/blog/wp-content/uploads/2008/10/flickoramacoverflow.jpg" alt="" width="450" height="238" /></a></p>
<p>Roller Coaster:</p>
<p style="text-align: center;"><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#layout=rollerCoaster" target="_blank"><img class="aligncenter size-full wp-image-155" title="Flickorama Roller Coaster View" src="http://tarasnovak.com/blog/wp-content/uploads/2008/10/flickoramarollercoaster1.jpg" alt="" width="450" height="239" /></a></p>
<p>Time Machine:</p>
<p style="text-align: center;"><a href="http://www.randomfractals.com/Flickorama/Flickorama.html#layout=timeMachine" target="_blank"><img class="aligncenter size-full wp-image-150" title="Flickorama Time Machine layout" src="http://tarasnovak.com/blog/wp-content/uploads/2008/10/flickoramatimemachine.jpg" alt="" width="450" height="245" /></a></p>
<p>There are more layouts available and a larger photo preview feature that is currently in beta.</p>
<p>With <a href="http://www.randomfractals.com/Flickorama/Flickorama.html" target="_blank">Flickorama</a> you can search public Flickr photos by tags, paginate through the returned photo sets, or sit back and let the sequential or random photo slideshow flickr on your screen.</p>
<p>I&#8217;ve been sitting on this prototype since Ryan Campbell put together that <a href="http://www.bobjim.com/2008/04/04/updated-plexiglass-openflux-3d-example/" target="_blank">OpenFlux 3D PlexiGlass cards example</a>. When I first saw it, I knew that&#8217;s the UI to use for some fun Flickr pics browsing.</p>
<p>First, I wired it to Flickr to demo some alternative image gallery display options to one of my clients. I ended up using <a href="http://www.quietlyscheming.com/blog/components/tutorial-displayshelf-component/" target="_blank">Ely Greenfield&#8217;s Display Shelf component</a> for that project.</p>
<p>However, I was so far along into wiring OpenFlux PlexiGlass to Flickr that I have decided to spend some extra time to add photo set pagination and cleanup the UI a bit.</p>
<p>You can access it on my new site: <a href="http://www.randomfractals.com/Flickorama/Flickorama.html" target="_blank">http://www.randomfractals.com/Flickorama/Flickorama.html</a></p>
<p>I&#8217;ll be hosting my most interesting prototypes and demos on that site from now on.</p>
<p>I should also give credits to Juan Sanchez for the <a href="http://www.scalenine.com/gallery/gallery-2.php" target="_blank">shadow Flex UI theme</a> I&#8217;ve used for this application and Brian Kent for the really cool <a href="http://www.aenigmafonts.com/fonts/fontss.html" target="_blank">AEnigma</a> Scrawl font he created. I&#8217;ve seen it used in quite a few Flex apps lately.</p>
<h3  class="related_post_title">Related Posts</h3><ul class="related_post"><li><a href="http://randomfractals.com/blog/2008/11/03/flickorama-update/" title="Flickorama update">Flickorama update</a></li><li><a href="http://randomfractals.com/blog/2008/12/19/another-hit/" title="Another hit&#8230;">Another hit&#8230;</a></li><li><a href="http://randomfractals.com/blog/2009/01/19/some-cool-3d-stuff-and-degrafa-maps-coming-soon/" title="Some cool 3D stuff and Degrafa Maps coming soon">Some cool 3D stuff and Degrafa Maps coming soon</a></li><li><a href="http://randomfractals.com/blog/2008/11/11/2008-campaign-finances-remix-mashup-of-the-day/" title="2008 Campaign Finances Remix &#8212; Mashup of the Day!">2008 Campaign Finances Remix &#8212; Mashup of the Day!</a></li></ul>]]></content:encoded>
			<wfw:commentRss>http://randomfractals.com/blog/2008/10/20/flickorama-openflux-plexiglass-flickr-mashup/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>
