Falling Snow: Guess Which is Silverlight and Which is Flash!
December 28th, 2008 | View Comments
Every year, during the entire month of December, one of the most popular tutorials on the site are the ones that revolve around creating the falling snow effect. Below, you’ll see two more examples of the falling snow effect – one created in Flash and another one created in Silverlight.
Click on the Let It Snow text in each of the examples to have the snow fall. Without cheating by right-clicking, can you guess which one is the Flash version and which one is the Silverlight version?
Mystery Runtime #1
Mystery Runtime #2
The source files for both are provided below:
 |
Download Silverlight Source |
 |
Download Flash Source |
The source files for the Silverlight version work on Expression Blend 2 SP1 and Visual Studio 2008. Do refer to my getting started article to get setup for Silverlight development if you haven’t set anything up before.
For the Flash source files, all you need is Flash CS3 or higher. Just open the FLA and SnowFlake.as file, and you are set!
Wrapping Up
The thing I want you to notice from the source files is how similar both the Silverlight and Flash versions of this application are under the hood. The visuals are nearly identical, and much of the code, barring some syntax changes, is pretty similar as well.
Since making resolutions for the upcoming year is all the rage these days, consider making cross-pollination of Silverlight and Flash skills a goal. If you are a seasoned Silverlight designer, consider giving Flash a shot. Likewise, if you are a Flash designer, give Silverlight a shot.
You’ll find there are a lot more things that are similar than are different.
Cheers!
Kirupa 
December 30th, 2008 at 1:31 am
first one is silverlight because it’s not working at all on mac
joking, i have to install the plugin and will work, hopefuly, but for flash sais: Movie not loaded
December 30th, 2008 at 1:56 am
My apologies Cristi. I made a mistake in the embed code used. The Flash version should work now. I tested on IE, FF, and Safari on my PC.
December 30th, 2008 at 2:27 am
I saw them both now, seems smoother the silverlight one. Otherwise, they consume the same CPU, 67% here.
December 30th, 2008 at 6:15 am
Aloha,
Nice work:) You have any idea when silverlight get full gpu support ? You know a url about % of silverlight players installed ?
Sidenote: The silverlight version seems to lighter on the cpu (quad core ).
December 30th, 2008 at 11:03 am
Cristi – Glad it worked!
Flashbookmarks – according to this post here ( http://weblogs.asp.net/scottgu/archive/2008/11/16/update-on-silverlight-2-and-a-glimpse-of-silverlight-3.aspx ), 3D and GPU support is mentioned as something that will be found in Silverlight 3.
Of course, how “full” the GPU support is, I really don’t know. Unfortunately, even if I did know, I probably am not allowed to say
January 1st, 2009 at 3:58 pm
Hi there Kirupa!
Happy new year!
I’ve wanted just to ask, why do u always write method names with a uppercase letter?
U know like: “public function SetSize():void”
Don’t u know it should be written with a lower one? ^_^
January 1st, 2009 at 3:59 pm
RE:
Method names
Start them with a lowercase letter and use intercaps for subsequent words: measure(), updateDisplayList().
Method names should always be verbs.
http://opensource.adobe.com/wiki/display/flexsdk/Coding+Conventions
January 1st, 2009 at 8:51 pm
Hi J – a lot of it is just personal preference.
I tend to use the .NET Capitalization Style because more developers are familiar with .NET than AS3.
You can see the Capitalization Style here: http://msdn.microsoft.com/en-us/library/ms229043.aspx
January 2nd, 2009 at 2:35 am
Haha, I could tell which runtime was which by the antialiasing of the text on the “Let it snow!” button. Fonts in Silverlight seem a bit more crisp than they do in Flash. Hm, maybe I need to get outside more…
Looks great though! This has got to be my favorite of your snow experiments over the years
January 2nd, 2009 at 6:52 am
Nice sample, though apparently some flakes don’t fall as fast in Silverlight. There are a couple that are taking quite a long time to get to the ground.
January 2nd, 2009 at 6:55 am
Is there such a thing as a seasoned Silverlight designer yet?
January 2nd, 2009 at 5:12 pm
anroy – most Blend users who also know how to use PhotoShop, Illustrator, etc. would fit the bill.
David – I need to up the minimum vertical speed in the SL example a bit. In the meantime, I am going to imagine those snowflakes are permanently suspended in the air due to a cold gust of air being exhausted from a ventilation hole in the ground!
Brian – I think you do need to get outside more! I find the text quality in Silverlight to be really weak. I really like the fuzzy, warm anti-aliasing that you see in Flash. Then again, maybe I need to go outside as well…
January 5th, 2009 at 7:34 am
Silverlight is a little smoother for me too, but the font rendering gave it away. Flash is slightly nicer.
January 5th, 2009 at 8:42 pm
my guess was Silverlight first because it just seemed smoother. I kept my eye on a snowflake as it fell in Flash, and it seemed a little choppier than Silverlight. Almost like you could see the flake move from frame to frame… whereas in the Silverlight example, it looked gapless and smooth.
January 8th, 2009 at 9:22 am
I worship Flash but have to admit that for me, the Silverlight version was the smoother out of the two. Also there seems to be a bug in the Flash version as the flakes slowly drift (no pun intended!) to the left leaving nothing on the right hand side, and eventually drifting off the stage completely.
I am very curious to see how the Flash vs Silverlight battle will hot up…..
November 18th, 2009 at 9:41 am
Hey – thanks for this tutorial, it was just what I needed.
Quick thing – I found that after a while, the snowflakes all ended up hugging the left hand side of the screen, so I got it to re-randomise the x position of the flake in the final if block of moveFlake() where it moves it back up to the top of the movie.
Thanks for sharing.
M
November 18th, 2009 at 7:24 pm
Two questions.
1) How would I get the snow to be behind other graphics/layers. Right now it’s always on top of everything else.
2) How would I get this to start at the beginning of the movie, rather than on the button click?
November 23rd, 2009 at 10:18 pm
I would also like to know how to start the graphic/automatically and have the button start/stop at will (button).
Thanks!
November 24th, 2009 at 9:25 am
To make it start automatically I replaced the
LetItSnowButton.addEventListener(MouseEvent.CLICK, MakeItSnow);
with
this.addEventListener (Event.ENTER_FRAME, MakeItSnow);
but now I don’t know how to make it stop when it gets to a defined thickness, help I’m getting stuck in a snowdrift!!!!!
November 28th, 2009 at 6:21 pm
this is great, but i have the same problem as mudkumpf and don’t know how to fix it exactly. i’d like to have it running on the tv where i work (over our logo), and it’s doing so nicely, but if it keeps hugging the left it’ll have to be reset every 10 minutes. i’m a total novice so can someone please explain how to prevent the ‘hugging’ effect?
thanks! great job, exactly what i was looking for
November 28th, 2009 at 10:38 pm
anon – which version are you referring to, the Flash one or the Silverlight one?
November 29th, 2009 at 6:02 pm
the flash one, sorry!
November 29th, 2009 at 6:28 pm
anon – I’ll try to see what I can do this week
November 30th, 2009 at 4:25 am
Hello,
I have followed snappy steps and works but…
I have my animation in Flash CS4 how can I take the snow animation from your file and use it on my file now?I’ve tried to drag it from the library but nothing happened
Thanks
December 1st, 2009 at 1:34 pm
I’m trying to make the snow load automatically without having to click the button. Any ideas on how to change the code in Flash CS4?
Thanks!
December 1st, 2009 at 3:32 pm
OK… Sorry… Just read the comments above
Also having the issue with all the snow falling to the left after a few minutes & would love to see a solution.
Additionally, how do you make each flake randomly rotate? I changed the dot to a snowflake graphic and want some variety.
Thanks!
December 1st, 2009 at 11:11 pm
Hi everyone – I’m going to create a Flash CS4/AS3 tutorial that describes how to create this effect. I will have the snow moving to the left fixed along with information on how to make all of the customizations you all have asked for.
December 2nd, 2009 at 4:49 am
Hello!
Silverlight problem here.
My question is how to take out the falling snow frome the ready project and put it to my project in Blend 3?
Thanks for help!
December 2nd, 2009 at 3:54 pm
yahoo! thanks kirupa. looking forward to it
December 3rd, 2009 at 1:12 am
Is it just me or is the whole set of falling snow flakes slowly moving off the stage to the left in the Flash version the longer it runs? In the time I’ve spent reviewing some comments above I scrolled back up to the animations and the Flash version is half snow flakes on the left and black on the right.
Firefox 3.5.5, Flash Player 10
December 3rd, 2009 at 1:21 am
colink – no, you are right. There is a glitch caused by how I am incrementing the horizontal position.
The way to fix it is by changing the code in SnowFlake.as from:
if (this.y – this.height > maxHeight)
{
this.y = -10 – this.height;
}
To:
if (this.y – this.height > maxHeight)
{
this.y = -10 – this.height;
this.x = Math.random()*maxWidth;
}
December 3rd, 2009 at 8:04 am
Hmm? Changed the code in SnowFlake.as as you suggested and it’s still creeping off to the left for me.
December 3rd, 2009 at 9:36 am
Thanks, Kirupa, this change in the code worked for me.
Colink, did you republish your swf? Try just pasting in the “this.x = Math.random()*maxWidth;” line in the AS file and then republish.
Kirupa, any info on how to change individual random rotation of the flakes if you replace the dot with a graphic snowflake?
Thanks again!
December 3rd, 2009 at 10:29 am
Sweet!
Thought I’d done that. I was wrong. Thanks redmink. It’s working for me now. Thanks Kirupa!
P.S. Random rotation for a graphic snowflake would be nice.
Thanks again!
December 3rd, 2009 at 12:40 pm
I will add how to rotate to my tutorial. I’m about half-way done, so hopefully I’ll have it posted by the end of this weekend
December 3rd, 2009 at 5:57 pm
yess! it works perfectly now. it’s a lovely display.
thank you so much for being so helpful!
December 4th, 2009 at 10:41 am
Kirupa, my AS3 knowledge is terrible. Can you show me what to do to have it start snowing automatically without having a button?
December 4th, 2009 at 10:44 am
Disregard that. I should have search up further in the post to find the answer.
December 6th, 2009 at 11:52 pm
Hey everyone – I have a draft of the tutorial here: http://www.kirupa.com/developer/flashcs4/falling_snow_as3_cs4_pg1.htm (Change pg1.htm to pg2.htm, pg3.htm, pg4.htm, or pg5.htm if the navigation doesn’t work).
Rotation is covered on Page 5. It is just one line of code actually.
Note that this tutorial is just a draft and things may be fixed and changed between now and whenever I find time to fully complete it
Cheers!
Kirupa
September 26th, 2010 at 4:51 pm
I first used Chrome. Here is the result:
What I actually thought was: first one will be flash and second one will be silverlight. But to my surprise its just the opposite. Definitely, 1st one runs faster, smoother, 2nd one is slower with glitches.
First run the 2nd one alone. Now see that it runs smoothly without glitches. Isn’t it?
Open a new tab and run the run the first one in it. Both are fine.
But in Firefox both runs smoothly in the same page.
———–
Just noticed the small smile below this page. Hah.
November 15th, 2010 at 4:57 pm
I cannot get this to work. I want it to start snowing on my image after the image appears on the page. I want the snow to appear in frame 115 because I am creating a winter scene, but I cannot get it to work!
February 11th, 2011 at 5:49 pm
I’m happy I located this blog site, I couldnt discover any information on this subject matter prior to. I also operate a site and for anyone who is ever interested in a little bit of guest writing for me make sure you feel free to let me know, i’m always look for people to check out my web site. Please stop by and leave a comment sometime!
March 9th, 2011 at 2:24 am
Have you ever ever thought-about including more videos to your blog posts to keep the readers more entertained? I imply I simply learn by way of your complete article of yours and it was quite good but since I’m more of a visible learner,I discovered that to be more helpful effectively let me know the way it seems! I love what you guys are all the time up too. Such clever work and reporting! Keep up the nice works guys I’ve added you guys to my blogroll. This is a nice article thanks for sharing this informative information.. I will visit your blog usually for some latest post. Anyway, in my language, there will not be a lot good supply like this.
March 9th, 2011 at 3:40 am
Can I make a suggestion? I believe youve obtained something good here. But what should you added a pair links to a page that backs up what youre saying? Or possibly you could give us one thing to look at, one thing that may connect what youre saying to one thing tangible? Only a suggestion. Anyway, in my language, there aren’t much good source like this.
March 9th, 2011 at 4:07 am
I used to be very happy to find this site.I wished to thank you for this nice read!! I undoubtedly enjoying each little little bit of it and I’ve you bookmarked to take a look at new stuff you post. Anyway, in my language, there will not be much good supply like this.
April 26th, 2011 at 2:49 am
You made a number of nice points there. I did a search on the matter and found nearly all persons will have the same opinion with your blog.
May 3rd, 2011 at 8:40 am
Properly, this is link wheel my very first go to to link wheel your weblog! We’re a gaggle link wheel of volunteers and starting a link wheel brand new initiative in a neighborhood throughout link wheel the same niche. Your weblog provided us link wheel helpful info to work on. You will have link wheel carried out a marvellous job! Anyway, in my language, there aren’t much good source like this.
July 17th, 2011 at 4:08 am
Hi, Cool post. There’s a problem with your online web site in web browser, would certainly check this?- For example is still the marketplace innovator along with a lot of people will certainly skip your own wonderful composing for this reason problem.
September 6th, 2011 at 11:31 pm
Would love to always get updated outstanding web blog!