Greg Dove, a Degrafa core team member, and the creator of Degrafa’s VectorFill, has broken new ground with another new Degrafa paint object, VideoFill.

There have been a couple of sneak previews of VideoFill over the past few months; Juan showed a quick preview at 360|Flex earlier this year and Greg showed a quick demo at FlashCamp in New Zealand as recently as September. Well, no more ’sneaks’ (apart from this one!), it’s finally going to be available from beta 3.2.

You won’t believe all the things you can do with this, suffice to say that it makes some video effects that could be difficult to achieve – even in the Flash authoring tool – very easy to code in Flex with Degrafa.

To be honest, we don’t know what you will do with VideoFill. We can see it being used in creating custom players for specific video content or for specific vector/clipping effects for video -this is quite practical and quick to do with VideoFill. And yes…it can be used for skinning if absolutely required (’absolutely’? yeah we can’t think of when that would be either….but hey, we’ll let someone else tell you not to do it!).

A screen capture from the Avatar trailer being used as a VideoFill

Under the hood, to make VideoFill work, a complete new custom video player class was written from the ground up, designed for the purpose of supporting the way that VideoFill does its magic internally within Degrafa. VideoFill does require data access permission to work with the bitmapData of the video, but that is quite straightforward if you load from a domain under your control. It handles both progressive download video and also has support for rtmp streaming video content. Greg is also planning to add in support for the Camera object to round things out in terms of capabilities/support so that it’s easy to add live webcam content as a fill.

Back in the realm of regular paint classes in Degrafa, VideoFill is an ITransformablePaint object, which means you can spin, skew, scale and move a VideoFilll inside its target Geometry object using Degrafa’s Transforms…all while the video is happily playing! Watch out for more VideoFill information and tutorials after additional exciting beta 3.2 announcements in the coming days. We’ll add an official VideoFill sample to the Degrafa samples page as soon as beta 3.2 is released…for now you can whet your appetite on this one.

The Degrafa Team is really excited about Degrafa Beta 3 and the continuing progress on to Degrafa 1.0. A lot of people have expressed how happy they’ve been with Degrafa so far and have even offered to donate funds to the development. Right now the most we can hope for is people spreading the word about Degrafa and let people know about your experiences with with it. Seeing people using the framework is what keeps us going, so the more blog posts, tutorials, or shout outs Degrafa gets, the more people start using it. That all in turn makes it all worth it to us.

We know not everyone has the time to go to such lengthy efforts to get the word out there. Heck, we have to squeak hours in here and there to keep development moving forward. So, if you wanna do something quick to help the Degrafa user-base grow, feel free to slap the banners and icons below wherever you see fit. You might remember the “I [ Degrafa ] Fx” design from the shirts we handed out at the last 360|Flex.

Thanks to everyone for their continued support and comments to continually push Degrafa forward. We’re also looking for success stories to share, so if you have a story to tell email us at info [ at ] degrafa [ dot ] com.

Banners Click images for the link

While at 360|Flex there were a lot of questions regarding how Degrafa got started and whether or not we were “inspired” by MXML-G. I thought I’d (Juan) share a little of that information in case anyone else was wondering.

ï¾ 

About six months after I started ScaleNine I picked up on a blog post by Jason Hawryluk about a “Primitive Explorer” he had created that allows for programmatic drawing of shapes via set parameters. My initial interest in that blog post was exploring the potential for programmatic drawing for various purposes, but mainly skinning. Jason picked up on the link I had on ScaleNine to his blog and he sent me an email asking if I’d be interested in collaborating on the “next version” of the Primitive Explorer.

ï¾ 

Initially I just created a logo for the new Primitive Explorer (now the Degrafa logo), but as Jason and I carried on more conversations we realized that some of the things we were talking about lent themselves to more than an explorer and into a full framework. This framework would allow for programmatic graphics via MXML markup. The more we talked about it we started to realize that the framework could be capable of doing a lot of unique things, so we forged ahead with trying to pull it together.

ï¾ 

The process of getting the framework started was a collaborative one. I looked at things from a designer’s perspective and Jason from a developer’s. For the name of the framework, we decided on Degrafa, which is DEclarative GRaphics FrAmework compressed together. Plus, it was a short URL.

ï¾ 

As progress was being made, Jason made a comment on FlexCoders about graphics definable via MXML and it evolved into an email conversation with Ely Greenfield. That email conversation turned into an opportunity to show Ely and Glenn Ruehle what we were working on, as well as see what they had in the works. We had no prior knowledge that Adobe was working on something similar, so we were excited to share.

ï¾ 

Via an Adobe Connect session we got to see the first implementations of what Adobe was working on for graphics defined in MXML (later this became known as MXML-G). We were happy to see that Adobe had similar interests, but we weren’t sure how soon what they were working on would be available to the public, so we forged ahead.

ï¾ 

Adobe MAX 2007 rolled around and we got to see where Adobe was going with MXML-G. It was Thermo and Flex 4. Now we could see where things were going, but then we heard dates in 2009 for when some of the things we saw would be public. Again, we decided to forge ahead and in the process we were able to pick up other developers who saw potential in Degrafa. Guys like Ben Stucki, Pavan Podila, Andy McIntosh, Jim Cheng and others got involved, which helped push things forward.

ï¾ 

On January 1st, 2008, we released the first beta of Degrafa, dubbed “Origins”, and we were surprised by the response. People started using it for all types of things, like skinning, data visualization, product customizers, and more. Seeing this added fuel to the fire and since we’ve laid the initial groundwork for Degrafa we’re able to start doing some really interesting stuff. Everyone on the team likes to think that what we’re contributing to is something that may potentially change the way people think about graphics in Flex. Our hope is do offer up a lot of powerful features that are easily accessible and don’t sacrifice performance.

If you were able to make it to 360|Flex Atlanta, swing by the EffectiveUI booth and grab a “limited edition” Degrafa shirt. It seems there’s been a lot of swag floating around at the conference, but the Degrafa shirts are a limited run of 200. Pick one up while you can and be sure to wear it to the Degrafa session on Wednesday. A big thanks to EffectiveUI and 360Conferences for sponsoring the shirts!

The last month since Degrafa Origin was released out into the wild has definitely been an interesting one. Attention to the framework has popped up in a number of ways and in a variety of languages. From questions to interest, adoption to experiments, and a couple of cool contests. This is clearly evidence that the community has been waiting for the abilities to create and manipulate graphics directly within Flex, whether with Degrafa or any other solution. So far, there have been 1,300 downloads of the SWC (who knows how many using the source) and the feedback has been great. Here’s a few links to some Degrafa “buzz”:ï¾ 

Get a job developing with Degrafa
ï¾ 
Post by Ryan Stewart

ï¾ Post by Doug McCune
ï¾ 
Some User Examples:
http://alivepdf.bytearray.org/?p=11
http://ccgi.arutherford.plus.com/blog/wordpress/?p=156

360|Flex API Contest

ï¾ As a team, we have goals and features in mind for Degrafa, but a big part of it is what we think the community wants too. A list of feature requests has started being compiled on the Degrafa Google Code “Issues” page and we’d love for people to vote for and suggest what they’d like to see in Degrafa, no matter how big or small the feature may be. Any ideas are welcome and you can get a hold of us through email, the Degrafa Google Group or on Google Code.

ï¾ We want to keep adding features to Degrafa that will push it to be more of a declarative “design” framework, rather than focusing on the initial graphics capabilities that started this whole project in the beginning. This means adding things like layout managers, but also building on what’s already there, so you can do more with less code.

ï¾ Hopefully, this will get to a point where you won’t need external tools like Illustrator or Flash to create the typically static assets for a Flex UI, and make the power of programmatic capabilities more accessible at the MXML level. If their are external tools for Degrafa, we’re hoping they’ll be open-source, built in Flex, and have the source available. We know it’s an ambitious undertaking, especially when everyone on the team maintains a full-time job.ï¾ 

We mentioned your entries might come in handy for something (besides the Degrafa Derby) being announced soon. Well, that something is the 360|Flex API Contest and you can use your Degrafa Derby entry for the Community category of the API contest.

The prize to the winner of the 360|Flex contest gets a PlayStation 3, which means you could really clean up if you win both contests. There are also prizes for usage of the Ribbit and Ebay APIs. The official contest site for the 360|Flex API contest will be up soon.

Get more info about the 360|Flex API Contest

We are diligently working on getting things ready for the Degrafa beta release. Things like documentation, samples, getting set up on Google Code and Google Groups, etc. are all being worked out as I write this.

Of course, with New Year’s celebration and the team being distributed all over the world, the roll out of all the components (documentation, samples, etc.) will probably be distributed throughout the day of the 1st. Then more will be added as the days go by. The main thing we want to get out there is the framework itself, so people can start playing. So stay tuned…

By the way, information will be distributed across these URLs:

• code.degrafa.com : Points to the Degrafa Google Code page.
• group.degrafa.com : Points to the Degrafa Google Group.
• samples.degrafa.com : This is where links to samples in the documentation will point to.
• docs.degrafa.com : This is where the Degrafa documentation will go.

This is all subject to change, but we’ll let you know if it does.

Before we get into the similarities and differences between Degrafa and Thermo (Flex 4 framework) I thought I’d give a little perspective of how we got to where we’re at now. When Ted Patrick announced the graphics tag at 360Flex | Seattle, people started asking us how Degrafa compared.ï¾ 

Then, when Adobe demoed Thermo at MAX, showing the use of the graphics tag, we got even more questions. The thing is, we knew the graphics tag was coming before that knowledge was made public, but we decided to keep developing.ï¾ 

We kept developing, not because of what we did know, but because of what we didn’t know. Everyone on the team had different goals for Degrafa, each of which could have been developed as a separate, stand-alone framework. However, we didn’t know if the next version of the Flex framework would do all the things we wanted and we didn’t want to wait.ï¾ 

As time passed, others like Andy McIntosh, Ben Stucki and Pavan Podila got involved, which meant more features and more people to help. Some of these features will be making it into the beta we’re getting ready to release. Other features need a little more thought and development before we feel comfortable releasing them into the wild. We also want to gauge what we do next based on the feedback from this first beta.ï¾ 

So, Degrafa versus Thermo? It’s a good question, but without having access to Thermo (or the Flex 4 framework) we can only give an answer based on what was shown at MAX and in the videos available online.ï¾ 

First off, Thermo is an application and Degrafa is not. Degrafa is a declarative graphics framework similar to the framework Thermo interfaces with (the graphics tag). We keep hearing from Adobe that with Thermo “you can draw basic shapes“, but we want to do more than that.ﾠ

Degrafa was started to be very versatile and robust so it could be used to create skins, UI graphics, data visualization and more without having to use Illustrator, Flash, etc or Drawing API knowledge. We also wanted to be able to do a lot more with CSS (post on that soon).

There is some overlap, but without having Thermo in our hands we can’t really say how much, or how little, overlap there is. One difference that we can mention is that Degrafa will be out sooner ï¾ 

Also, the changes coming in the Flex 4 framework, like being able to radically control the visuals in components, will only help Degrafa become more powerful. Degrafa will always be an extension of the Flex framework and not compete with it. Hopefully others will like it as much as we do.

ï¾ 

We’d like to welcome Pavan Podila to the Degrafa team. Pavan has a strong background in WPF/XAML and has worked on complex UI designs and custom controls. He also developed the Illustrator to XAML exporter. Pavan feels Flex is very similar in principle to WPF, so he decided to get involved with Degrafa.

Pavan’s initial role with Degrafa will be direct parsing of SVGs (like those you might get out of Illustrator) into MXML Degrafa mark-up. Beyond that he’s looking to create a feature which will able to convert that MXML to XAML. Pavan is already moving at a rapid pace and we know his involvement will only add to the flexibility of Degrafa.

To learn more about Pavan’s work you can visit his WPF blog or his Flex blog.

As we got deeper into developing Degrafa, it became more apparent that all the features we want to include are more than just a couple of developers can handle. Ben Stucki expressed interest in adding to the Degrafa efforts in ways that can only be good. We’re glad to have Ben contributing, as it means we’ll be able to do more in a shorter time frame, like get the beta out.

A while back we mentioned CSS features for Degrafa, this is where Ben’s focus will initially lie. We know he’ll be able to take the CSS integration with Degrafa much further than we were anticipating on initially and add more to it. You can read more about some of Ben’s other projects on his blog.