Condividi tramite

Silverlight 3 Application Themes

  • Articolo

Before I dive into the Silverlight 3 application themes, I would like to mention some research that my co-workers on the Visual Studio User Experience Team are doing focused on professional and non-professional web/application developers. The research involves…

  • A short survey
  • A telephone interview to discuss your development experiences

A gratuity will be offered to individuals selected to participate in the telephone interview, and selection for interviews is based on responses to the survey. The gratuity is either a $25 Visa/American Express gift card or select Microsoft software titles. If you are a professional or non-professional web/application developer and would like to be involved in this research, please email vidyaraj@microsoft.com.

 

Application Themes

Now, let’s take a look as some of the application themes I’ve put together over the past few months. At this time, there are 10 themes that you can easily apply to your Silverlight 3 projects created using either the ‘Silverlight Navigation Application’ or ‘Silverlight Business Application’ Visual Studio project templates.

Please note...

  • If you do not see these projects in the Visual Studio New Project dialog, you will need to install the Visual Studio tools for Silverlight as well as .Net RIA services; see Silverlight.net for specific details
  • If you do not have Visual Studio, feel free to use my starter ‘Silverlight Navigation Application’ and ‘Silverlight Business Application’ projects. You will still need to install .Net RIA services if you choose to use the business project, but this project includes some nice login/logout UI, so it may be more suitable to your application needs and worth checking out

 

To apply these themes, simply swap out the ‘Styles.xaml’ file found in the project ‘Assets’ folder with the desired ‘Styles.xaml’ theme file.

 

Candy

This theme was just completed, and I'm including an application mockup for you to reference, so you can see how you might actually use it in the real world.

Please note...

  • The Navigation template requires that the image 'BackgroundImg.png' is placed in the 'Assets' folder and added to the project
  • The Business template requires that the images 'Arrows.png' and 'BackgroundImg.png' are placed in the 'Assets' folder and added to the project

 

Seeing Sound

The application colors in many of the subsequent themes can be customized by modifying the brushes found at the top of the 'Styles.xaml' file or by using Blend as shown below.

 

Please note...

  • Both the Navigation template and the Business template require that the image 'Noise.png' is placed in the 'Assets' folder and added to the project
  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file
  • Hyperlinks nicely transition between selected and unselected states

 

Mediterranean Sun

Please note...

  • Both the Navigation template and the Business template require that the image 'Noise.png' is placed in the 'Assets' folder and added to the project
  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file

 

LimeShocker

Please note...

  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file
  • Hyperlinks nicely transition between selected and unselected states

 

Aurora

Please note...

  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file

 

Pinky

Please note...

  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file
  • Hovering over a hyperlink causes an interesting animation on the blue arrow

 

Skyline

Please note...

  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file

 

Subdued

Please note...

  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file

 

Frosted Cinnamon Toast

Please note...

  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file

 

Retro

Please note...

  • Application colors are easy to customize through modification of the brushes found at the top of the 'Styles.xaml' file

 

The themes are available for download here or on the Microsoft Expression community website.

One last thing, I have a few theme questions that I would appreciate your feedback on...

  • Do these themes help you get started building your applications (act as inspiration, learning tools...), and, if not, why not?
  • Do you use these theme's 'as is' with little modification when building your applications?
  • What type of themes would you like to see in the future (what would help you be more productive when building your applications)?

Please, send me your feedback using the direct comment section at the bottom of this post. I will use the information to improve the themes in the future, so your feedback really matters, and I look forward to hearing from you!

Comments

  • Anonymous
    July 09, 2010
    Thanks.  I forgot to post this thank you last year.