Join Jim Babbage for an in-depth discussion in this video Importing pages, part of Fireworks CS5 Essential Training.
One of the other great things about Fireworks is the entire team can be involved in working on a single project. For example, I've got this five-page mockup here: index, mission, tourMain, tourSpecific and cycling. And I've just heard from my designer that they've completed the snowboarding tour page. So I want to insert this into this design before I preview it or turn it into a clickable mockup for the client to look at. And bringing a new page into a Fireworks design is actually pretty easy to do. I want to put this page at the very end of my pages, so I'm going to select cycling, and I'm going to choose File > Import, and I'm going to locate my completed snow page.
There it is there, okay. And you can see a little preview of it. If you look really closely, you can see that the only thing apparently missing is the navigation, and that's fine because we're going to share the navigation from other pages with this design. So I'm going to click Open, and we'll get a little Import dialog box popping up. Now this is an important step. You have to watch for this one. Throughout the course when we've imported graphics, we've put them onto the same page. In this particular case, I want this page to be imported on its own. So I have an option here that says Insert after current page, and I want to make sure that that is checked.
This tells Fireworks to generate a brand-new page for this content that's coming into the design. I'm going to click Insert and within a few seconds, Fireworks drops the page in, and you'll see down below cycling, we now have a new page called Page 1. Double-click on that and rename it snowboarding. There we go. And I want to add in my navigation. As you recall, we've got different navigation for some of the touring pages. We have some dropdown elements here. Some sub-level navigation, and I want to include that navigation with this specific page, and all I have got to do is go to a page that's currently sharing that information, and we'll see on the cycling page, there's my shared navigation in my Web layer, and there's my shared buttons, the actual graphics.
So I'm going to start by selecting my tour nav layer, going to my Options, choosing Share Layer To Pages and then adding snowboard to my list of pages to share that layer. When I click OK, I come back to my design. If I click on snowboarding, there's my navigation. Just like that, all the graphics in the same place. Now I also want to share the interactivity. If I'm going to turn this into a clickable prototype, I want to make sure that the client can actually click on things. So I'm going to go to my cycling page again. Go up to my shared navigation, the sublayer inside of my Web layer, and choose to Share that Layer To Pages.
And again, I'll just add my snowboarding page and click OK and if I go back to snowboarding, you'll see that indeed that element has been added. So this is a real time saver I think from my perspective. You can have multiple people working on the same project, and as they're completing their side of the job, they can hand things off to you, and you can insert them into one completed prototype for export as an HTML clickable prototype or a PDF file, whatever your preferences maybe.
- Customizing the workspace
- Working with pages, layers, and states
- Importing content
- Comparing bitmaps and vectors
- Creating and editing vector shapes
- Converting artwork into graphic, button, and animation symbols
- Animating in Fireworks
- Maintaining crisp text in web images
- Sharing content between pages
- Optimizing images for export
- Integrating with Device Central, Dreamweaver, Flash, and Flash Catalyst
Skill Level Beginner
1. The Workspace
2. Graphics 101
3. Working with Bitmap Images
4. Working with Vector Images
5. Working with Symbols
6. Animating in Fireworks
7. Working with Text
8. Exploring Creative Options
9. Rapid Prototyping
10. Working with Web Graphics
11. Fitting Fireworks into Your Design Workflow
Working with Bridge1m 36s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.