Archive for the ‘photos’ Category

Some cool 3D stuff and Degrafa Maps coming soon

I am going to put my multimedia experiments and updates to media players and flickr mashups on hold to repackage and publish some really cool 3D stuff and interactive maps I’ve done with OpenFlux, Away3d Tweener, and Degrafa.


Flickorama 3D Update and Camera Work

Inspired by the PlexiGlass (OpenFlux 3D) example that opened easy to use Element Flow-like capabilities to Flex applications, I created Flickorama mashup last year to explore public photos from Flickr.

You can read about it in my outdated by now Flickorama update post or see an independent Flickorama review by Eric Miraglia on his Impressive Pixel blog.

A lot has changed in Flickorama since then. The added camera work with pan, tilt and zoom features provided by the tucked in Away3D engine, along with the added keyboard navigation make it a breeze now to flip through a stack of photos. I also added new Random view layout option and integrated my Flickr Flipbook, but that deserves a separate post.

Random3DView Demo and List3D

The only reason I am rambling about those updates because while digging through openflux plexiglass trunk code I’ve tried different layouts and cameras, ended up adding a couple of my own and making some tweaks to existing cameras and layouts for improved interaction and user experience.random3dviewthumb

Now, I have not seen any updates to the openflux library recently, and I am not sure about openflux roadmap or future development work, although I really like the separation of model, view, layout and 3D perspective that this library provides.

However, if you have an application that requires similar 3D list view display, I created a Random3DView demo that demonstrates the setup behind Flickorama 3D photo viewer. You can view Random3DView source code and the resulting camera and layout work in the updated Flickorama 3D mashup.

While working on Random3DView I realized that there must be many applications that could benefit from a simple List3D view component that taps into Away3d capabilities with OpenFlux Plexiglass or some other MVC framework overlayed, yet hidden and nicely encapsulated for simple List 3D data binding and rendering.

So, I’ve decided to do some refactoring on my Random3DView code and see if I can create a reusable List3D component that will make it very easy for anyone to put together a Flex application like Flickorama, backed by the powerful Away3D engine with some Tweener animation and different layouts, in minutes. Stay tuned for updates.

Degrafa Maps and Globe


Some Degrafa world maps in various projections and mapping to 3D globe with Flex 3D are coming in the next few weeks too.

You can see some early demos of my Degrafa maps here. Some nights and weekends were spent on converting blank SVG maps of the world to make those interactive maps with selectable regions and countries in Flex. I am currently rethinking how those maps are configured and loaded.

You can see a production version of my Degrafa mapping technology used in a Beer Hunter application on

Degrafa Globe alpha

This Flex 3D Earth demo and my poking in Away3D lately gave me some ideas on creating a rotating Degrafa Globe that I am planning to enable and get it to work with my degrafa map, zoom in, tooltips and all the 3d camera rotation and tilt effects.

So, check back for some demos and new open source List3D and Map3D components soon.

Flick Flip Book Light

Some folks complained that my default UI skin is too dark, it is hard to read photo descriptions in Flickr Flip Book, and the whole charcoal look and feel used in most Adobe Flex and AIR apps is wearing off.

So, I added new silvery Light UI skin to this app with an option to switch between the default and light skin:


And here is the screenshot of Flickr Flip Book Light:


It’s a little plain, but easy on the eyes. Maybe I’ll add some album page background pattern options in v.2 to make it stand out and more colorful.

In the meantime, I am planning to do a short how-to with some sample code next, to show how easy it is to add support for multiple UI skins to Flex apps with a well-designed UI and cleanly separated view/layout code and styles.

Flickr Flip Book

Flickr Flip Book is my new Flickr mashup to browse Flickr photo stream and view large photos with all the extra info, Photo Album style!


Flickr Flip Book Features:

- Flickr Tag Search prompt

- Flip Book animation with Photo Album pages displaying photos and extra photo informaion

- Detailed Photo Information: description, tags, author, number of views, date posted, comments

- Photo strip to navigate through the album photos and skip pages

- Tag clouds to view photo tags and perform a quick search of similar images

- Keyboard navigation to flip through photos and zoom in for a larger photo view

- Search by content or media type with some sort options: relevance, interestingness, date posted/taken

- Sequential and random slideshow playback

- Full screen view

Read the rest of this entry »

Another hit…

Flickorama finally got approved on and was selected as the Mashup of the Day today.

Flickorama on

I only noticed it because after reading The 3D Web in 2008 by Sarah Perez on last night,  I started considering getting back to it and adding some new features to keep me busy.

Eric Miraglia posted an encouraging Flickorama review 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.

I really liked the Popup Thumbnail component Josh posted recently with the Lightbox 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’s one area I’ve been struggling with when designing this photo viewer.

I’ve started my own wish list in my previous update on Flickorama. Also, I’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’ve been itching to do a plug-in of my own to get my hands dirty in some php.

So, I’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’d like to see.

Yes, 3D browsing is finally here and I think it will become mainstream for multimedia and news browsing in 2009.  The PhotoStream is a good example of such a news site.

As Sarah notes in her 3D Web in 2008 article:

Where 3D is Cool: Browsing

… we’ve seen some developments in the use of 3D to deliver better visual browsing experiences. Amazon launched their 3D Winodwshop site which lets you virtually browse through the company’s top products.

We’ve also seen other web applications integrate this 3D visual browsing technology including ManagedQ’s semantic Google-based search, Photo Stream’s visual newsroom as well as newer search engines like Viewzi and SearchMe. Although none of those have hit the mainstream, they all are interesting experiments.

However, one of our favorite 3D browsing tools is the technology from Cooliris, a browser plugin that lets you transform the web into an immersive 3D experience. With Cooliris, you can surf a “wall of content” from sources like Google, Flickr, Yahoo, SmugMug, and DeviantArt.

Flickorama update

I’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’s photostream
  • Photo highlights, transparency, borders, drop shadows and typography enhancements

Read the rest of this entry »