Come to Flash Camp Boston for free, March 19th

We always do a lot of events on the West Coast but I’m extremely happy to be able to announce that we’re going to be holding a very special Flash Camp in Boston, on March 19th, from 5:00 – 11:00. It’s going to cover all of the new stuff in Flex 4 and Flash Builder 4 as well as a sprinkle of ColdFusion Builder for those who are interested in checking out the latest ColdFusion IDE. One reason I’m excited about this Flash Camp is that we’re bringing in a bunch of engineers from the San Francisco and San Jose offices to come present on their Flex 4 and Flash Builder areas of expertise. We’ll also have Deepa, fresh off of her promotion to Flex product manager, to give the keynote.

Here’s the tentative agenda and important info. You can register for free at the Flash Camp Boston event site.

How Much: Free and open to the public (Limited space and Registration required)
When: Friday, March 19th, 2010. 5:00 p.m. EST – 10:30 p.m. EST
Where: The Charles Hotel, Harvard Square, 1 Bennett St. Cambridge, MA 02138
Why: Why not?
What to Bring: Yourself and your laptop. We’ll be providing the beer, food, prizes, and access to parts of the engineering team so you can get all of your Flex questions answered.

5:00 – 5:45 p.m. Registration/Food/Drinks/Networking
5:45 – 6:15 p.m. Keynote
6:15 – 6:45 p.m. Overview of Flex 4
6:45 – 7:00 p.m. What’s New in Flash Builder 4
7:00 – 7:20 p.m. Break
7:20 – 7:50 p.m. Animation and Effects in Flex 4
7:50 – 8:05 p.m. Introducing ColdFusion Builder
8:05 – 8:20 p.m. PHP and Flex 4
8:20 – 8:50 p.m. Creating Custom Layouts in Flex 4
8:50 – 9:10 p.m. Break
9:10 – 9:40 p.m. Advanced Skinning in Flex 4
9:40 – 9:55 p.m. SpringSource and Flex 4
9:55 – 10:15 p.m. Flash Builder 4 Secrets
10:15 – 10:30 p.m Flash on Mobile
11:00 p.m. Doors Close

For those of you who can’t make it to Boston we’re also going to be running an event in San Francisco just a bit later with a very similar schedule. So those of you on the West Coast can get some face time with the engineers as well.

Mapping Data Types from PHP to Flex with Zend AMF and Flash Builder 4

I assume this has to be out there somewhere but I couldn’t find it so hopefully this helps someone who Google’s things the same way I do. And Wade has a great tutorial for doing this when you’re just dealing with the Zend AMF code but I was looking for something that worked with Flash Buidler 4′s wizards.

While using the Flash Builder 4 data-centric design wizards to generate the service calls for a PHP class I was having trouble figuring out how to make sure that the data types I had set up in my MySQL database were being carried all the way through to my Flex application. When I retrieved data from the database in PHP and then had Flash Builder 4 inspect my class, the properties of my returned class were all strings.

If you use the data-centric design wizards to create a class based on a database, the class properties are typed correctly. If you use a class you’ve already written, all of the properties come back as strings. Luckily I chatted with our Flex/PHP guru, Mihai Corlan, and he pointed me in the direction of type casting.

Essentially you just need to add a bit of extra data when the properties are returned in the class so that Zend AMF knows what type of data to expect. So for my getAllItems() method, I iterate through the records of my database and create a PHP object for each one.

As you can see in the code below, to return as an int, just add a 0; to set it as a number, add 0.0; to set it as a date, just create a new DateTime object with the data from MySQL. As you can see from the Mapping Table you’ve got coverage for pretty much every data type.

public function getAllForests()
{
     $this->connect();
     $rs = mysql_query("select * from national_forests")
          or die ("Unable to complete query.");
 
     $national_forests = array();
 
     while( $row = mysql_fetch_assoc($rs) )
     {
          $forest = new NationalForest();
          $forest->id = $row['id']+0;
          $forest->state = $row['state'];
          $forest->area = $row['area']+0.0;
          $forest->established = new DateTime($row['established']);
          $forest->closest_city = $row['closest_city'];
          $forest->name = $row['name'];
 
          array_push($national_forests,$forest);
     }
 
     return $national_forests;
}

If there’s a better way to do this, I’d love to have it.

Enterprise Apps in the Cloud Just Got Better: Salseforce/Adobe Partnership

Today we announced an interesting partnership between Salesforce.com and Adobe. As Tim Anderson noted, there has always been a surface integration because Flash Builder could consume WSDL’s and Salesforce.com has always exposed them. But this goes quite a bit deeper. One, we’re working with the Salesforce.com team to make sure their IDE is completely integrated into ours. You’ll be able to get a combined Force.com and Flash Builder tool so you never have to switch environments to create Flex applications on top of the Force.com platform. The new tool exposes a new project type, the Force.com stratus type, and lets you automatically connect to the Force.com platform using a WSDL file. Then you can use the data features of Flash Builder to connect your data in the cloud with Flex components. It also has support out of the box for creating AIR applications that support online/offline synchronization.

The new tool and the partnership really simplify the process to connect to the Force.com platform so that you can focus more time on building a really great user interface that exposes those services. A “consumer-link” user experience is becoming more and more prevalent in the enterprise and is seeing a lot more demand. As ReadWriteWeb notes this is going to do a lot to help merge the consumer world of Flash with the enterprise back end of Force.com as well as some of our enterprise functionality in the form of LiveCycle Data Services. I think there are also some cool use cases here for integrating LiveCycle Collaboration Services. And of course the Force.com platform now gets access to over a million Flash developers who can target the cloud.

You can check out the video below for some getting started information. There is also a fantastic Force.com quickstart on Adobe’s Developer Connection and a lot of other information on the Force.com section of Devnet. Finally there will be a live webinar on November 3rd with James Ward and Markus Spohn where you can get a demo and then ask questions about how it all fits together.

Rundown of the MAX News

The press releases just crossed the wire and we have a ton of news coming out of MAX. Plus more surprises in store for tomorrow. For those of you not here you can still check the keynotes out. I’m hosting the online side of the MAX keynotes and we’re doing some fun stuff before and after the keynotes to give you a sense of what’s going on at MAX. As you can tell from the rundown, there’s some fun stuff today.

Flash Platform Runtimes

We’ve been saying all year that Flash on mobile devices is a push this year and we’ve made a lot of progress. Today at the keynotes we’re going to be showing off Flash Player 10.1 for smartphones. This is the version of the Flash Player that we’ve been working on so hard this year. We’ve been working with some great partners including Nvidia and ARM to optimize the player for those devices and create a quality mobile experience.

Possibly more important is that the number of companies committed to the Open Screen Project continues to grow. Today we announced that RIM is joining the Open Screen Project, which means that Blackberry will be supporting Flash Player 10.1. Google is also on board. We’ll have public versions of Flash Player 10.1 for Palm, and Windows Mobile later this year with Google Android and Symbian following shortly. Developers will have mobile bits in their hands soon.

We also announced AIR 2.0, which is going to give Flash developers a lot more native hooks into the operating system. A lot of the developers I talked to wanted it and so that’s what the team did. Mike Chambers talked about some of these features at Flash on the Beach. Another cool feature of AIR 2.0 is the ability to record from the microphone without going to a server. getMicrophone can now be a reality

.

Tools

We also have public betas of both Flash Builder and Flash Catalyst that are available today. I’ve been really impressed with how far Flash Catalyst in particular has come from Beta 1 to Beta 2. It’s a lot more polished, has more functionality (including video) and feels a lot more fun to use. If you checked out Beta 1 and found it lacking, you should check out Beta 2. We’ve also made big progress on Flash Builder and I’ve been a very happy camper using the tool full-time.

Servers

Some very cool stuff is also happening on the server side. We’ve released ColdFusion 9, a spectacular release with some great features including the ability for you to consume ColdFusion as a service from inside of your Flex application without writing ColdFusion code. I’ve also been playing with the LiveCycle Data Services release and its modeler plug-in for Flash Builder. The team has focused on model-driven development making it easy to generate and create a model, and then link that model directly to your Flex application. It helps by generating all of the assemblers and you can directly modify the user interface just by changing the model.

Finally we’ve got some Flash Media Server news. We’re adding support for HTTP streaming, which will include support for content protection. We also have released the Collaboration side of Flash Platform Services and announced pricing so you can jump in and start adding collaboration to your application.

If you guys have any questions (sorry I don’t have more fleshed out info, it’s a lot of news), feel free to drop me an email – ryan@adobe.com and I’ll try and answer what I know.

Iterative Design/Development with Flash Catalyst and Flash Builder

As I talk to more and more designers and developers one of the things that comes up is whether Catalyst makes it easier or harder to do iterative design on a project. The workflow most people have seen is you start in a tool like Illustrator, Photoshop, or Fireworks; create a high fidelity visual design in that tool; and then import that into Flash Catalyst where you can start turning that artwork into visual components. I think that’s a pretty powerful workflow for designers of all stripes.

The issue that comes up most is that not everyone starts that way. In a lot of cases people create a skeleton application first in Flash Builder and then want to apply visual designs later. Themes are one option, and we’ve got a new Theme chooser in Flash Builder to help with that, but one of the great things about Flex 4 is that it’s easy to create very customized, unique skins for components. So without the ability to do round-tripping between Flash Catalyst and Flash Builder in the 1.0 version of Catalyst, what can designers do to iterate on a design alongside a developer? The answer is the Flex Library project.

I realize this is far from an ideal workflow, but I think for Flash Catalyst 1.0 and Flash Builder 4 it works okay and provides a way for teams of designers and developer to iterate together without stepping on each other’s toes.

Core Steps

  • Export assets to a Library Project in Flash Catalyst.
  • Import that Library Project as a Library Project into Flash Builder
  • Link the imported Library Project to your main Flash Builder project.
  • Make design changes in Flash Catalyst.
  • Re-export the Library Project and import it by overwriting the old Flash Builder Library Project
  • Your main Flash Builder project will be updated with the new design.

Detailed Walkthrough

So let’s say a developer has an application that they’ve created with the default components. I’ll start with something really basic:

<s:Button x="19" y="78" label="Button"/>
<s:HSlider x="210" y="31" />
<s:List x="152" y="108">
 
</s:List>
<s:TextInput x="10" y="31"/>
<s:Button x="152" y="77"/>

iterate_design_01

Clearly a great RIA in the making. But I take a lot of pride in my work and I want to use the power of Flex 4 to create a unique set of skins and components that stand out. In the ideal workflow I would be able to give this to my designer, they would open it in Catalyst, create some great components, and send it back to me. I can’t do that, but I can do some design in Catalyst and then bring in those designs in a special way. First I’ll create some great looking components in Catalyst by starting with a blank project and importing Illustrator/Photoshop assets, and then convert them to components.

itreate_design_03

After I turn all of my artwork into interactive components I am going to pop over to the library panel and start giving them usable names. By default Catalyst calls the created components “Button1″, “Button2″, “ItemRenderer1″, etc. I give them names that will mean something to the developer and help differentiate components.

iterate_design_02

Once I do that, all I have to do is export my library file into an FXPL file by right-clicking anywhere in Catalyst’s Library panel. With that done, I have the ability to import that FXPL file as a new Flex Library project in Flash Builder.

iterate_design_04

That library file contains all of the assets and skinned components I just created. In order to use those, I simply add that project to my main Flex project from the project Properties->Flex Build Path and I can start changing the skinClass attribute for my components to point to those new files.

<s:Button x="19" y="78" label="Button" skinClass="components.BlackPushButton"/>
<s:HSlider x="210" y="31" skinClass="components.MetallicSlider"/>
<s:List x="152" y="108" skinClass="components.GreyDataList">
 
</s:List>
<s:TextInput x="10" y="31" skinClass="components.MetallicTextInput"/>
<s:Button x="152" y="77" label="Button" skinClass="components.GreyButton"/>

iterate_design_05

But now the client tells us they want that black button to be an interstate sign (who knows). I have that asset in Illustrator so I can open my original Flash Catalyst file that I created the library project in and I have a couple of options. I could create a new button with a unique name or I can change the original button component using the round-tripping between Illustrator. I’ll do the latter.

iterate_design_06

Once that’s finished toggle back to the Library panel and re-export the assets making sure to overwrite the original file. Then switch back to Flash Builder and go through the import process again. By default, it will try to create a new project and just append “_1″ to the project folder. Make sure you overwrite your project by removing that. You’ll get a warning, but that’s fine.

This is where the magic happens. Without doing anything, you can run your application and you’ll automatically have those new assets. Any event handlers you’ve wired up to the button or any code you’ve created that use that button will remain unchanged; only the button graphics will change. Because the projects are linked, any change we make to our imported assets filter down to our core project.

The designer can use that original Catalyst file and the re-export process to make modifications to any asset we want. They can also create new components from artwork, create custom components, or add image assets and all of those will be available to the developer inside of that main Flex project.

iterate_design_07

This is all still kind of a work in progress, but I think this will work for some of the design-develop problems people need to solve. While the 1.0 version of Flash Catalyst will have some limitations around the Flash Builder workflow, there are still a lot of basics there that can be built on. If you’ve tried this or have other ideas on how this could work, definitely drop me an email. I’d love to hear feedback.