Author Archive

With a little less than a month until 360|Flex I thought I would sit down and write a long over due post about the conference.  360|Flex is known in the community as one of those “hard core” conferences where the expectation is to leave sessions with your Flex and Flash IQ increased by a couple digits.

Unfortunately until now, James and I have had to experience the conference through other people’s stories.  For some reason or another the last few years have been pretty hectic, but we made it a mission in 2010 to attend and speak at more events, with 360|Flex being the first on the list.

Session
In our session “Flex 4 Component LifeCycle Best Practices” our goal is to walk folks through the three stages of the Flex lifecycle (birth, mature, death) and discuss what methods can be used to help build efficient and high performance Flex applications following that Flex component design methodology. With the reengineering of the skinning architecture in Flex 4, a few methods have been introduced and others have been more or less deprecated in importance. We will discuss these changes in detail and how you will want to change your development practices. We are extremely excited to share our year long research that began with our widely popular white paper on the Flex 3 lifecycle. Soon after the conference and session, we plan on updating the paper to Flex 4 and will share it with the community.

Attending
As much of an honor it is to speak at 360|Flex what is really exciting us is attending some of the other session and diving deeper into topics we have not had the time to investigate. James and I have been debating our schedule for a few weeks now so far we have compiled a “must-see” list that we have listed below to share with everyone.

Aaron & James’ Must See!

Going deep w/OSMF - OMG!
Level 300
By David Hassoun

RobotLegs on Top of Gaia Flash Framework
Level 100
By Jesse Warden

Building Applications using Test Driven Development (TDD)
By Elad Elrom

Dramatic Effect of Flex Library Linkage
Level 300
By Yakov Fai

Reflex: Rethinking Component Design
Level 300
By Jacob and Tyler Wright

Social Activity
We will be both tweeting as much as we can from the conference and sessions. Hit us up if you would like to discuss our session or any other session in more details. We love meeting new techies!

Aaron Pedersen - @aaronpedersen
James Polanco - @jamespolanco

Also don’t forget to follow 360|Flex for news and updates as we approach the and throughout the conference.

360|Flex - @360flex

Wrap Up
If you are thinking about attending 360|Flex you should book your tickets soon. Last time the conference was held in San Jose it was sold out. This year the conference has parties every night giving you a chance to mingle with the community at large. There are over 40 sessions, 2 panels, and your ticket includes hands on training sessions for all levels on the Sunday before the conference begins. Also, if you are new to Flex, you can take an all day Flex 101 course (one of the hands on training sessions) and be ready for regular sessions on Monday.

Speakers include a wide assortment of Adobe engineers and communities leaders. For a full list check out the following site http://www.360flex.com/blog/category/the-speakers.

Register here. We hope to see you there!

We are happy to announce the release of Adobe’s newest application: WorkflowLab (public Alpha release). WorkflowLab was built by DevelopmentArc for Adobe and was designed, developed and deployed in under 6 weeks.  This new AIR application allows users to view and construct project workflows to demonstrate how their products, applications, and/or technologies are built using Adobe Technologies. The tool allows user to define project tasks and assign Adobe tools and technologies to those tasks to help illustrate how Adobe’s products and services assisted in completing the project. Inside of the tool Adobe has provided a core set of workflow starting points that can be used to help guide the workflow of new project or as a starting point for your own workflow. Download it here.

Development Process and Technologies

WorkflowLab was built using Adobe’s soon to be released Flex 4 SDK, Flash Builder, and Flash Catalyst technologies.  Taking advantage of the new Flex 4 skinning Component Architecture, DevelopmentArc was able to skin almost all of the application’s components using FXG (MXMLG).  In an upcoming Adobe Developer Center article we will walk you through the entire process from start to finish on how we planned, designed and developed WorkflowLab using these new technologies.

We were lucky to be joined on this project with Chris Stone (http://twitter.com/stony) out of Vancouver BC. Chris is one of the most talented UX designs we have had the privilege to work with. For the project Chris leveraged Adobe InDesign for user workflows and wireframes and Adobe Illustrator for all design comps. I can proudly state that Chris has some of the cleanest design assets out there. Having lean and organized Illustrator files is going to be a key trait of Flex/Flash projects moving forward as Flash Catalyst become a more integral part of the designer/developer workflow. A detailed explanation of how design was part of the overall product workflow is explained in the ADC article linked above.

Community Collaboration

Also launched today is an Adobe Cookbooks site dedicated to WorkflowLab. The site allows user to share their workflows with the community. We encourage you to download Workflow lab, create a new workflow or extend a Workflow Starting Point and share it with the community. There are so many ways to “skin a cat” the more we share the better off our lives will be as developers, designs, product managers, and executives. Start sharing your workflow recipes here.

This year James and I will be involved in three separate sessions at the Adobe Max conference in LA.   Adobe Max provides a collaborative arena for the communities of designers, developers, project managers, executives and any other project participators to gather and  share ideas, real-life experiences, theories, secrets, and best practices.  Over the past year DevelopmentArc has been involved in a wide variety of projects and we are excited to share our  experience with the community the best we can.   Below is breakdown of the three sessions we are involved in. Two involve a secret (shhhh) project that is to be released next Monday.  Follow James (@jamespolanco) or I (@aaronpedersen) on twitter and we will share as soon as we can.

Delivering Successful Flash Platform Projects (Monday, Oct 5th 11:30am - #adobemax181)

In this session we will be joined by co-author Doug Winnie of Adobe to discuss how during any project the planning phase is often times the most over looked and in most cases the most valuable.  We take you through a fictitious story of two companies as they collaborate on a project.  We plan to highlight exactly why planning when not overlooked, can start a project off on the right foot and actually cost the development team less time, money and resources to complete.

Workflows for the Flash Platform (Monday, Oct 5th 5pm - #adobemax286)

We are joining Doug Winnie again to discuss Flash Platform Workflows. Doug is an expert on the subject and spends most of his days working with various product teams within Adobe trying to enhance the workflow process between applications.  Doug will breakdown the workflow process and demonstrate some very cool and new technologies.

Bird of a Feather (Wednesday, Oct 7th 12:oopm - 1:30pm)

Again joining Mr. Winnie, James and I will be sharing our experiences with whom ever will listen.  We will explain, answer questions about the workflow we used in developing the secret application using Adobe’s soon-to-be released Flex 4 SDK, Flash Builder 4, and Flash Catalyst technologies.  The project had a quick turn around and a small team.  Because of these constraints we employed a modified workflow that leverages Flex 4’s Spark Skinning Architecture along with an unconventional use of Flash Catalyst to enhance a developer-drive workflow. Come by and say hi.

We are proud to announce that Yahoo! with DevelopmentArc assistance launched an enhanced Yahoo! Mail Flickr application.  The updated application built for the new Yahoo! Mail interface allows users to quickly view and share photos stored on Flickr, directly within the mail interface. A user can login and view their own photos and/or view those available to the public. With three clicks, users can construct an email and share a photo or set with friends and family

DevelopmentArc was responsible for enhancing the Flickr 1.0 application by developing and integrating a customized localization system to enable Yahoo! to provide different languages for the application. The new application now supports 7 locales including; English Australia, English United Kingdom, English United States, Spanish Mexico, Portuguese Brazil, Chinese (traditional) Taiwan, and Chinese (traditional) Hong Kong.

As well as localizing the application, new features were added  such as the ability for users to view and share their photo sets. Images will give users information about who took the picture and other details. The layout was extended to use a tab view instead of a smaller dialog. When a user resizes the window, the photo viewport now expands and collapses to give them more columns of photos. No longer will users with 30’ Mac monitors suffer the same fate of 1024×768 resolution users.

If you are using the New Yahoo! Mail (not Classic view) install the application and start sharing some photos.  We hope you enjoy the enhancements!

The second of our five part series focusing on Flash Catalyst has been released on Peachpit.com blog.  In this post we focus on where Flash Catalyst fits inside of the larger Adobe Flash Platform.  We review the upcoming changes to Flex 4 that were required to facilitate Catalyst and the workflow it brings to the Platform. For the designer, Flash Catalyst has long been sought  to help extend their static design vision into the world of interactive features. We explore this new workflow as well.   Read the post here

Problem

In many large projects Flex applications are broken into sub-components to help manage size, loading, content updates, etc. The are multiple ways of breaking a project into sub-components such as using  Flex modules,  building sub-Flex applications that are loaded by the parent application, creating external ActionScript 3 only projects or they may be developed using Flash Professional.   The reason for this architectural decision is based on the nature of the project at hand and the experience of the team building the application.

In large projects, breaking the application into testable parts might be wise.  It also can allow for distributed teams participating in the development process to work together.  Also, if a project is animation and graphical rich, Flash Professional is likely the creation tool for those parts of the application.  To integrate these sub-components into the Flex application, they are most likely loaded via SWFLoaders.  Once loaded into the application domain, the assets can be controlled by the main application.  This is where problems can begin.

Since these sub-application and assets were tested outside of the main application conflict issues do not arise until all of the final pieces are integrated together.  One such problem is the dreaded runtime error “Property [property name] not found on [Class] and there is no default value.”

Recently I was asked to debug a client application (we did not initially develop this app), that was throwing this error intermittently.  I struggled for about two hours before I found a pattern in the application and sub-application code base.  The pattern was a common package naming structure.  Each sub-application had the same package structure and some of its classes were named the same. However, the same named classes had a different set of public methods (API).  Now, these same named classes were internal to the sub-application (not declared on the parent app) but this error was still being thrown intermittently at runtime.

Here is an example of the two matching packages with different APIs:

Project A

Project B

The problem was, when a  sub-application was loaded into the application, the previous sup-application was not fully unloaded and it’s BaseComponet class was being retrieved from memory instead of the new BaseComponent that was just loaded. At this point the new app is expecting a certain API yet it’s not there, causing the error I outlined above.  This only happens in certain cases (I can’t explicitly define the load order, it just happened when rapidly clicking around loading and unloading applications). But, if the main application also has a BaseComponent declared under the same package structure, this problem will be visible every time. The sub-application’s version is ignored and the error above will happen the first time the sub-application is loaded because the parent instance will always be used.

Main Application

Solution

The solution is simple.  Make sure each project has a unique package structure or define a standard Interface that is used across the entire application and sub-applications. To solve this problem in an existing application is just add the project name after “developmentarc” making the structure unique per application.

Project A

Project B

Main Application

The hard part about the solution is communication. On large teams, this is a topic that needs to be tackled during the planning or architecture phase of a project, not post-development.  Try coming up with a standard package pattern that all members can follow. This can be included with Coding Standards or with other development team guidelines as a project kicks off.   The longer a team waits to tackle collaboration issues like this, the harder it is to change. Refactoring a 100+ projects can be very time consuming and at the end of a project, developers have more important issues to resolve other than a large scale refactor.

Day four brought us beautiful weather for the first time at SXSW so far.  The sun was out and made our adventure to the BBQ Crash Course that much better.

• To start the day off, Aaron hit up Finance 2.0 to discover solutions that help the computer nerd save/conserve money in this turbulent economy.  The panel was guided by Stessa Cohen of Gartner whose analyizes the space of social finance.  The panel itself consisted of small business finance blogger Nichelle Stephens (Keeping Nickels), Murali Subbarao CEO of Billeo Inc, Aaron Patzer CEO/Founder of Mint.com, and Michael Ferrari Co-founder of SmartyPig.  The main theme out of the session was to find solutions that meet your individual needs while freeing up time in our busy lives.Mint.com offers a quick and easy solution to gain insight into your personal finance. Where does all that money go? Find out at Mint.com. A note from Mint, their service is read-only, so even if someone gains access to your Mint.com site, they can not drain your accounts.

  SmartyPig offers a saving account alternative solution that allows you to visualize your goals of your savings. If you really want that shiny red bike, open a savings account at SmartyPig and share your goal with your family and friends. They can see your progress and SmartyPig even allows them to contribute toward your goal. Forget that sweater for Christmas, grandma can now add that 10 dollars toward your new bike. SmartyPig offers one of the highest savings rate on the market.

  Billeo offers a smart wallet that helps pay your bills online at the company website, through a private wallet that is attached to your browser (plug-in).  Billeo also allows for faster shopping through many of it’s affiliates.  Auto form filling, including credit cards, speeds you through the checkout process.  Access reports and analysis your shopping habits and your monthly bills.  If you need to make a rush payment, Billeo provides bill pay directly at the company’s website, allowing for those late payments to be processed ASAP without the extra fee most banks charge.

  And lastly Nichelle offers a blog, Keeping Nickels, that provides tips on how to save, invest for personal finance. A great blog, for the money conscious  geek.

• James headed to “Beyond Aggregation — Finding the Web’s best content”.  The panelist included Marshall Kirkpatrick (VP Content Dev, ReadWriteWeb), Louis Gray (Author/Publisher, louisgray.com), Gabe Rivera (Founder/CEO, Techmeme), Melanie Baker (Community Mgr, PostRank.com), Micah Baldwin (VP Business Dev, Lijit Networks Inc).  The panel focused on how they use tools, search engines, grease monkey scripts, Del.icio.us and other social media services to track down new and interesting content.  One of the most interesting ways of tracking down new content that Marshall Kirkpatrick talked about was a process they are using at ReadWriteWeb.  They are currently going back through their top news stories, they then use Del.ic.ious to find out what users linked to the source content before ReadWriteWeb posted it. They then build a list of users that continue to find interesting data before ReadWriteWeb does and then subscribe to the user’s Del.icio.us feed.  It is a very interesting and smart use of mixed data sources to find leaders in the news aggregation field.
• Next up Aaron joined the Browser Wars (part III), which is a reoccurring panel at SXSW where the web browser gods battled each other and defended or dodged a series of fireballs thrown at them by panel moderator Arun Raganathan (now of Mozilla).  The panel was interesting from the standpoint of seeing first hand how each of these individuals mix with one another. Remember these are the same folks that collaborate to define the web specification such as ECMA-Script, and HTML 5.  It’s fair to say there was animosity but they played nice and no one got hurt. The foe of the panel was Chris Wilson “the IE guy” who is the main player for Microsoft in the specification groups.  Arun fired many of the  fireballs his way (they were not nice).  I was impressed with Chris and how he came off. I almost walked out of the session with IE as my default browser.A question that stuck with me was one pointed at Darin Fisher of Google, which asked why Chrome picked Webkit as the rendering engine. Darin’s answer was intriguing, they first looked and intended to use Gecko, but soon saw the superior rendering capabilities that Webkit provided. He also said Gecko is an application platform, so it’s large, bloated and does way more things than Chrome was going to do. Panel Members:
  Arun Ranganathan - Mozilla
  Darin Fisher - Google
  Chris Wilson - Web Platform Architect
  Charles McCathieNevile - Chief Standards Office, Opera Software
  Brendan Eich (CTO Mozilla Foundation and Creator of JavaScript)

  Other blogs with more content:
  http://www.appscout.com/2008/03/sxsw_browser_wars_become_brows.php

  Podcast

• While Aaron was at Browser Wars, James headed over to “Start-up Management: OMG I have to manage people?”.  It was hosted by two of the founders of Catster/Dogster: Steven Reading and John Vars.  They both have been part of multiple startups and they talked about the process of hiring new people (hire as slow as possible) and letting people go (fire as fast as you can).  They talked about how to handle layoffs, encouraging employees, and working as a small team that grows.  It was run in a town hall fashion, where most of the topics were based on the audience’s question.  It was a very good panel and James enjoyed hearing how other small companies are grown and managed.
• For both of us, the most anticipated event of the week was the BBQ Crash Course at Emo’s.  Emo’s brought together 7 of the best BBQ restaurants in Texas for an all you can eat BBQ ho-down  The name of the game was to unplug for a few minutes and eat as much as you can. We both we eager to participate and we quickly grabbed a couple beers and worked our way around the backyard, piling our plates with pork ribs from Artz Rib House, the most tender brisket either of us ever had from Snow’s (Aaron hopes his Father-in-law isn’t reading this), and amazing BBQ taco by Ranch 616.   While enjoying more than enough food, we got the chance to meet SXSW’s CTO Scott Wilcox.  Scott looked a little stressed and confirmed it when he told us he was on his second week of 14 hour days, dealing with the normal technical challenges anyone faces with trying to put on three conferences in one, with over 15,000 attendees (music, film, interactive), and over 1800 bands.  Scott, after chatting with us for a few minutes, quickly ran off to tackle another technical issue, no rest for the weary.  Big props to Scott for putting on such a great conference and for surviving 14 years of it! One of the nicest stories we heard was from Snow’s BBQ which was recently named the best Brisket in Texas. Before being crowned, Snow’s BBQ was a weekend hobby that produced a few 100 pounds of various BBQ for sale to locals on Saturday morning.  After the best brisket recognition, Snow’s still opens only on Saturdays, and yet consistently sells out of 3x (they dug 2 extra pits) of everything within two hours of opening. Most of the customer base is now tourists seeking out the best BBQ, with only a few locals. However, when a family member sees a local standing in the long lines, they quickly pull them out of line and take their order immediately. It’s good to see community is not sacrificed when success has been found. And for those that can’t travel down to Lexington, TX for a weekend, they ship all over the country, only on Tuesdays though. Below is a list of the rest of great BBQ joints and their website. Visit any of them and you will not be disappointed.  UPDATE: James is currently waiting for his first order from Snow’s.
  Snow’s - http://www.snowsbbq.com/
  Louie Mueller Barbecue - http://www.louiemuellerbarbecue.com/
  Ranch 616 - http://theranch616.com/
  The Country Line - http://www.countyline.com/
  Inman’s Ranch House BBQ - http://www.bbqtours.com/2000/2000inmans.htm
  Artz Rib House - http://www.artzribhouse.com/

• Wirefames  for the Wicked - was presented by some of the best information architects in the industry; Nick Finck (Blue Flavor), Donna Spencer (Maadmod), and Michael Angeles (Traction Software). The group walked through the various types of wireframes; reference zones, low/high fidelity, storyboards, standalone, specifications.   All the panelist had good things to say about each form and what the censunsus was is that the detail of the wireframe depends on the project, but a wireframe is very important step in the project lifecycle to help convey information architecture to a client (way before you spend all your time on design).  It’s also a contract that helps find and define the features of your project.  Choose the one that best serves you and your project.   A few programs recommend for wireframing were Visio (Donna’s tool), OmniGraffle (Michael has a great set of stencils that the panel recommended), and Axure (Aaron’s favorite) but it’s Windows only.  Here is a link to the slide on slide share. If you are a information architect or are engaged during this stage of the process we recommend you take a quick peek.
• While Aaron was checking out Wireframes, James headed over to catch Robert Rodriuez and Henry Selick talk about how they are using 3D in their movies.  They were not talking about 3D animation, but actual 3D projection in the theater.  Robert was the first director to bring 3D back into the theaters with his Spy Kids 3D movie.  Since then, we have seen a huge resurgence of 3D movies such as Henry Selick’s Coraline.  One of the coolest aspects of the panel was when Henry talked about how they shot Coraline in 3D.  The typical process is to have two cameras hooked to a single lens with a special mirror splitter to offset the images.  Yet, this was not possible because Coraline was all miniatures shot in stop-motion.  To achieve the 3D effect, take a single frame with the camera, move the camera to the 3D offset and take another frame.  These two frames where then overlaid digitally for the 3D projection.  Brilliant!

• The most amusing and mind boggling session of the week was Bruce Sterling’s talk. We sprinted as fast as we could to get prime seats and it was well worth it.  Joining us front and center was our good friend Larry Gonzales (Eye-Fi).  Bruce is renowned for putting on a great presentation.  His insights into the tech world are deep, rich, spot-on and very very amusing.  He referred to us as the group formally known as the audience and delved into how technology such as the iPhone and Twitter have the potential to destroy the previous definition of interaction.  He teased (rightly so) that most of the audience was Twittering away as he presented.  He questioned if people where truly paying attention when they twittered.  To point this out he joking said some very rude/crude statements to jest with us about who would hear the comment correctly and who would just twitter “omg did you hear what Bruce said!” without full context.  Bruce then proceeded to open up bags of chips and eat them while he talked.  We have lost formality, if the audience doesn’t pay attention why should he, as the speaker, be civil?  It would be incorrect to state that Bruce is opposed to Social Media and the changes being wrought on society, but he is concerned that we may be losing things of value for the sake of progress.  Is all progress good?  Should we just open our arms and accept all that changes?  This is an issue that we in technology should keep in the back of our minds as we blindly adopt the newest and greatest thing.  Just because something is old or “outdated” does not mean it has lost its value.  It was truly a great presentation about the state of social media.
  

As promised, here is a more detailed breakdown of the “oooh That’s Clever” panel. This panel was presented by Paul Annett the creator of a very popular site that shows some cool CSS called  Silverback App. In this panel Mr. Annett explored a wide range of company trickery that gave customers a joyful surprise when discovered. The examples ranged from company logos, to secret message on the bottom of juice bottles (”stop looking at my bottom”), to website easter eggs. The idea behind the session was two folds. First to show designers (and developers, that’s me!) some creative “easter eggs” that inspire creativity. Second was to show how these little gems could help channel potential customers to your product or service through a viral “did you see this” pattern. Here is a list of as many examples as I could write down and/or research.

continue