Catalyst is primarily intended to be middleware (that is, a program that exists as a sort of bridge between design programs such as Illustrator and development applications such as Flash Builder). It is not intended to be a tool that you can use to design completed projects.
However, in certain specific scenarios, you can export the completed project to run directly in Flash Player. In particular, projects that do not require server-side data connections or complex actions may be created completely in Catalyst.
Catalyst projects are saved as FXP files, but Flash Player can only work with SWFs. Thus, you will need to specifically publish the project as a SWF in order to run it directly. Choose File
You can also choose to make the project accessible, build deployable and redistributable versions, an AIR version, and embed fonts.
Note
See Chapter 18 for more details on working with AIR. Other options for deployable and redistributable projects and on embedding fonts are covered later in this chapter.
When you select the Publish as SWF option in Catalyst, it creates a folder at the specified location on your computer, using the project name as the folder name. Assuming that both the Build deployable version and Build redistributable version options were selected in the Export dialog box, this folder will contain two folders: deploy-to-web and run-local. Both folders contain a similar set of files, as described in Table 17.1.
Table 17.1. Files and Folders Created When Publishing to SWF
Description | |
|---|---|
| This folder contains links to multimedia files from the project, such as music or video. |
| This folder contains several files to implement history management; that is, to get the browser's Back and Next buttons to work for the user as would be expected when navigating the project. |
| A Cascading Style Sheets document that describes the visual layout of the HTML page into which the SWF will be embedded. |
| The HTML file into which the SWF is embedded. |
| The actual SWF file of the project. |
| Catalyst projects require Flash Player 10 or later to run. The SWFObject JavaScript library includes player version detection and uses this SWF to prompt the user to upgrade his version of Flash Player if needed. |
| All Adobe products that embed Flash movies into Web pages use the open-source SWFObject JavaScript library to handle the embedding of the SWF, overcome browser differences, and manage Flash Player version detection. All of the necessary JavaScript code to implement SWFObject is contained in this file. |
All of the files referenced in Table 17.1 are available in both the deploy-to-web and run-local folders. The deploy-to-web folder contains a few additional files:
framework_4.0.0.10485.swz, rpc_4.0.0.10485.swzspark_4.0.0.10485.swztextLayout_4.0.0.10485.swz.
Each of these files contains Flex runtime shared libraries.
In order to keep the overall size of Flash Player small, not all of the classes for the entire Flex framework are included in Flash Player. Rather, these class definitions are embedded and installed into each Flex application. While this helps to keep Flash Player small, it also increases the size of each Flex application.
Runtime shared libraries are the recommended solution to this issue. These libraries contain commonly used Flex classes that can possibly be used by more than one application. A user can download these libraries the first time he encounters a project that needs them. Flash Player then stores the libraries locally, and subsequent projects that rely on the same libraries can simply use the local version.
Every SWF created by Catalyst will contain these libraries. All projects created by the program, including those created by other developers, will be able to use these libraries from local copies. The difference these libraries make can be seen by comparing the file size of the Main.swf file in the deploy-to-web folder and the run-local folder. The former uses the libraries and will be considerably smaller than the later which does not.
Font handling has long been one of the weakest links in Web development. HTML pages generally rely on device fonts, meaning that the HTML or CSS document can specify that a particular font be used on a page. However, the font will only be rendered if the user has that font installed on his or her system.
While this limitation is slowly changing for HTML, the tools in the Flash platform (including Flash Professional, Flex, and now Catalyst) have never used device fonts by default and have instead always relied on embedded fonts. Therefore, while traditional HTML designers may be limited to three or four common fonts, Flash platform designers are able to use any font they want in their projects.
Unfortunately, the freedom to use any font in your design comes at a price; embedded fonts increase the size of the final SWF file. The designer should carefully consider whether to embed the fonts or if limiting typographical choices to a few common fonts such as Arial and Times New Roman is okay, thus saving space. By default, Catalyst will not embed fonts. Instead, you must select the option in the Publish to SWF dialog box.
Once you have published the project, you need to upload it to the Web for others to access it. To do this, you need to transfer the files created by Catalyst to a Web server using an FTP program. If you are an experienced Web designer, you should have no issues with this process as the steps are identical to what you would normally do.
In order to put your project online, follow these steps:
Set up an account with a Web host. There are thousands of hosts available online, with prices ranging from free to hundreds or even thousands of dollars per month. By definition, if you are publishing your project directly from Catalyst and not exporting it to Flash Builder, your project will not require any server-side programming. Therefore, most basic, and thus free or very inexpensive, hosting plans will be sufficient for your needs.
Select an FTP application to do the actual uploading of the files. Both Windows and Macintosh have basic FTP applications built in, but many other applications exist on the market as well. If you have purchased Flash Catalyst as part of one of the Creative Suite packages, you will also have Adobe Dreamweaver, which includes FTP functionality (see Figure 17.2). While the specifics of uploading files via FTP vary from one application to the next, in general they all follow the same basic idea.
Establish a connection to the FTP's server, using credentials provided by your hosting company. Once connected, most FTP programs display the files and folders on the server in one half of the window and files on your local machine in the other half Figure 17.3.
You can generally simply drag files from the local side to the server side to upload.
Upload all of the files and folders in the
deploy-to-webfolder, although likely not the folder itself. The files can be uploaded into any directory under your server's Web root.Make sure that you keep all of the path directories the similar to one another. In other words, make sure that the files
Main.css, Main.html, Main.swf, andswfobject.jsalong with the assets and history folders remain in a single directory with one another.
