Exclusive: Publish.com takes a hands-on look at Microsoft's new visual development tool. Is it a Flash killer, a Windows developer's dream, or both?Microsoft released today the first publicly available alpha of Expression Interactive Designer, one of three new software tools aimed at creative professionals and developers. Interactive Designer is being developed under the moniker "Sparkle."
Sparkle is Microsoft's first foray into the rich media development market, which is currently largely dominated by Adobe's Flash, Flex and Director.
You can download the Sparkle Community Technology Preview (CTP) on Microsoft's site.
You will also need to download the latest CTP for WinFX.
Microsoft first announced Sparkle during its annual developer's conference, Microsoft PDC, last September in Los Angeles.
Sparkle has a chance to catch up with Flash through its tight integration with the Windows operating system and the ability to provide interactive experiences that Flash simply cannot do.
Of course the real question is, can Microsofttraditionally a software engineer focused companyreally give designers tools they want?
What is Interactive Designer?
Sparkle allows developers to visually build "rich media experiences" on top of Microsoft's new Windows Presentation Foundation, or WPF.
Sparkle applications can include text, graphics, video, audio and 3-D, and the software supports programming languages such as C# and Visual Basic.
WPF is part of WinFX, which is the API for the next release of the Windows, called Vista. WinFX is currently available in beta for Windows XP, and will be integrated into Vista when it ships.
The core technology for WPF is a structured XML language called XAML, which itself stands for eXtensible Application Markup Language, and is pronounced "Zammel."
It's important to note that software companies have been trying to provide rich media platoforms for nearly a decade. Unfortunately, early startup technologies such as VRML, a 3-D modeling specification for the Web, and SVG, a structured XML language to create vector graphics, have met with marginal success.
Hands on
When you open Sparkle it is immediately apparent that the tool is for professionals who will regularly build WPF solutions and not the occasional novice user.
To begin with, when the program loads, the designer is presented with a blank work area called the Artboard. Here they can create anything Sparkle will allow them to create. You are not restricted to a few choice selections from a Wizard run template.
The tools, environment and workflow can be significantly customized. Two zoom tools, one for the Artboard and one for the Workspace tools and panels, control precisely how you want to see your environment. Gaining direct access to the XAML code is only one click away and programmers have easy access to either VB.NET or C# code.
Working Within Expression and Beyond
The core to Sparkle is Microsoft's new technology platform WinFX. WinFX extends .NET 2 framework with three core new channels: Presentation, Data and Communication.
The two exposure points for the Presentation channel are Windows Presentation Framework and XAML. WPF and XAML are core to Vista, and feature heavily in development scenarios for Sparkle and the next release of Visual Studio, code named "Orcas."
Sparkle is one of three products in the Expression family of tools. The other two are the "Acrylic" Graphic Designer and "Quartz" Web Designer. Only Acrylic is available today as a CTP.
The key to the successful relationship between Acrylic and Sparkle is XAML.
Acrylic allows a designer familiar with tools such as Adobe's Illustrator or Fireworks to create complex Vector and Bitmap illustrations. The complete art work is exported from Acrylic as a XAML document. The XAML document can be opened and modified in Sparkle.
In Acrylic, an artist can literally illustrate a design for an application and then import that design into Sparkle using XAML. C# can immediately be added to the actual design.
In the past, recreating such a simple drawing would have been very difficult with VB Controls such as the Check Box Control. Now, for example, if the designer wants the check box border to be drawn with rough graphite pencil lines, then the final application will have the same drawing but with the ability to be fully exposed to the complete .NET framework.
Next Page: Comparing strengths and weaknesses.
Strengths and Weaknesses
Sparkle is good at animation, rich media manipulation and does allow you to add C#/VB.NET script. It is not good at deep code support, debugging and testing.
These are tasks for enterprise software architects and engineers. In other words, the people who are already using Visual Studio.
It is fair to say that Sparkle CTP 1 is certainly an early and buggy version of the software. The first time I opened it the program crashed within five minutes. Additional problems arise when you go to use features that simply do not work, such as "Open Recent Projects."
The good news is, instead of forcing Visual Studio users to learn a new tool, both Sparkle and Visual Studio users can work simultaneously on the same project through XAML.
In many ways, the WPF successfully translates the work for a designer and engineer in the same file, a feat Macromedia, and now Adobe, have struggled with for years in persuading Visual Studio users to embrace Flash.
There are a lot of tools in Sparkle professionals will like. Certainly a feature that separates Interactive Designer from competing products is support for true 3-D. 3-D within Sparkle is not emulated or boxed into a separate area, but is simply another native object you can use to interact with 2-D drawings, text, audio and video.
Animation artists will appreciate a significant improvement over competing tools with the Timeline. Unlike the frame driven timeline in Director and Flash, the Sparkle timeline is time based. An animation sequence can be drawn down to the thousandth of a second. (see Figure 4.)
As much as possible, Microsoft has made triggering events, such as animation sequences, completed with no need to write any code. A button can be added to the artboard and through the Events panel, can interactively interface with the application.
Data objects, such as XML files, can be bound visually to a project. Sparkle leverages what it calls Data Visualization to display data in real time.
Through Data Visualization, when you add a data source to the screen, the real data is displayed for you, not a placeholder. You can select and modify the data you are looking at. For instance, you can create a view that lists all of the data from an XML file.
Next, you can choose to change the color and leading of the title for each entry and modify a reference to an image file. The new image can be transformed in real time and the whole data object can be moved to any point on the screen.
Figure five, below, illustrates data added to a Sparkle Project. The phones on the left side of the screen are pulled from a database of images and the data for each object is, in turn, displayed in the main content section on the right. Animation can be added to the images and 3-D models can be used to display the product.
Finally, the most compelling, and at the same time, hardest feature to grasp with Sparkle is that it is built on top of WPF.
Some developers, such as Jered Cuenco, from Avenue A|Razofish, believe that Sparkle's tight integration with WPF is a key differentiator to Flash. He notes that Flash can be integrated into WPF projects as well.
"[Sparkle] Interactive Designer is built to serve a very complex, robust and highly integrated platform of which UX is only one element," he said. "It is made to serve a broader range of needs beyond just the media web application."
It remains to be seen, however, whether Flash developers, especially for large-scale applications, will be drawn to Sparkle.
But Will Designers Like It?
Aside from the bugs, there are many challenges Sparkle will face when artists begin to use it.
The immediate challenge traditional interactive designers will be faced with when they begin working with Sparkle is the concept of working with projects.
A project is an organized collection of all the parts to your work. When you work with a project you only see the files that matter to you as the designer. However, there are additional files there that are hidden that enable projects to be successfully created.
Having worked with Visual Studio I understand that those files are there to help Interactive Designer to manage the project. For the average graphic artist, who is used to working with single files such as PST, PDF or FLA files, then a collection of files can be confusing.
The second challenge I see surrounds the publishing process.
Today, a Flash developer presses the F12 button and a single SWF file is created. The file is added to a Dreamweaver site and is integrated into the Web site. Sparkle does not "publish" a final solution, it builds an application.
The difference is significant. A Flash Movie is built with a tightly managed Sandbox programming language called ActionScript. A Flash Movie is limited to what ActionScript is allowed to do.
In contrast, Sparkle builds complete programs that have the potential to access anything within the Windows operating system. If you want to build a better version of Microsoft Word, then you can do that with Sparkle. The build tool inside of Sparkle is exactly the same as the one in Visual Studio. This concept, however, will be confusing to many.
A third challenge comes with the notion that a project has to be "deployed" to the Web and does not, by default, simply work on the Web. Many designers will be left scratching their heads and wonder "Why doesn't it just work?"
What Needs to Happen Next
There are some things that Microsoft appears to have either not realized or has consciously chosen not to include with this release of Sparkle.
Simple controls in the Presentation Framework Library, such as a DataGrid, DetailsView or simple chart types, are missing. Other features, such as simple debugging, have been shouldered off to the more powerful debugging tools in Visual Studio.
Arguably, however, the largest roadblock Microsoft faces is designers accepting that Microsoft is indeed committed to supporting professional creativity tools.
Microsoft's track record is not good here. Time and commitment will demonstrate whether Microsoft is with the designer for the long haul.
To this point, Jered Cuenco added, "[Sparkle] Interactive Designer is clearly still in its infancy. Workflow is not perfect and the learning curve is somewhat high as many of the more complex functions are somewhat obfuscated. This is partly due to the different paradigm from any previous application model that WPF utilizes and will require a familiarity with the platform."
However, Sparkle does have a good start. Microsoft may be able to learn from the life cycles of similar applications.
With continued support, a good user base and subsequent refinement, Sparkle has the potential to be an excellent application serving WPF UX development.
Summary
The current release of Sparkle is an early Alpha. Microsoft does not even call this version of the product a "Beta" but sticks with the title "CTP", Community Technology Preview, which essentially means "we got a ways to go before we ship."
There are a lot of bugs in the current build: mysterious crashes, data connections not working and memory spikes were among some I experienced.
If you want a stable product then this is not for you. It is experimental and will change. If you have a strong stomach then you can download Sparkle on Microsoft's site.
You will also need to download the latest CTP for WinFX as it comes with WPF which is needed to translate your XAML code.
As you work through Sparkle you cannot help but think of Adobe's Flash and Director. Common tools, such as the Timeline, vector graphics and the ability to publish to the Web, exist between the three products.
But both of Adobe's tools have ten or more years of development placed into them. Can Sparkle compare?
I was impressed with what I saw. The real decision will be made by today's interactive designers and their creative minds. They will want to bend, warp and manipulate Sparkle and push it as they have done with Flash.
For them, the exciting news is that they have a new toy to play with.