I've been playing with the SDK sample I referenced earlier to get a better handle on animation composition and thought I'd share my particular angle of pursuit which may be helpful.  First off, here is just a XAMLPad version of the sample I'm interested in:

 

<!-- Demonstrates the usage of multiple animations to simulate a ball bouncing. -->
<Page xmlns="
http://schemas.microsoft.com/winfx/avalon/2005"
    xmlns:x="
http://schemas.microsoft.com/winfx/xaml/2005"
    >
    <Page.Resources>
  <RadialGradientBrush x:Key="redBallBrush" GradientOrigin="0.75,0.25">
   <RadialGradientBrush.GradientStops>
    <GradientStop Color="Orange" Offset="0" />
    <GradientStop Color="Red" Offset="1" />
   </RadialGradientBrush.GradientStops>
  </RadialGradientBrush>

  <RadialGradientBrush x:Key="orangeBallBrush" GradientOrigin="0.75,0.25">
   <RadialGradientBrush.GradientStops>
    <GradientStop Color="Yellow" Offset="0" />
    <GradientStop Color="Orange" Offset="1" />
   </RadialGradientBrush.GradientStops>
  </RadialGradientBrush>

  <RadialGradientBrush x:Key="blueBallBrush"
   GradientOrigin="0.75,0.25">
   <RadialGradientBrush.GradientStops>
    <GradientStop Color="LightBlue" Offset="0" />
    <GradientStop Color="MediumBlue" Offset="1" />
   </RadialGradientBrush.GradientStops>
  </RadialGradientBrush>


  <Style TargetType="{x:Type TextBlock}">
            <Setter Property="FontFamily" Value="Verdana"/>
  </Style>

 </Page.Resources>

   <Page.Storyboards>
     
      <ParallelTimeline>
        
         <!-- Animates the vertical position of the first ball. A single
              animation is used. -->
         <SetterTimeline TargetName="singleAnimationBall" Path="(Canvas.Top)">
            <DoubleAnimation  To="0" Duration="0:0:3" AutoReverse="True" RepeatBehavior="Forever"
               DecelerationRatio="1" />
         </SetterTimeline>

          <!-- Animates the vertical position of the second ball.
               Two animations are used. -->
         <SetterTimeline TargetName="twoAnimationsBall" Path="(Canvas.Top)">
            <ParallelTimeline RepeatBehavior="Forever" Duration="0:0:3" AutoReverse="True">
                  

               <DoubleAnimation To="0" Duration="0:0:3" DecelerationRatio="1" />

               <DoubleAnimation To="380" Duration="0:0:3" AccelerationRatio="1" />

           </ParallelTimeline>
         </SetterTimeline>

         <!-- Animates the vertical position of the third ball.
               Three animations are used. -->
         <SetterTimeline TargetName="threeAnimationsBall" Path="(Canvas.Top)">
            <ParallelTimeline Duration="0:0:6" RepeatBehavior="Forever">

    <ParallelTimeline AutoReverse="True" RepeatBehavior="Forever" Duration="0:0:3">
     <DoubleAnimation To="0" Duration="0:0:3"
      DecelerationRatio="1" />
     <DoubleAnimation To="380" Duration="0:0:3"
      AccelerationRatio="1" />
    </ParallelTimeline>

    <DoubleAnimation To="380" Duration="0:0:2" AutoReverse="True"
     AccelerationRatio="1" />
    </ParallelTimeline>
         </SetterTimeline>

      </ParallelTimeline>


   </Page.Storyboards>

<Canvas Height="480" Width="640"
    >

 

 <!-- The first bouncing ball. A single animation is used. -->
 <Ellipse Name="singleAnimationBall"
  Width="100"
  Height="100"
  Canvas.Left="50"
  Canvas.Top="380"
  Fill="{StaticResource redBallBrush}">
  
 </Ellipse>

 <!-- The second bouncing ball. Two animations are used. -->
 <Ellipse Name="twoAnimationsBall"
  Width="100"
  Height="100"
  Canvas.Left="250"
  Canvas.Top="380"
  Fill="{StaticResource orangeBallBrush}">
 </Ellipse>

 <!-- The third bouncing ball. Three animations are used. -->
 <Ellipse Name="threeAnimationsBall"
  Width="100"
  Height="100"
  Canvas.Left="450"
  Canvas.Top="380"
  Fill="{StaticResource blueBallBrush}">
 </Ellipse>

</Canvas>
</Page>

Throw this into XAMLPad to follow along with this post.

Now, the first thing to note is exactly what is happening here.  Each ball is being animated on the Y axis via its Canvas.Top property, starting from the "ground" if you will and animating upward.  Each ball is thus positioned to start at 380 and then animate to 0, which would be the very top of the canvas.  Now, let's look at the red ball on the left.  Here is its animation:

         <SetterTimeline TargetName="singleAnimationBall" Path="(Canvas.Top)">
            <DoubleAnimation  To="0" Duration="0:0:3" AutoReverse="True" RepeatBehavior="Forever"
               DecelerationRatio="1" />
         </SetterTimeline>

This is pretty straightforward.  The ball zooms to the top of the canvas over 3 seconds and then reverses itself to fall back down over 3 seconds.  The reversal is created via the AutoReverse="True" property.  The interesting property on this animaiton is the DecelerationRatio="1" which is what causes the ball to seem to float as it reaches the surface.  And, because the animation is reversed, you get a slow descent initially. Try tweaking this value to see different effects.  Setting it to zero will cause the animation to have a consistent ratio.  Now, if you feel like getting fancy, add an AccelerationRatio="1".  You'll notice that XAMLPad gets upset.  This is because the sum of DecelerationRatio and AccelerationRatio must be <= 1.  So to see the reverse of the floating effect, set AccelerationRatio="1" and DecelerationRatio="0".  Or to see parity,  set AccelerationRatio=".5" and DecelerationRatio=".5".  

On to ball #2, the yellow ball.  Here is its XAML:

         <SetterTimeline TargetName="twoAnimationsBall" Path="(Canvas.Top)">
            <ParallelTimeline RepeatBehavior="Forever" Duration="0:0:3" AutoReverse="True">
               
<DoubleAnimation To="0" Duration="0:0:3" DecelerationRatio="1" />
               
<DoubleAnimation To="380" Duration="0:0:3" AccelerationRatio="1" />
            
</ParallelTimeline>
         </SetterTimeline>

Notice what we have here: Nested in our SetterTimeine is a ParallelTimeline, which indicates that the two animation should execute in parallel.  So we have two animations being applied to the same property at the same time. The first animation is identical to the red ball. But the second animation is telling the ball to animate itself back to the ground, if you will, to a value of 380.  You are basically telling the animation to do contradictory things. The result is that the animation animation goes half the distance up, but in halve the time.  Notice how the yellow ball bounces twice in the same time that the red ball bounces once. Wacky.   Both animations run, but are composed together to result in the effect seen.

Notice also how the DecelerationRatio and AccelerationRatio properties are set to work in tandem with the animation to ensure it has that floating quality. 

Try playing with the To values to see different effects, like changing the first To value to -100, which will send the ball up higher. 

Now on to ball #3, the blue ball, by far the most mind bending.  Here is its XAML:

         <SetterTimeline TargetName="threeAnimationsBall" Path="(Canvas.Top)">
            <ParallelTimeline Duration="0:0:6" RepeatBehavior="Forever">
               
<ParallelTimeline AutoReverse="True" RepeatBehavior="Forever" Duration="0:0:3">
                 <DoubleAnimation To="0" Duration="0:0:3" DecelerationRatio="1" />
                 <DoubleAnimation To="380" Duration="0:0:3" AccelerationRatio="1" />
               </ParallelTimeline>
               
<DoubleAnimation To="380" Duration="0:0:2" AutoReverse="True" AccelerationRatio="1" />
            </ParallelTimeline>
         </SetterTimeline>

 Okay, here we have a SetterTimeilne that has a nested ParallelTimeline, within which is another ParallelTimeline composed with a DoubleAnimation.  And inside the ParallelTimeline are two animations composed together.  Let's unpack this.  First thing to note is that the initial duration on the parent ParallelTimeline is 6 seconds, as opposed to 3 seconds and is not set up to AutoReverse like the others.   Now, we have a total of three double animations, which means we get three bounces.  The first bounce takes 3 seconds, but then the blue ball is able to bounce twice in the next three seconds.  And, it bounces to different heights in the second two bounds. But why does the ball bounce to different heights on each bounce?

Well, the first animation grouping, inside the child parallel timeline, is identical to the yellow ball's animation, composing the two animations, which is why on the first bounce the blue ball reaches the yellow ball.  For the final three seconds, the child ParallelTimeline is composed with the DoubleAnimation that has a Duration of 2 seconds, giving the bouncing effect.  Try playing around with the Duration and the To values in this animation to see different effects.