The PopFly home page (after you login with your Passport account). From here you can jump into the three main activities: Build a web page, build a mashup, and meet users. Let's look at each in order.
First up is the web page editor. There is not much unique going on here. There is an attempt at creating a RibbonBar in the editor, but it is both functionaly and visually less impressive than existing implementations.
The dialogs in the web page editor are fixed (in other words, you can't move them). This is the Header Text dialog, which opens if you click on the default header text.
There are a number of options for changing your page's look and feel. Here you see the list of "Themes", which essentially let you pic a new photo for your page header.
You can also select a new layout for your page from a predefined list.
There is an Office 2007 like color pallette selector for seleting your site's colors.
The settings button opens up a dialog that lets you set your site's width (either 100% or 780px - no custom sizing options available).
And here is our resulting page after changing some settings.
If we change the RibbonBar tab (or click in one of the content areas), we have some new commands available. One option shown here is to change the content layout on the page.
Before you can upload images to your web page, you need to save it. All web pages are saved online (on Microsoft's servers) in your PopFly space.
Clicking the "Save" button prompts you to give your page a name.
Unfortunately, PopFly wouldn't let me save any of my work (web pages or mashups). I assume this is a temporary Alpha problem, so your milage may vary.
If you click on the preview button for your web page, it will open the page in a new window (or tab) and display the current page state.
Now let's switch gears and look at the Mashup Creator in PopFly. It takes a few seconds for the editor to load up in the browser.
Once the editor loads, you'll see a list of "blocks" that can be added to the page on the right and a collapsable tutorial on the left.
If you hover over a block, the block icon does a little animation and a tooltip describing the block appears. We'll add this RSS block to our mashup to feed Telerik RSS items to some display block.
We select the block by clicking on it in the list or dragging it onto our workspace. If we hover over the block is spins (oooh...) and if we click the wrench icon (similar to Vista Gadgets) we can configure its properties.
After you click the wrench on a block, you get this zoomed-in property editor mode. Here you can set any available block properties. We'll configure our RSS block to pull Telerik RSS items.
To display our RSS data, we'll add the NewsReader block to our page. Right now the two blocks are independent in our workspace and we'll need to connect them to display our data. (Notice the live preview of the mashup in the background on the lefthand side of the page.)
We'll connect our RSS and NewsReader blocks by clicking on one connect "node" and then clicking on a node on the other block.
Here we see the configuration options for the NewsReader block.
There is a pencil (and eraser) control in the mashup space, too. I'm not sure what these actually do other than give you the ability to doodle on your mashup space.
You can add any HTML you want to your mashup using the very cool HTML editor. Very cool because it has browser-based HTML IntelliSense! I hope this IntelliSense shows-up in more online HTML editors soon.
If we preview our mash-up, we see our custom HTML ("Telerik Watch" in bold) and our NewReader. There is no data in our reader, though, so we obviously need to fix our RSS data source.
There we go. Now we see our RSS data in our NewsReader.
The last section promoted on the PopFly homepage is the "Meet Users" page. On this page you'll find a list of other PopFly users that you can befriend and "rip" PopFly code from.
Another less promoted browser feature is the block creator. This is where you'd build a custom block for use in a mashup. Microsoft actually encrouages you to build blocks in Visual Studio instead of the browser, so this is more of convenience tool.
Don't know where to start with your custom block? You can "rip" the code for any existing block in the list by clicking the "rip" link and then modify the code from there.
On the user management side, you have the ability to change the PopFly theme from the default brown. Here I've selected the calming "Ocean" theme.
The "My RSS Feeds" section has apparently not been finished yet.
And before anyone asks, I don't have any invites to give away (at least not yet). If I get any, I'll let you know.
Last, but not least, is your profile management page. Here you can manage your name, tag line, blog link, and picture. This data is visible to all other PopFly users in the "Meet People" section we looked at earlier.
And that's the PopFly Alpha in a nutshell. Hope you enjoyed the tour!