Our parent company has launched their touched-up design with a brand new back end.  A revamped Angus e-Classifieds site has also arrived, all ASP.NET powered and compliments of the IS department.

The e-classifieds site was the first project where the Web department had the chance to work directly with the IS department. It was exciting to get the chance to collaborate with them. From a technical standpoint it was refreshing to find others who read Lifehacker and wanted to argue the finer points of jQuery versus MooTools. From the business perspective, the e-classifieds will finally become a viable revenue source for our department. The old site was so archaic it was actually losing money every time someone called to post an ad.

One step forward: our e-lists are now sent using a less-spammy/less-amateurish method.

…and one step backward: our e-lists no longer have a limit to the number we can send per day. We used to tell clients that they needed to book in advance, because we only scheduled 2 full page e-mails to be sent every Tuesday and Thursday. (Still too many, IMHO.) Now we have no limits. April is one of our busiest months. We sent out 83 e-list messages in April alone. Talk about e-mail overload! It’s no surprise our e-list subscribers never hover far above the 4,000 mark.

There are other projects waiting for the IS department’s attention, but hopefully they can help us with the Sale Books problem next. Maybe they can help us create our own Issuu-like application. A Flex app (built by us) powered by ASP.NET with a Microsoft database (built by them).

With a magic little button, I managed to connect to the FMS. Then I bit off more than I could chew with a larger set of UI components. Now, with a little data binding and a lot of ActionScript 3, I have a basic broadcaster built. I’ve read more documentation and books on ActionScript 3, Flex 3 and Flash Media Server than I care to admit, but so far I have absorbed and applied everything I have read. Building my first RIA has been every bit of fun and frustration as I expected, only on a much slower timeline than I had hoped. For every 1 hour I expected to work on a task, I have actually worked 4.

Many of the things I built came from old sample projects. I translated them from Flash to Flex, then from ActionScript 2 to ActionScript 3. You can download my sample projects, supply your own RTMP address and see instant results:

• playback-stream.zip
• make-connection.zip
• nice-ui.zip
• data-binding.zip

I hope these examples help you learn Flex faster than I did.

The best resources I found, in a variety of media:

Books

These were the top 3 books recommended over and over again by the Usenet groups I follow.

1. Programming Flex 3: The Comprehensive Guide to Creating Rich Internet Applications with Adobe Flex [link]
2. Essential ActionScript 3.0 [link]
3. Programming Flash Communication Server [link]

Web

Documentation

If you have a project already in mind and understand object oriented code, you may want to jump right in with your idea.

1. Flex 3 docs [html | pdf]
2. ActionScript 3 docs [html | pdf]
3. Flash Media Server 3 docs [html | pdf]
4. Flash Media Server 3.5 docs [html | pdf]

Video Tutorials

While Lynda.com has been a great resource for learning Flex, these free video tutorials have proven just as handy:

1. Learn Flex in a Week [video tutorials]
2. Flash 411: Getting your video questions answered [video tutorials]

Sample Apps

Sometimes the best way to learn a new concept is to just jump right in and get your hands dirty. These sample applications are small, simple and great examples of the potential behind RIAs. Although the first one is created in Flash, it can be done in Flex, too.

1. Building a Simple Live Video Broadcaster and Receiver [sample app]*
2. Creating a Simple RIA [sample app]

* As someone new to Flex, I thought the broadcaster/receiver idea would have been really useful as a sample Flex project, so I rebuilt this one in Flex and translated it from ActionScript 2 into ActionScript 3. I’ll make the .zip file available for download in the next post.

People

For those really complex questions that can’t be answered by a definition in the documentation or isn’t covered in the books, you can connect to a pool of professionals via e-mail:

1. Flex Coders
2. Flash Tiger
3. Flash Coders
   

Rich Internet Applications are popping up all over the web. When I first saw them, I thought, “I want to do that too!” I started from level 0 when learning how to use Flex and Flash Media Server to build RIAs, and I had a lot of questions:

• What is Flex?
• What makes the Flash Media Server so special?
• Why are developers using Flex & FMS to build their Rich Internet Applications?

Defining Flex

Flex is confusing. Like Flash, it can mean many different things, depending on the conversation. If you are familiar with the multiple meanings of “Flash,” it will help you understand “Flex.” As you are probably already aware, “Flash” can refer to:

1. the software – an IDE, such as Flash MX 2004
2. an animation or game built from the software – like homestarrunner.com
3. the .swf – the most common compiled file created by the software
4. the player – such as Flash Player 10, a web browser plug in

Its logic is driven by a script language called ActionScript. “Flex” can mean:

1. the software – an IDE, such as Flex Builder 3
2. the framework – the SDK, such as Flex SDK
3. Rich Internet Applications built from the software

Flex creates .swf files for the client, just like Flash. It uses Flash Player, just like Flash. Its logic is driven by ActionScript and can also incorporate a server-side language, such as Coldfusion, PHP or asp.NET.

The applications I develop for my company will use a symphony created from Flex, Flash Media Server, ActionScript 3 and asp.NET.

The Flash Media Server

FMS is a powerful tool that is simple to implement. If you want to manipulate online video and deliver it in an efficient manner without knowing much about video, FMS is a good, albeit expensive, answer. Dynamic video streaming and live streaming video with fast setup and use. Once FMS was installed it was easy to jump right in and begin adding stream-on-demand videos for our clients. The Flash Media Encoder allows you to start streaming live video with less than 5 minutes of time setting up the program. The major flaw of the Flash Media Encoder is that it supports Windows only- no Linux or Mac version of the software is available.

Rich Internet Application Development – Why FMS  and Flex?

FMS makes it easy to deploy video as well as coordinate any real-time tasks by using RTMP. Flex allows rapid prototype development thanks to the multitude of components and libraries available in the framework. Create your application in Flex, publish the resulting .swf file, have it coordinate with FMS for any real-time tasks you have, and voilà! you just produced: an online video chat, a live auction complete with audio, video and real-time bidding, or a live business presentation across countries.

For now, just another clean up project…mostly a running list and reminder to myself, so I know which sites have been touched and which ones have not. This week it was BJ Angus.

One of the major changes was adding the automatically updating pedigree tag to the animal pages, replacing the static pedigrees. The pedigree and EPD tags are Coldfusion includes, which generate the most recent info and builds the HTML for the page. Also, a little CSS brushed up the look and kept it from breaking the site design.

A short set of before and after snapshots:

From 8 a.m. to 4:30 p.m., I do updates. It’s dull work, but I’m grateful nonetheless. It’s become dull because there are only 15 sites left that need migrated from GoLive to Dreamweaver and 5 of them won’t count, since I plan on rebuilding them anyway. I stick to the daily grind because of an agreement with Rich: if I want to work on projects during busy season, I have to do updates during regular hours and the fun projects during overtime hours. I have to admit, it’s a nice managerial trick to keeping me focused and motivated to do what I have to do.

So why do I look forward to after hours work? Because we just bought Flex Builder 3
and four new technical manuals (full disclosure: these are my affiliate links). For the past three weeks I have taken a crash course in Rich Internet Application development in the form of MXML, ActionScript 3, XML and Flex Builder 3. So far I have figured out how to use MXML to create a static video player and a streaming video player. I tried to extend what I learned and connect an HSlider component to a Video Display method to create a scrub bar, but wasn’t successful.

Moving on, I’m another step closer to creating a web-based Flash Media Encoder. Currently it’s a free app available from Adobe for Windows XP/Vista only – with no Mac support, which is why I am building my own. I have built a small receiver, so users can watch a live stream that we broadcast out. It’s for learning and testing purposes only, so there aren’t any regular live streams happening. Next I’ll be working on building the broadcaster. Just getting the broadcaster to RUN is my first goal. Beyond that, I’ll work on auto-detecting bandwidth levels, error/exception handling, and handling multiple requests for the live stream.

The main goal is to have a functional prototype ready to use during the National Junior Angus Show. So my first big project due date is Sunday, July 19. I hope I can meet the deadline!

complete with a snapshot of the scary code Front Page generates:

We had a clean version of the Wardens Farm logo on file, so I plugged it into PhotoShop and created a design file. Here is the reinterpreted design:

Although I still don’t consider myself a web designer, I do push my limitations and improve my design skills as often as possible. I focused on the typography, since my color palette and design element choices were pretty limited. As for the code, Dreamweaver does a much better job generating clean HTML (well, compared to Front Page anyway):

This was of the fastest and most enjoyable clean-up projects I have worked on in a while.

It’s been a while since I’ve experienced one this bad. You know what I’m referring to: FTP account refuses to connect, the network connection to the local Mac servers are down, the Internet connection is down and every other possible connection the computer tries to make is refused. Half my programs crash and I’m forced to restart my computer not once, but twice in the same hour. And yes, my FTP connection, Internet connection and Mac server connections are all on separate network lines. I have never seen all three down at the same time.

Today, it seems like everything I touch turns to crap. I completely updated one website, spent a couple of hours on it, in fact…only to discover it needs a complete rebuild because it was a takeover site and is not up to snuff with our coding standards. I updated another site, only to find an irreversible error on a few key pages, rendering the entire site useless and also needing rebuilt from the ground up. Granted, most of the sites we manage are small. An average site will take me 4-5 hours to rebuild, unless the design is extravagant. But still, I wish I didn’t have to rebuild it at all!

Reboot your brain

On days like this, when I feel like I have lost my flow, I have to stop. No, really. I mean it. Just stop. Some of the more woo-woo types out there would call it “centering oneself.” Whatever you prefer to call it is fine with me. To regain my focus and find my lost confidence, I pick up something to read. I clear my screen except for the article I’m reading. No other open windows, no other open programs. Nothing else to tempt me away or compete for my attention.

Sometimes I choose an inspirational read, sometimes it’s anything not related to work. I choose a long article or a few that will last approximately 45 minutes to an hour to read and I set aside everything else. When I’m done reading, I feel a bit more relaxed, mentally refreshed and ready to start again. It’s a wonderfully non-self-destructive way to cope with stress.

How do you reboot your brain?