Adam Kinney posts tagged with 'visualization'

WPF Effects and Transitions Library Applied

Adam Kinney — Thu, 09 Oct 2008 22:35:00 GMT

WPF Effects Interview (8:46)
WPF Effects Interview - Essential (5:35)

WPF Effects Demo (5:35)
WPF Effects Demo - Just Effects (3:36)
WPF Effects Demo - Just Transitions (2:32)

Last week we posted the WPF Effects Library on Codeplex along with an David Teitlebaum interview and a demo video showing the library in action.

The library includes 23 Effects using the new PixelShader class ShaderEffect available in WPF 3.5 SP1. Effects range from BandedSwirl, ZoomBlur, InvertColor and my favorite to say, GrowablePoissonDisk.

I have a few Effects screenshots on Flickr, if you'd like to see them. Greg Schechter has a great blog post talking about Effects in WPF.

The library also includes 33 Transitions in addition to the Effects. Transitions range from familiar concepts like BandedSwirl, Pixelate and Slide to more exotic types like Crumble, MostBright and Water.

All of the Transitions are based on the abstract TransitionEffect class, which builds on the framework ShaderEffect class adding the concept of two inputs and a progress animation. This now allows you to use an Effect in a very applicable way. The Effect is not only applied to an element but you can use the Effect as a way to animate between two elements. And the animation itself is handled by a WPF Storyboard demonstrating the tight integration between the WPF Framework and Pixel Shaders. The more you dig into this architecture the more you find out how much work has been done by the WPF team to make using Shaders simple.

Using the WPF Effects Library

In order to start using the WPF Effects Library for your WPF Applications, there are a few simple steps involved listed below:

Ensure you have VS2008 and .NET Framework 3.5 SP1 installed
Install the Shader Effects BuildTask and Templates available on Codeplex. Grab the .ZIP file and follow the steps in the readme.txt
Download the WPF Effects Library and open the ShaderDemoApp.
You will see "custombuild" warnings when opening the projects. This is due to the Shader Effects Build Task being hooked up. No worries here, click Load Normally.
Now try to run the ShaderDemoApp and if it looks like it did in the demo video, you're all set.

Now that you're up and running you can start using the Effects. One thing about the ShaderDemoApp that comes with the library is that its great to demo with, but as a starter application it can be a little complex.

Let's walkthrough a very simple application called TransitioningImages that makes use of a TransitionEffect to navigate images in a folder.

This is a very simple application where all of the action happens within the Window1 class.

Choose a Folder - After the user selects a folder using the OpenFileDialog, the code retrieves all of the .jpg images from the folder and instantiates a new collection of BitmapSources for the custom PhotoSlideShow class. The initial image is then loaded into an Image element.
Navigating the Images - Hitting the Next or Previous buttons then cycle through the PhotoSlideShow image collection and cue a Transition to move from one image to the next.
Transition Applied - A new Transition Effect is instantiated (the default is a RadialWiggle (pictured above)) along with a DoubleAnimation that animates the Progress of the Transition until completion.

One of the very cool things to point out here is that we are Transitioning between images which is an obvious choice. But as the ShaderDemoApp shows the multiple inputs for the Transition are Brushes and in WPF we have an array of Brushes to choose from. One of those Brushes is the VisualBrush which allows you to take any Visual element including Buttons, MediaElements and the like allowing you to create some really interesting applications using these Effects.

Below is a link to the source code for the TransitioningImages application. The executable will run with WPF 3.5 SP1 installed, but in order to modify and build the application you'll need to follow the installation steps above.

If you use the Effects Library in your own application, let us know. We'd love to hear about how well they worked for you and see what kind of applications you've come up with.

Yosemite Deep Zoom project from xRez is now live

Adam Kinney — Thu, 17 Jul 2008 19:17:00 GMT

Last week the xRez Yosemite project on Surface was revealed and now this week the Silverlight Deep Zoom version is live.

I've added a few screenshots below to give an idea of the of the experience, but of course, it doesn't even come to close to trying the xRez site yourself.

Deep Zoom has caught on rather quickly as one of the hottest features of Silverlight (Deep Zoom Sites examples), but this is one of the first sites I've seen with so many pixels to share. 45 gigapixels of Yosemite Park are available on the site. Truly awesome stuff. I can't wait to see more projects like this.

Great job xRez and Live Labs!

HPC Data Visualizations

Adam Kinney — Wed, 18 Jun 2008 21:20:00 GMT

United States Map

Tornado

Stars

When I'm thinking of a UI or visualization design, its very cool to think of the possibilities when moving from Silverlight to WPF as your platform. Hardware acceleration, real 3D objects which are fully interactive, DirectX Integration, Custom Effects can really help bring some of the most ambitious designs alive. After watching a recent HPC case study video though, the features mentioned above seem like just the beginning.

I only understand HPC at high-level, but after seeing the work they can do, its amazing to think that each of the data points visualized are actual and not some random number generated to make an interesting effect. At this point, I know HPC is only used at an industry application level, but just imagine once this type of power becomes more accessible. I'm thinking a 3D map of the Internet or something.

Form more information on HPC check out the Windows HPC site. The have an interesting set of case studies which show how this power is being put to use today.

Silverlight game/visualization by Telerik

Adam Kinney — Thu, 06 Sep 2007 17:55:00 GMT

Telerik has released a game where you get to "add your weight to help the new Q2 release come up". You sign in with your Telerik account, choose your weight and jump on the lift.

My interpretation is that the game aspect comes in where you can reach out and try and get more people on the lift. Also, I'm hoping to see some surprises come up the rope as we get closer to 0 on the "more pounds to lift" scale.

So you could stretch and call this a MMO, because their are multiple players and it could scale to massive proportions (Sampy would kill me for saying that).

This does come off as an interesting visualization as well. How many people are looking forward to the next release so much that they jumped on the lift to show their support. Plus there is a sense of community as you can rollover each little character and see the name and location of who is represented.

I'm looking forward to seeing more visualizations like this. Perhaps Telerik will release a "Wrokers on the Lift" chart control to add to the Silverlight control suite :)

Thanks to Valentin for sharing the photo in the Silverlight FB Group.