Archive for the ‘zoom design’ Category

h1

An Infinite Canvas by Any Other Name

October 28, 2009

Back when Ian created Infinite Canvas, he did so because the technology that he wanted to use simply didn’t exist.  It was a combination of not being able to find the right tool to create an infinite-canvas-style comic and the desire to apply Seadragon’s philosophy to an interesting, albeit niche, space.

Artist Donato Sansone came across the same problem when he tried to create an infinite canvasy, flip-animation… thing.  His response was to create a flip-book of truly epic (or room-sized) proportions and video himself making the magic happen.  I’ve been told that this video contains some disturbing artwork, but the first time I watched it, I hardly noticed over the sound of how awesome it was.

 

Kevin Hanes

Advertisements
h1

Seadragon Philosophy: The User Never Waits

October 18, 2009

As you are probably aware,  Seadragon’s schtick is zooming technology and user interface experiments.  We have also done some work in creating design patterns to help with best practices and interaction.  Here in the office we also talk a lot about how to apply a third idea to our projects: a Seadragon philosophy.   In fact, our technologies (Silverlight Deep Zoom, Seadragon Mobile, Seadragon Ajax, etc) can all be seen as manifestations of our philosophy; our vision brought to reality through design and technology.   In this vein I thought I’d post about this technological coda, instead of code, in a series of posts from time to time.

One of the core tenets of our philosophy is that the user should never have to wait for the technology.  Though a simple idea, take a moment to think about all of the times you’ve wanted to do something on a computer and been unable until it finished whatever task it was working on.  Moving email, loading a document or image, starting a program, a piece of software locking up; all of these things cause you to wait.  In Seadragon, we try to make every experience wait-free.

One way to think about the user never waiting is that the UI thread is never blocked. Even in the middle of a lengthy process, we’re still accepting and responsive to user input. This is expressed in Seadragon by allowing you to zoom and pan constantly, even when we haven’t loaded all of the imagery for the current view. In addition, we try to give you something to work with as soon as possible, so even while we’re waiting for the high-res data, we load a little low-res data to show in the meantime.  You always have something to look at and you always have control.

Kevin Hanes

h1

Hello Monday

September 28, 2009

It is not often that a portfolio site stands out to me, there is usually a lot of  “been-there-seen-that” evident.  It is rarer still that an outstanding portfolio is also in some way related to the Seadragon universe, even tangentially.  In the case of the site Hello Monday, we’ve got a whole lotta “awesome” at work.

Hello Monday

The entire portfolio is laid out on an infinite, scrolling, vertical, canvas that you can navigate with click and drag, or the mouse wheel.  As you mouse over individual items, they lose their sepia tones and acquire full color for emphasis, letting you interact with them more fully.  A single click to one of the portfolio items will zoom you in for larger imagery and greater detail into the nature of the project.  Another click will send you back out to the full portfolio.

There are a lot of nice touches to this site, from the springs on scrolling, to the smooth transitions between zoom states and the sepia toning.  My favorite bit has to be the intro screen that’s been designed to give visitors to the site an idea of how to putter around the site using click and drag.  It’s a simple thing, but an important one to help get users in the right mindset.  Oh, and the random whale hanging out on top is pretty fun.  Check it out.

Kevin Hanes

h1

Infinite Photograph

August 18, 2009

Photo mosaics are nothing new, even though they are super cool and great fodder for zooming. Infinite photo mosaics, however, are even better.

infinitePhoto
The Infinite Photograph project by National Geographic starts out as a lovely landscape photograph which allows the user to zoom in on a square area of the photo, transforming that grid neatly into a photo mosaic comprised of pictures submitted to My Shot. Zoom in more to get an idea of what you’re looking at, then select a photo from the grid and start the process all over again. Very slick! (And they’ve even got one especially for pictures of dogs.)

There are limitations, of course: though it feels like it probably is “infinite” in that you can keep clicking into level after level of mosaic, some areas tend to repeat the same few photos over and over to achieve the right color. Once the My Shot photograph database has more to choose from, this will be less of an issue. Additionally, it feels clunky to click inside such a structurally rigid grid in order to zoom — but maybe I’m just spoiled by that buttery-smooth Seadragon zooming experience. (Is that too self-serving?)

Kate Welch

h1

Spezify

August 10, 2009

One thing I generally like about developing internet technology is the idea of “everything, all the time”. Sometimes this can be a muddy concept that gets in the way of effective communication, but when done well, it can save the user precious visual time they might otherwise spend looking in several places for similar sets of information.

Spezify
Spezify is a Flash-powered service that allows users to search for terms and retrieve results as a visual canvas of assorted media. Photos, videos, articles, and Twitter updates relevant to the search query populate the screen, pannable in all directions. It also retrieves a list of words relevant to your search, so you can easily browse different results (by clicking the word) or additional, more specific results (by clicking the pink “+” next to the word). One-click search refinement sounds pretty great; I like the idea of being able to maximize my laziness and yet still dive deeper and find new content. One down side: you can’t zoom, which is usually our first instinct. 😉 Still, this does give what is surely a milder version of the Clockwork Orange information overload experience, without any of the nasty brainwashing side effects.

Kate Welch

h1

Cool things in Seadragon: AppleTree

August 4, 2009

Scott Mueller is developing a site, AppleTree, with a hefty premise: map out the family tree of the whole world. That’s a lot of data, so he’s chosen to display it with Seadragon. You can zoom and pan around the whole tree, and click on various elements for further interaction.

appletree

In addition, for any one person you can have a number of photos. He is using Seadragon there as well to display the images, and has built a gallery interface around it.

From a technical standpoint, he is using Seadragon Ajax on the front end with lots of custom touches. On the back end, he periodically rebuilds all the tiles that make up the tree, building slight variations into each tile level, so that for instance, underlines show up only when you’re zoomed in enough to click on a name.

Rather than load all of the (potentially millions of) click targets at once, it sends a query back to the server for every click to see if anything interesting was hit; if so the frontend takes the appropriate action. You can click the underlined name in a node to go to that person’s page on the site. Clicking a diamond of a node brings you to that person’s other spouse. If the diamond has a number in it indicating multiple spouses, a dialog box will pop up asking you which spouse you want to zoom to. Finally clicking an egg brings you to that person’s parents if they aren’t already underneath them.

There are certainly some rough edges here and there, but it’s great to see Seadragon Ajax getting pushed in new directions like this!

Ian Gilman

h1

Zoom Quilt

July 13, 2009

One of the coolest applications of zooming technology (from an aesthetic standpoint) is the Zoom Quilt projects. Artists work collaboratively to create hugely detailed scenes with a focused center point into which the next artist’s piece zooms, and the next, and so forth, revealing an seamless thread of intricate worlds within worlds.

Zoom Quilt 2
The creativity here is tremendously impressive and demonstrates the power of zooming as a community endeavor. The first Zoom Quilt was done five years ago — pioneers!

Zoom Quilt 1 (2004)

Zoom Quilt 2 (2007)

Kate Welch