Presentation of basic animation. This is useful for beginners to study on animation

1. A quick tutorial July 8, 2011 Silverlight Animation NickoSatriaUtama, MCTS Email : nickotech2000@yahoo.co.uk

2. What is silverlight? According to MSDN, silverlight is a cross-browser, cross-platform implementation of the .NET Framework for building and delivering the next generation of media experiences and rich interactive applications (RIA) for the Web It is a subset of Windows Presentation Foundation.

3. What is Silverlight? It can be built declarative using XAML and imperative using C#, VB or Javascript Cross browser and cross platform; runs on its own sandbox It support audio and video. It support networking using HTTP

4. Animation It is an illusion that is created by quickly cycling through a series of images, each slightly different from the last. The brain perceives the group of images as a single changing scene It animate objects by applying animation to their individual properties.

5. Minimum Developer Requirement Pentium 4 1Ghz 1 GB RAM 30 GB HD Operating System: Windows 7,Windows Vista; Windows XP Service Pack 2 Visual Studio 2010 Silverlight 4.0 tools SQL Server 2008 Express

6. Recommended Developer Requirement Pentium Core 2 2 GB RAM 100 GB HD Operating System: Windows 7,Windows Vista; Windows XP Service Pack 2 Visual Studio 2010 + SP1 Silverlight 4.0 tools SQL Server 2008 R2 Express

7. Create project of silverlight

8. Create silverlight project on VS 2010 Choose Silverlight Application

9. Create silverlight project on VS 2010 Choose ASP.NET Web Application Project and version of Silverlight to version 4. Leave WCF Ria Services for now

10. XAML Show in Designer I use ellipse as an sample It shows ellipse filled with red Create an object to animate

11. Create a storyboard

12. Add code to its .cs file Add methods that is inside red circle

13. Run from Visual Studio It will launch an IE or others browser based on your settings. Please click anywhere on the red

14. More storyboard sample

15. Key frame animation It is a drawing that defines the starting and ending points of any smooth transition. They are called "frames" because their position in time is measured in frames on a strip of film

16. Modify the code in XAML

17. Run from Visual Studio The ellipse will animate color changing when your click.

18. Conclusion Silverlight make it easy to design an eye-catching web Designer, animator and software developer can work together on silverlight project.

19. Further discussion on FORUM MUGI Thank you