Louis-Philippe Pinsonneault

Expression Blend for Developers at TechDays 2009 Montreal – Part 2 – Creating Glass Effect

For the second part i will show you how to create some glass effect. Just as a reminder i’m not a graphic artist, i’m .NET Developer. As you can see Expression Blend allow any developer to improve the design without the help of a graphic artist or images (keep in mind Silverlight and WPF are vector graphic base).

Starting with the background I've created in the previous post we will add some stuff to have parts of the application looking like glass.

Now we will add an header that will look more fancy and glassy. First we will add a rectangle.

Again we will use the gradient properties to add the required effect. So we will change the background to use the gradient.

Now we will change the start anchor and set the Alpha to 20. After we will add a new anchor in the middle and set the Alpha to 50. We will add another anchor to the right of the last one just added, and we will set the Alpha to 15. Finally we will set the Alpha of the last anchor to 0.

To polish this title bar we can add a drop shadow. To do so, in the Properties under Appearance, there is a property called Effect. We now click on the New button. In Expression Blend there is some predefined effect available. You can now select DropShadowEffect.

Now we have an header that look a lot better. As you can see if we resize the window, the the opacity effect is visible in the header.

Now you can add some text in the header. You can also apply the DropShadowEffect on the text to make it more readable. And again you can play with the Gradient. Here is an example:

Now we will add glass effect over an image. So add an image in your application. Over this image we will add a new rectangle. This will be the object that will create the glass effect.

Now we will set the gradient to a really soft blue #CEDDEC. Now we will need 4 anchor in our gradient slider. And the only thing that will change is the Alpha on each anchor.
(From left to right)
- 1rst : Alpha = 80
- 2nd : Alpha = 25
- 3rd : Alpha = 50
- 4th : Alpha = 30

Also I've changed the gradient arrow to make the illusion of the direction of the light.
 

 

The final result:

 

Next part: Working with Template and data binding to a sample data source.

Regards,
Louis-Philippe

Expression Blend for Developers at TechDays 2009 Montreal – Part 1 – Using gradient

Two week ago i presented a session on Expression Blend for developers. I had a great time presenting (even if i had some issues remembering my slides). But what was interesting wasn’t the slides but the demos.

So today i will show you some tips and tricks based on my demos.  

Using gradient

Using gradient can help improve the visual aspect of an application. In Expression Blend the functionality is well implemented. First select the control you want to apply the gradient.

 

In the Properties bar you can select on which properties you want to apply the gradient. More often we apply the gradient on the background of an object.

Now you can select the third option. This is the gradient tools.

The gradient slider allow you to change the way the gradient will look like.

You can have multiple anchor in the slider

Here is an example of the way we can use the slider to create some effect. For each anchor we can change the color and the opacity.

Also there is a tool in the toolbar that allow us to change the direction of the gradient.

This tool display an arrow that let you change the direction of the gradient. It’s really simple to use.

So we can have professional background for our application by setting the gradient from “Black” to “Almost Black”. And use the Gradient Arrow to change the gradient direction.

Here is the result.

 

Next part: Creating Glass Effect

Regards,
Louis-Philippe

Samedi.NET was a huge success

This Saturday the .NET Montreal User Group presented a full day of presentation on Silverlight. The main topic of the day was “How to build a business application with Silverlight”. There was more people than we expect to have on a Saturday (more than 160 persons).  Five speakers shared the stage to cover the whole presentation(Laurent Duveau, Dominic Sévigny, Guy Barrette, Pascal Groulx and me [Louis-Philippe Pinsonneault]. The real goal behind this day was to present the different tools that a developer may have to use to create a business application.

Agenda

1. Introduction
2. Design a prototype with ShecthFlow. (Guy Barrette)
3. Using RIA Services.  (Laurent Duveau) 
4. Creating and calling a WCF service. (Pascal Groulx)
5. Changing the look of the application with styles. (Dominic Sévigny)
6. How to change the look of a button and make it shining. (Louis-Philippe Pinsonneault) 
7. Create a logo with Expression Designer and importing it in Expression Blend (Guy Barrette)
8. Animate the logo with Blend. (Dominic Sévigny)
9. Search Engine Optimization. (Laurent Duveau)

Here is a list of the tools that were used during the day:

• Visual Studio 2008 SP1
• SQL Express
• Silverlight
• Expression Blend 3
• Expression Designer 3
• .NET RIA Services

There is effectively a real interest in Silverlight in the community. It was interesting to see that there was not only developers but also some designers who attend at the day.

I’m really happy to be part of this event and sharing with others.

If you are interested in taking some Silverlight training, look at the Silverlight Tour.

 

Also you can attend at the Tech Day on December 2nd to December 4th at Montreal. I will present a session on Expression Blend. Dominic Sévigny will present a session on PRISM and Laurent Duveau will present the new feature of Silverlight 3.

Some picture of the day:

The crowd before a few minutes before the presentation.

 
Guy Barrette talking to Christian Beauclair (from Microsoft) just before the presentation.

Guy and Etinne Tremblay presenting the event

Guy starting his presentation. We had the chance to see his designer talent

 
Guy building a Silverlight SketchFlow application and integrate a sample data source in his sketch flow application.

 
Laurent show the DomainService class base on the .NET RIA Services

 
An overview of the crowd.

Laurent answering some questions while Pascal Groulx prepare his presentation.

  
Pascal a few moment just before his 1st presentation. His presentation focus on how to build a web service using WCF.

 
Dominic Sévigny show us how to work with Styles in Silverlight using Visual Studio and Blend.

 
This is me explaining how to build custom controls in Blend. I create a button based on a rectangle, and i tried to make it shiny.

 
The second presentation of Guy was about Expression Designer and Expression Blend. He show us own we can integrate file made with Adobe Illustrator or Adobe Photoshop.

 
Dominic came to help Guy to integrate the user control containing a logo.

Dominic show us how to create animation using Expression Blend.

Laurent finish the day by presenting how to work with SEO.

Finally, Laurent answers some questions at the end of his session.

 

**Update**

You can download the source code that we used (thanks to Laurent for the file)

http://cid-0e564ed4426a5ecc.skydrive.live.com/self.aspx/Presentations/Samedi.NET%20Montreal%202009/BeersMontreal.zip

Regards,
LP

Reporting and Printing within Silverlight 3.0

Since a couple of week i was looking for way to create reports within Silverlight or generate printable version of the content of the Silverlight application. I found some solutions (with the help of Dominic Sévigny). As a reminder, Silverlight doesn't allow us to access resources from the client machine for security reason. This is why it's not possible to print within Silverlight. As you will see, all of the controls I'll talk about use a similar technique to generate reports. They generate files like PDF, Excel, ... as container for the report which allow you to save the file locally or open it with your local viewer or editor which allow you to print the file.

Report Sharp-Shooter for Silverlight

To generate reports there is Perpetuum Software who have a reporting tools that allow you to generate the report on the server and a report viewer for Silverlight that allow you to view and export (PDF, XLS, DOC) reports.

Feature:

• Fast report uploading: every single page is loaded separately; you can view only those report pages you really need without loading the whole report
• Report preview: single page, continuous
• Export to PDF, HTML, Excel, and RTF
• Zoom of any type: percent, regional, dynamic
• Fast search
• Easy navigation
• Report panning

Link: http://www.perpetuumsoft.com/Report-Sharp-Shooter-for-Silverlight.aspx

Screenshot:

SmartPrint for Silverlight

To generate a printable version of the content of a Silverlight application, there is a beta software called SmartPrint for Silverlight from SmartWebControls. This application let you generate a PDF. This is a workaround solution when you need to print, because Silvelight doesn't allow us to access to do. This control take the XAML part to render in the PDF and send it to an HTTPHandler on the server. This HTTPHandler use server side component to render the PDF and return the result PDF to the client.

Feature:

• Generate printable PDF documents on the server based on Silverlight screens
• Support for letter and landscape documents
• Automatically email generated PDF documents as needed
• Generate and print a PDF document right in the browser within seconds
• Support for custom header text and page numbers
• Support for multiple pages
• Works with standard and navigation projects
• Generate reports directly from Silverlight screens
• PDF documents can be saved on your server or generated on the fly and served to clients
• Efficient compression algorithms used ensure data is transferred as quickly as possible
• SmartPrint Silverlight assembly is less than 75kb in size allowing your XAP files to stay small
• Free unlimited trial version available that runs on the "localhost" domain
• Works in Internet Explorer 6+, FireFox 2+, Chrome 2+ and Safari 4+

Link: http://www.smartwebcontrols.com/SmartPrintDetails.aspx

Screenshot:  

Those solution are good workaround for the security limitation of Silvelight. I hope in the next version of Silvelight they will integrate some native feature for printing and/or reporting.

Regards,
Louis-Philippe

New version of the AJAX Toolkit

Yesterday a new release of the AJAX Toolkit was release. What’s new in that release? There is 2 new controls:

Seadragon - Seadragon enables you to pan, zoom, and make an image full screen. You can use it, for example, to display interactive product pictures. AsyncFileUpload - This new control enables you to perform file uploads without doing a postback. The control displays a throbber image during upload and raises client and server events when the upload is complete. This control was contributed by Steven Lindsay.

Finally the have implement the File Upload functionality. Like many people this was my long awaited feature.

Here is the link to download the latest release of the AJAX Toolkit:
http://ajaxcontroltoolkit.codeplex.com/Release/ProjectReleases.aspx?ReleaseId=33804

If you want more information you can read the blog of Bertrand LeRoy, who wrote a great post on the new feature:
http://weblogs.asp.net/bleroy/archive/2009/09/30/ajax-control-toolkit-new-controls-bug-fixes.aspx

Regards,
LP

(via: Bertrand LeRoy)

Montreal User group (Special Event in french)

On October 24th, there will be a special training event on Silverlight. I’m very please to be part of the event as a presenter. My presentation will focus on Expression Blend.

Here is the complete schedule (in french):

Intro (15 min)

Design du prototype avec ShecthFlow. (30 min) Guy Barrette

Utilisation de RIA Services.  (90 min) Laurent Duveau 

Création et appel d'un service WCF. (30 min) Pascal Groulx 

Pause du midi (60 min)

Changer le look de l’application en utilisant les styles. (30 min) Dominic Sévigny 

Changer le look d’un bouton pour le rendre « shiny » avec Blend. (30 min) Louis-Philippe Pinsonneault 

Créer un logo dans Expression Design et l’importer dans Blend. (30 min) Guy Barrette 

Animer le logo avec Blend. (30 min) Dominic Sévigny 

Search Engine Optimization. (30 min) Laurent Duveau 

Période de discussion (45 min)

Tirages (15 min)

Feel free to register by clicking on the image below.

Waiting to see you there!

LP

(via: Laurent Duveau)

 

Introduction to XAML

This morning while i was reading my RSS feed, i seen something interesting for anyone who want to start developing in Silverlight or WPF. Microsoft Learning have just released a new course "Introduction to XAML" which is free.

To activate the course use the following link:
https://www.microsoftelearning.com/eLearning/courseDetail.aspx?courseId=128213&tab=overview

Regards,
LP

Silverlight 3 and Expression Blend 3

Today is a big day for Silverlight.
The version 3 of Silverlight is now in RTW (Release To Web) and have been released. http://silverlight.net/GetStarted

And Expression Blend 3 is now in Release Candidate. This release also include the long awaited feature SketchFlow (http://www.microsoft.com/downloads/details.aspx?displaylang=en&FamilyID=92e1db7a-5d36-449b-8c6b-d25f078f3609 )


You can find more detail at the following websites
http://www.seethelight.com
http://www.microsoft.com/silverlight
http://team.silverlight.net/

I will post more on the new feature very soon.

Regards,
Louis-Philippe

Microsoft TechDays Canada 2009

Save the date: Microsoft TechDays Canada will have its second edition in 2009 and is coming back to Montreal on December 2, 3.

For others cities/dates go to: www.techdays.ca

My Code Camp Presentation

Saturday, i did my presentation at the Montréal Code Camp. I’m very proud of myself. This was my first time as a speaker. My presentation focus on some advanced features of Expression Blend.

I tried to show the feature available in Blend 3 based on my past experience. When i went at MIX 09, i saw some new features like Sketch Flow, which introduce the ability to use Blend as a prototype tool. But while, preparing my presentation, i find out that Blend is really a great prototype tools out of the box. Like i said during my presentation, many times i was requested to do some prototype of application.

So my presentation was for both developer and designer. I didn’t focus on the technology (Silverlight or WPF) behind but on the tool itself.

So the feature that I've talked about was:

• Photoshop Importation
• Sample Data Source
• Behaviors
• Sketch Flow

I the next few days i will post on those features (except Sketch Flow, because i only got the right to do a live presentation of this new feature).

For now here is the slides of my presentation and a demo that combine the Photoshop importation, Sample Data Source and the behaviors.

Regards,

Louis-Philippe

Code Camp Montreal – May 30th 2009

I’m proud to announce that I've been selected to present a session at the Code Camp Montreal on May 30th 2009. My session will focus on the advanced feature of Expression Blend. I will present some of the new feature of Expression Blend 3 (which should be released in a couple of month). The sample data source, behaviour, Intellisense, Photoshop importation will be part of that presentation.

Date : Samedi 30 mai 2009
Heure : 8h30 à 17h00
Endroit : Marriott Château Champlain au centre ville (Carte), salles Viger A-B-C.
Stationnement: Payant. Le 1000 de la Gauchetière qui est juste à côté de l'hôtel offre un tarif réduit le week-end.
Métro: Bonaventure (ligne orange)
Coût : gratuit
Repas: non inclus
Thème : Les meilleures pratiques de développement logiciel.
Organisé par la Communauté .NET Montréal

Regards,

Louis-Philippe

How to retrieve a DLL from the GAC

Sometime we have some question that we don’t get the answer right away. This one was one of them. I often ask myself “How to get a DLL from the GAC?”, and i didn’t really search for the answer because i was able to retrieve the DLL from another location.

Recently, i had the same question once again but i wasn’t able to find the assembly anywhere else. So i finally got the answer from my college Dominic Sévigny. The trick it’s that we cannot export a DLL from the GAC from the Windows interface. So we need to do it from the DOS console. Here is the procedure to do it:

First you need to open a new command window. You need to browse to the GAC_MSIL folder (c:\Windows\assembly\GAC_MSIL)

Each assembly have it own folder. So if you need to access the assembly “CrystalDecisions.ReportAppServer.ClientDoc” you can do it by accessing the folder.

C:\Windows\assembly\GAC_MSIL>cd CrystalDecisions.ReportAppServer.ClientDoc

Once in the folder, you should see a subfolder for each version of the assembly in the GAC.

C:\Windows\assembly\GAC_MSIL\CrystalDecisions.ReportAppServer.ClientDoc>dir Volume in drive C has no label. Volume Serial Number is C470-AE11 Directory of C:\Windows\assembly\GAC_MSIL\CrystalDecisions.ReportAppServer.ClientDoc 23/04/2009  09:55 PM    <DIR>          . 23/04/2009  09:55 PM    <DIR>          .. 23/04/2009  09:55 PM    <DIR>          10.5.3700.0__692fbea5521e1304                0 File(s)              0 bytes                3 Dir(s)  38,585,462,784 bytes free

Select the version you need by accessing the folder.

C:\Windows\assembly\GAC_MSIL\CrystalDecisions.ReportAppServer.ClientDoc>cd 10.5.3700.0__692fbea5521e1304 C:\Windows\assembly\GAC_MSIL\CrystalDecisions.ReportAppServer.ClientDoc\ 10.5.3700.0__692fbea5521e1304>dir Volume in drive C has no label. Volume Serial Number is C470-AE11 Directory of C:\Windows\assembly\GAC_MSIL\CrystalDecisions.ReportAppServer.ClientDoc\ 10.5.3700.0__692fbea5521e1304 23/04/2009  09:55 PM    <DIR>          . 23/04/2009  09:55 PM    <DIR>          .. 23/04/2009  09:55 PM            57,344 CrystalDecisions.ReportAppServer.ClientDoc.dll                1 File(s)         57,344 bytes                2 Dir(s)  38,585,479,168 bytes free

 

Now you have access to the DLL of the assembly you need. So you can copy the DLL, using Copy or XCopy, to the location you want 

This is why i love my job i always learn new stuff everyday, even it’s something very simple!!

Regards,
Louis-Philippe

MIX 09: Review Day 3

 

The last day of the MIX 09, was interesting and also a little bit frustrating, because i had to left Las Vegas :) But i will always remember the good i had   there with my friend Laurent Duveau.

 

Session #1 – Consuming Web Services in Microsoft Silvelight 3

Eugene Osovetsky give us a good overview of what will be available with Web Services and Silverlight 3. Mainly the availability to consume binary XML, Debug and server to client “push”.

Video: Consuming Web Services in Microsoft Silverlight 3

 

Session #2 – Adding Microsoft Silverlight to your Company’s Skill Set

I was a disappointed, because the speakers was talking more about Flash than they were talking about Silverlight. And i yes, I'm not a fan of showcase presentation and this one was one.

Video: Adding Microsoft Silverlight to Your Company's Skill Set

 

Session #3 – Building Microsoft Silverlight Controls

This session was very interesting Karen Corby, know what she was doing. It was also related to the styling. A great presentation to watch.

Video: Building Microsoft Silverlight Controls

 

Session #4 – High-Speed RIA Development With the Microsoft Silverlight Toolkit

This was my last session. Shawn Oster present the Silverlight Toolkit. But i wasn't able to view the whole presentation because i had to leave to take my plane back to Montréal.

Video: High-Speed RIA Development with the Microsoft Silverlight Toolkit

 

Conclusion

In conclusion, i really enjoy the experience. I hope to be there next year! I’ll try over next few weeks to blog more technically about what I’ve learned at MIX.

Regards,
Louis-Philippe

Silverlight 3 training now available in Montréal for the first time!

Be ready for the next version of Silverlight!

Laurent Duveau as announced that he will give a french Silverlight 3 training at the end of this month in Montreal, Qc.
http://weblogs.asp.net/lduveau/archive/2009/04/03/the-very-first-silverlight-3-training-in-montreal.aspx

The Silverlight Tour has already been modified to include Silverlight 3 content. If you want to be ready for the next version of Silverlight, this is the place to be. This three-day workshop is going to teach the latest features of Silverlight as well as the complete Silverlight 2 stack.

When: April 27-29

Where: Montreal, Qc

Registration (Fr): http://www.runatserver.com/SilverlightTraining.aspx

The new features covered include:

• Out of Browser Support
• Pixel Shaders
• Animation easing
• Hardware Graphic Acceleration
• Behaviours
• Navigation Framework
• Blend 3
• Binding Improvements
• Secure Web Services
• Binary XML Transport
• RIA Services Client Controls
• Preview of RIA Services

Regards,
Louis-Philippe

MIX 09: Review Day 2

The second day was more about the tools like Expression Blend and Expression Web. Those tools are now part of the toolbox of any web developer or designer. The feature that attract more my attention are the SuperPreview from Expression Web (this allow you to compare a web page between different browser and fix any discrepancies. Also, in Expression Blend there a lot of new feature like Skecth Flow (this allow you to easily build a wire frame of your application that the end user can interact with and add feedback), the SampleDataSource which provide the ability to a designer to fill any object that require data without having to enter any data.

Keynote

• Dean Hachamovitch
  The keynote of Dean wasn’t a surprise. But it was cool to be at the release of IE8. I’ve seen a lot of improvement. I’m still learning the new feature.
  
• Deborah Adler 
  Present her showcase about the design of container to solve some labelling issues. This was very interesting, to only thing the presentation was a little bit too long.

 

Session #1 – The Future of Microsoft Expression Blend

Expression Blend will evolve as much as Silverlight 3. This tool that was at first build to target designer is now considered as premium tool for developer to build Silverlight application. In this new version, Designer are now allowed to implement action and response to event without having to implement code. On the other side developer can now code without having to switch to Visual Studio. They have implemented the code editor with intellisense. Also, Blend can now handle project under source control like TFS. Another new feature is the ability to import Photoshop and Illustrator files and convert some of the layer into controls.

Session #2 – The Best Video and Photography on the Web in Microsoft Silverlight

This session was presented by Vertigo. This presentation was good but it was more a showcase than a technology presentation. I`m not a big fan of showcase presentation.

 

Session (video) - User Experience Design Patterns for Business Application with Microsoft Silverlight 3

I’ve planned to assist at this session but it was full. So i’ve downloaded the video. One thing that kept my attention, it’s the new SampleDataSource that generate the data to help the design of the application. So there is no more need to hardcode data to be able to test a DataGrid or a DropDownList. Corrina Black also present the new control that help build great user experience like the DataGrid, the validation control, etc… This is an excellent presentation.

Other Session

There was other session that look interesting that i will look later in video. I wasn’t able to attend to those due to schedule conflict.
-When Errors Happen: Debugging Microsoft Silverlight (John Papa)
-Microsoft Silverlight is Ready for Business (Ward Bell)
-Search Engine Optimization (SEO) for Web Developers (Thomas Deml)

Conclusion of Day 2

The second day was more about Expression Blend. All Blend feature are very interesting. I’ll take some time to test all those new feature. But i regret that the Sketch Flow feature is not available in the current preview of Blend 3.

Regards,
Louis-Philippe