logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
Houseplants
Romance Movies
Creativity
Family Travel
Southwest USA
Irish Culture
Home Finance


dailyclick
All times in EST

Clairvoyance: 08:00 PM

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

Flash Catalyst The Workspace


In our portfolio project, we have created the graphics for our portfolio interface in PhotoshopR and imported the PSD file into AdobeR FlashR CatalystTM. Now, we are ready to make the buttons (called interactive components) that will make the portfolio navigational. Open your PortfolioLayout.psd file into Catalyst and let's take a look around. At first glance, you will see that the workspace is not as intimidating as the Flash workspace.

The top is the Pages/States panel is where you will find a thumbnail for each page of our project. Right now, we have one page with the first logo visible. But in order for us to display the other two logos in the portfolio, we will need to create two more pages (States).

Under the Pages/Stages panel is the view of our project, called the Artboard, and under that is the Timelines panel. Those of you familiar with Flash will notice that the Timeline is somewhat different in Catalyst. As you can see from the State Transitions and Action Sequences tabs, we still use the Timeline to control what happens but the Timeline does not have those familiar Keyframes. This is because Catalyst makes most of the decisions about what happens for us as we add the UI components.

On the right, we have the Tools panel and icons similar to all the Adobe software. Under that, we have the Layers panel. It works much like the Photoshop and IllustratorR Layers panels and not like layers in Flash, which are part of the Timeline.

Next, we have the Wireframe Components, Library and Design-Time Data panels. Click on the Library tab and you will see a list of the graphics and styles from our imported PSD file. Go back to the Wireframe Components panel. This is the panel that contains all the components that we can add to our project. They are called "Wireframe" because these components are "bare bones". They are meant to be added to our imported graphics to make visual-based components.

The Properties panel in Catalyst is like the Properties panel in Flash. As you select an object in our project, the editable properties of that object are displayed in this panel. As we work on our navigation for this project, we will be introduce to a new panel in Catalyst called the HUD. Right now, it is that grayed-out tab entitled "No Selection". Once we begin to work, it will expand to give us the controls we need, based on the active object.

Finally, for those curious types, we can switch from the default Design workspace to the Code workspace. Just click Window Code Workspace in the Menubar. As you can see, it looks much like the Flash Actions panel but instead of ActionScript we see the MXML code that Catalyst is generating in the background as we work.


Join us in the Flash forum.




Add Flash+Catalyst+%96+The+Workspace to Twitter Add Flash+Catalyst+%96+The+Workspace to Facebook Add Flash+Catalyst+%96+The+Workspace to MySpace Add Flash+Catalyst+%96+The+Workspace to Del.icio.us Digg Flash+Catalyst+%96+The+Workspace Add Flash+Catalyst+%96+The+Workspace to Yahoo My Web Add Flash+Catalyst+%96+The+Workspace to Google Bookmarks Add Flash+Catalyst+%96+The+Workspace to Stumbleupon Add Flash+Catalyst+%96+The+Workspace to Reddit



 



RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map


For FREE email updates, subscribe to the Flash and Animation Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2014 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

g


g features
Add Static Text To Craft Product Trailer Template

Drop Zones and Transitions in Motion 5

Craft Product Template - Background Layer

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2014 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor