Zooming Design Patterns
Zooming Design Patterns

There are a lot of zooming applications and sites out there now, each with slightly different UI, but some clear patterns are starting to emerge.  I propose this as a place for us to start getting these patterns together to serve as guidelines for future apps.  For those unfamiliar with design patterns, Yahoo has a great collection of them.  


Scrollwheel Zoom

 

Zoom to Point

 

UI Slider


UI Button

 

UI Viewport Resize on Master View

 

Pinch/Unpinch Gesture

 

Panning Navigation

 

There are a lot of zooming applications and sites out there now, each with slightly different UI, but some clear patterns are starting to emerge.  I propose this as a place for us to start getting these patterns together to serve as guidelines for future apps.  For those unfamiliar with design patterns, Yahoo has a great collection of them.  


Scrollwheel Zoom

 

Zoom to Point

 

UI Slider


UI Button

 

UI Viewport Resize on Master View

 

Pinch/Unpinch Gesture

 

Panning Navigation

 


Discussion


Vladimir Tsvetkov 8 months ago
Wouldn't it be nice if every pattern follows a pattern template - template with predefined sections? Every pattern can have it's own wiki page.

I'll find it useful if I can see the following sections in such a template - each section gives an answer to question or questions:

- Pattern Name: What's name of the pattern
- Intent: What's the intended purpose for the pattern?
- Rationale: What's the rationale behind the pattern?Why is the pattern designed in such way?
- Variants: How the pattern can variate to achieve different interactions, to meet different requirements, and avoid unwanted side effects?
- Known uses: Where we can observe the pattern in a real world working sample?

I can't think of other sections right know...

What do you think about such an approach?
Ian Gilman 8 months ago
Vladimir, yes, sounds like a good idea. I'll work on that (and probably move the individual patterns to their own pages) when I get the chance, but feel free to go ahead and do it yourself if you get a chance!
Kevin Hanes 7 months ago
Working on it...
freddy 3 months ago
Hi there

I am doing research about patterns and zui within my phd thesis. I would like to discuss my results here. I came to a different picture about zui interaction techniques. In the literature there are many different techniques explained and I tried to include the main techniques. Here is a graphical sketch overview over my ideas. http://hci.uni-konstanz.de/gundelsw/zuiinteractiontechniques.png
I would appreciate feedback and critical questions about these zui interaction techniques and their relations. In a few days I will give some examples for a better understanding of the issues.