Shine Draw

Finally, I have completed the 3D Image Rotator using Kit3D. If you are looking for a quick way to make a real 3D flipping rotator, this must be your choice.

Well, this time, I only got the Silverlight sample only. That’s because it really takes a lot of time to deal with 3D Graphics. I am sure I will launch the Flash demo very soon.

Images used in the application below are collected from Smashing Magazine - Christmas Wallpapers.

Demo

Source codes

•   3D Image Rotator [Silverlight 2, C#] (133.2 KiB, 800 hits)

Silverlight

Another new image rotator! The application used simple masking skill in creating the transition effects. You may further customize it or create new effects for your own need.

Images used in the application below are collected from Smashing Magazine - 60 Beautiful Christmas Photoshop Tutorials.

Vote for this sample

Comparison

Flash implementation: 55 minutes (Implemented First)
Silverlight implementation: 80 minutes
What’s the difference?

• Creating Animated Mask [AS3] vs [C#]

Source codes

•   Image Rotator [Flash 9, AS3] (265.7 KiB, 242 hits)
•   Image Rotator [Silverlight 2, C#] (125.9 KiB, 388 hits)

Silverlight

Creating Animated Mask [AS3] vs [C#]

In Flash, creating mask or animated is fairly simple. You may just add a mask layer and use the Shape Tween Effect. Everything can be done in a minutes!!

However, it’s another story in Silverlight. Since you have to use the Geometry object to clip an object, animating the mask is no longer a simple stuff. Firstly, Blend has a very poor support for Geometry and it’s very hard to use. Besides, the StoryBoard model in Silvelight is comparatively hard to make animations comparing to using the Shape Tween.

It has been more than a month that I didn’t post a new image transition effect. That’s because it’s hard to figure out a nice idea.

Therefore, if you have any good suggestion on Image Transition, please let me know.

The images used in the applications are created by me via the Facebook Application Pencake Ecard.

Vote for this sample

Comparison

Flash implementation: 30 minutes (Implemented First)
Silverlight implementation: 30 minutes

Source codes

•   Image Transition Effect [Flash 9, AS3] (181.4 KiB, 475 hits)
•   Image Transition Effect [Silverlight 2, C#] (105.2 KiB, 568 hits)

Silverlight

This sample is requested by unruledboy couple weeks ago. He asked if I could implement a application similar to the Flickr mini image gallery. Although the logic is very simple, it provides a very nice and comfortable effect.

Vote for this sample

Comparison

Flash implementation: 1 hour
Silverlight implementation: 1 hour 30 minutes (Implemented First)
What’s the difference?

• frame rate per second: frameRate [AS3] vs MaxFrameRate [C#]

Source codes

•   Flickr Image Gallery [Flash 9, AS3] (115.9 KiB, 508 hits)
•   Flickr Image Gallery [Silverlight 2, C#] (154.8 KiB, 646 hits)

Silverlight

frame rate per second: frameRate [AS3] vs MaxFrameRate [C#]

In a loosely compassion, Flash Animation is considered as Frame Based while Silverlight Animation is considered as Time Based. Nevertheless, it’s still possible to change the frame rate per second (fps) for both of the technology.

// AS3
// Change the Frame Rate
stage.frameRate = 24;

The default frame rate for Silverlight is 60. (I have no idea why the default value is so high.) Most of the time, you have to set it into a smaller value. Very often, I will set it to 24 fps.

// C#
// Change the Frame Rate
 App.Current.Host.Settings.MaxFrameRate = 24;

I have implemented 5 images rotators so far. I will reorganize all the code once there are 10 rotators.

If you have any rotator ideas, please let me know. It’s really a headache to generate a creative rotator effect.

Vote for this sample

Comparison

Flash implementation: 25 minutes(Implemented First)

Silverlight implementation: 20 minutes

Source codes

•   Plummet Rotator [Flash 9, AS3] (348.9 KiB, 419 hits)
•   Plummet Rotator [Silverlight 2, C#] (406.4 KiB, 560 hits)

Silverlight