Skip Navigation LinksHome / Shows / View Show

The Ugly Duckling - Part 2

Add to SilverlightShow Favorites
0 comments  /  Show #19 with András Velvárt  /  42 minutes  /  Mar 05, 2010
(2 votes)
Download MP4 79.09mb

In the first part of the series, I introduced the application, and created the “ugly duckling” version, where the end user could already browse the and watch the videos. In this part, I am going to add some bling to the app – namely the Intro animation, the ability to skip it, and to replay it. The Intro animation itself is not created with Silverlight, so I will just use it as a video. This part takes heavy use of Visual States, Behaviors and Easings.

That screencast is connected with the Transforming an Ugly Duckling to a Graceful Swan with Expression Blend and Silverlight - Part 2 Intro Animation article.

Here is what happens in the screencast:

Time Content
@ 0:00 Introduction and showing off what we are building in this screencast
@ 1:40 Adding the intro animation – preparation
@ 2:40 Adding the intro animation - MediaElement
@ 3:47 Visual State for playing the intro and transition between PlayingIntro and ShowingUIAfterIntro states
@ 4:57 Make the App start up in the PlayingIntro state
@ 6:07 Adding the EndCueTrigger
@ 9:40 Adding the playback status display
@ 12:50 Adding IntroStatusVisible and IntroStatusHidden states and transitions
@ 14:38 Creating the MediaElementStateToVSMBehavior
@ 16:18 Using the MediaElementStateToVSMBehavior to show and hide the video status display
@ 19:08 Creating the DisplayMediaStatusBehavior
@ 21:00 Using the DisplayMediaStatusBehavior to set the text for the video status display
@ 22:30 Adding the skip intro button
@ 24:30 Adding a glow effect to the skip intro button
@ 25:50 Creating MouseOverOpacityBehavior
@ 28:14 Applying the MouseOverOpacityBehavior to the skip intro button
@ 29:35 Making the skip intro button skip the intro
@ 31:30 Replay Intro – creating the highlight on the box
@ 33:20 Creating ReplayIntroVisible and ReplayIntroHidden states and transitions
@ 38:10 Adding some code to the skip intro and replay intro features
@ 41:30 Summing up

Guest profile

András  Velvárt

András Velvárt

András is the founder, lead developer, architect, idea-man and CEO of Response Ltd ( - a small, 6 years old ISV company, with 6 developers and designers, based in Hungary. András is extremely passionate about technology, user experience, and how technology can be brought closer to people (he coined the term “grandmother’s computing”).


Comments RSS RSS
No comments

Add Comment


Please add 3 and 6 and type the answer here:

Help us make SilverlightShow even better and win a free t-shirt. Whether you'd like to suggest a change in the structure, content organization, section layout or any other aspect of SilverlightShow appearance - we'd love to hear from you! Need a material (article, tutorial, or other) on a specific topic? Let us know and SilverlightShow content authors will work to have that prepared for you. (hide this)