Learn more about the features available in Shazzam 1.1.
Install your own copy of the free Shazzam Pixel Shader Utility here.
Some video tutorials are available also.
A place to talk about upcoming changes, new features, bug fixes
Oct 11th, 2009 by waltritscher
Learn more about the features available in Shazzam 1.1.
Install your own copy of the free Shazzam Pixel Shader Utility here.
Some video tutorials are available also.
Oct 11th, 2009 by waltritscher
Silverlight and WPF are different beasts. The similarities between the two is high, but there are enough differences to foul you up now and then.
There is a new addition to the Settings pane. The code generation engine will consider your desired platform when generating the .NET classes.
Figure 1: Target Framework setting.
As you can see from the following code examples Shazzam creates slightly different versions of the DependencyProperty registration code depending on your framework choice. Shazzam also ignores Point3D, Vector3D, or Point4D property types when creating Silverlight classes as Silverlight 3 doesn’t support these types yet.
// Use UIPropertyMetaData for WPF
public static readonly DependencyProperty AspectRatioProperty
= DependencyProperty.Register("AspectRatio", typeof(double),
typeof(BandedSwirlEffect), new UIPropertyMetadata(((double)(1.5)),
PixelShaderConstantCallback(3)));
// Use PropertyMetaData for Silverlight
public static readonly DependencyProperty AspectRatioProperty
= DependencyProperty.Register("AspectRatio", typeof(double),
typeof(BandedSwirlEffect), new PropertyMetadata(((double)(1.5)),
PixelShaderConstantCallback(3)));
Shazzam now generates a parameterless constructor that automatically loads the compiled pixel shader from an assembly resource. If the name of your assembly is different from the name of your namespace, you’ll need to hand-edit the URI in the constructor."
The resource URI can be relative, taking the form "/AssemblyName;component/ShaderName.ps" – this new syntax works in both WPF and Silverlight.
[Shazzam 1.1 was released on October 11, 2009]
See a list of additional help pages here.
Install your own copy of the free Shazzam Pixel Shader Utility here.
Oct 11th, 2009 by waltritscher
Creating shaders is fun. But it’s more thrilling to see what your new shader can do. Shazzam has a testing screen for just that purpose, giving you a place to experiment with your effect, just choose the ‘Change Shader Settings’ tab.
Figure1 : Change Shader Settings tab.
What happens when you compile your HLSL code? Each input parameter in your HLSL code is converted to a DependencyProperty in the generated C#/VB code.
/// The HLSL
/// <summary>The aspect ratio (width / height) of the input.</summary> /// <minValue>0.5</minValue> /// <maxValue>2</maxValue> /// <defaultValue>1.5</defaultValue> float AspectRatio : register(C3);
/// The C# Dependency Property
public static readonly DependencyProperty AspectRatioProperty
= DependencyProperty.Register("AspectRatio", typeof(double),
typeof(BandedSwirlEffect), new UIPropertyMetadata(((double)(1.5)),
PixelShaderConstantCallback(3)));
In turn, each DependencyProperty in your generated class is assigned an editor on the test page. See Figure 2 for an example.
Figure 2: AspectRatio editor.
The Min and Max textboxes on the editor set the range for the value slider. Move the slider to set the current value for the property (AspectRatio in this example).
Manually changing the slider value is useful to see what happens to the image when a particular test value is applied. When you find a interesting version of your effect you can jot down the detail and use it in your Silverlight/WPF application. But sometimes you just want to play with the settings and see what happens. That’s why there is an animation section on the edit control. There are several buttons (exact number depends on the property type) available for controlling the animation.
Figure 3: Animation controls.
When the animation is running the value slider is replaced with a status textbox. This way you can see the current values as the animation runs and not be distracted by the slider racing dizzily back and forth on the screen.
Figure 4: Current animation value as text.
Some properties like Point and 3DPoint have multiple values in each property. The editor provides more controls for editing and adds another animation button (Circular animation).
Figure 5: Multiple editors and circular animation button.
The Settings pane has a number of improvements in versions 1.1. The one you are interested in for today is the Default Animation Duration setting. This specifies the default duration for all animations. Your default is loaded in to the test page the next time you compile the shader. You can always modify the animation duration on the test screen, the default value is only used as the initial setting.
Figure 6: Setting pane – Default Animation Length.
[Shazzam 1.1 was released on October 11, 2009]
See a list of additional help pages here.
Install your own copy of the free Shazzam Pixel Shader Utility here.
Oct 7th, 2009 by waltritscher
In HLSL code you can create input parameters of various datatypes. Here’s one of the simplest scalar types, the float.
float – 32-bit floating point value.
There are a number of vector types too.
float2 – two dimensional float vector.
float3 – three dimensional float vector.
float4 – four dimensional float vector.
When you need two float values stored in a type (think WPF Point and Size types) use a float2 in your HLSL. float3 is used for types like 3DPoint and float4 is handy for storing the four color values (Alpha, Red, Green, Blue) together.
In Shazzam 1.0 float2 and other vector values were shown in the test UI with a single textbox.
Figure 1: Shazzam 1.0 UI
Simple but not the most intuitive interface ever to grace an application. Plus the point values were not animatable in V1.0. In Shazzam 1.1 the test UI has been changed to support animation and updated to handle float2, float3 and float4 values in a smarter way.
Figure 2: Shazzam 1.1 UI
There is a better use of color in the UI labeling too, which helps differentiate between labels and data.
There is a new Meta Tag, the <type> tag, available for decorating your HLSL. This tag tells the compiler which .NET type to use for a given HLSL variable.
float can be Double or Single.
float2 can be a Point, Size or Vector.
float3 can be Point3D (not available for Silverlight).
float4 can be Point4D or Color.
Example HLSL
//-------------------------------------------------------------------------------------- // float4 //-------------------------------------------------------------------------------------- // float4 map to Color or Point4D /// <type>Color</type> float4 SampleColor: register(C4); /// <type>Point4D</type> float4 SamplePoint4D : register(C5);
Figure 3: Shazzam 1.1 Color and Point4D
The result is that the Point4D gets four data entry controls. You still have to enter a color value (Red, Orange, #Ff4455FF) in a textbox however. In a future version of Shazzam this will be replaced with a color picker. In the meantime you can use the Color Picker in the side pane (thanks Robby).
Figure 4: Robby’s Color Picker
[Shazzam 1.1 was released on October 11, 2009]
See a list of additional help pages here.
Install your own copy of the free Shazzam Pixel Shader Utility here.
Oct 7th, 2009 by waltritscher
One of my favorite new features in Shazzam 1.1 is the HLSL meta data tags. Shazzam reads a small set of optional XML tags embedded in your HLSL and uses this meta data to inject information into your generated class. Plus there are tags for setting default, minimum and maximum values that propagate to the shader testing screen.
In order to keep the HLSL compiler happy the tags are placed in a comment line. Use the triple-slash /// syntax to differentiate Shazzam comments from HLSL comments.
Available Tags
<class>: The class tag specifies your desired Class name for the generated code file.
<namespace>: The namespace tag specifies your desired .NET namespace for the generated code file.
<description>: The description tag injects an XML comment above your class definition in the generated code file.
Example HLSL
//------------------------------------------------------------ // Specify a default Class name for the generated file /// <class>DemoEffect</class> //------------------------------------------------------------- // Specify the default >NET namespace for generated file. /// <namespace>Shazzam.Shaders</namespace> //------------------------------------------------------------- // Provide a description for this Shader // Shazzam will generate XML comments from this description /// <description>An effect that demonstrates the Shazzam features.</description>
Figure 1: Generated class code.
The next set of Meta Tags is used to pass information to the Shazzam test page. You can specify minValue, maxValue, defaultValue and summary values for each HLSL register. The generated C# or VB class uses these value as defaults for the class properties. Plus every time your shader.fx code is compiled the testing UI is initialized with these settings. No more reentering values every time you compile the shader!
<summary>: Provide a summary describing the purpose of this variable. A summary tooltip will appear in the testing window.
<minValue>: Provide a default value for the minimum textbox. Note that you can set the value in the text box to a lower number than the minimum. minValue merely provides the starting value for the textbox.
<maxValue>: Provide a default value for the maximum textbox. Note that you can set the value in the text box to a higher number than the maximum. maxValue merely provides the starting value for the textbox.
<defaultValue>: Provide a starting value for the Value slider control.
Example HLSL
// Causes a tooltip to show in Shazzam.
/// <summary>Summarize the purpose of this variable.</summary>
/// <minValue>-20</minValue> // provide minimum initial value for the register. /// <maxValue>300</maxValue> // provide maximum initial value for the register. /// <defaultValue>120</defaultValue> // provide default value for the register. float SampleFloatWithXML: register(C1);
Figure 2: Min, Max and Default values in the Shader Settings view.
[Shazzam 1.1 was released on October 11, 2009]
See a list of additional help pages here.
Install your own copy of the free Shazzam Pixel Shader Utility here.
Oct 5th, 2009 by waltritscher
Shazzam is changing. There hasn’t been much improvement to Shazzam this year and that’s a shame. Especially since there is an influx of Silverlight developers exploring the benefits that pixel shaders bring to their projects.
Many of you have discovered Shazzam via enthusiastic support from the WPF and Silverlight community. Thank you Laurent Bugnion, Josh Smith, daneshmandi, Karl Shifflett, Adam Kinney, Craig Shoemaker and Polymorphic Podcast, Channel9, Andy Beaulieu, Bill Reiss, René Schulte, the Silverlight 3 Programmer’s Reference crew, Dave Campbell (WynApse and Silverlight Cream) , Tim Heuer, Jeff Prosise, Matt Castro and many more that I don’t have links for.
I’m flattered that my little utility is finding a home on so many desktops. It’s nice to hear about the projects you’ve created with Shazzam’s help. For example, check out daneshmandis Face Maker application for an superb example of WPF in action. Being developers you’ve not been shy about expressing your desire for new features either. Which brings me to Eric.
Say hello to Eric Stollnitz.s
![]()
Eric has worked at Microsoft for seven years, first helping to create the Expression Blend user-interface design tool, and more recently helping the Interactive Visual Media group of Microsoft Research develop innovative ideas into shipping software.
Some of you might know his work. He was on the Expression Blend team and also did some work on Peter Blois’s Snoop utility.
Eric has been a great help in getting development on Shazzam moving again. It all started when he wanted to make a couple changes to improve Shazzam’s ability to generate Silverlight shaders. Here’s Eric explaining how he got involved, “Yeah, at first I just wanted two features: remembering default values for shader registers, and generating Silverlight-compatible C# code. Then it kind of snowballed…”
Snowballed is an understatement. Eric has done some great work on the project. I will be chronicling improvements in the next release (many of which are from him) over the next couple days but first let me give you glimpse one of Eric’s contributions.
You can specify minValue, maxValue and defaultValue for values for registers using triple-slash comments in the shader code. The generated C#-VB class gets these values supplied for the defaults. Plus the testing UI is initialized with these settings too. No more reentering values every time you compile the shader!
There’s plenty of other changes. Stay tuned.
As always, you can install Shazzam from the shazzam-tool.com site. The new version will be available by next week.
Oct 5th, 2009 by waltritscher
I’ve been posting about Shazzam for over a year on my WpfWonderland blog. Now that Shazzam version 1.1 is about to be released I figure that it is time to setup a dedicated blog.
News and discussion regarding the Shazzam Pixel Shader Utility.
Yes, that’s the goal. To have a place to describe upcoming changes, bug fixes, etc and keep you up to date on the shazzam world.
Thanks for using Shazzam.
Walt Ritscher