What’s New in the 3rd Quarter 2012 Update for Adobe Muse
Like this article? We recommend
Like this article? We recommend
Like this article? We recommend
As promised, Adobe Muse (see Figure 1) is updating its product soon after its release. Muse has some major new features such as adding forms capabilities, integration with Adobe Edge, guides, an Align panel, FTP upload within the program, and much more. The Muse team has been listening to the design community and their suggested improvements, as well as those that they had already planned on, and set the bar high for future updates.
)
Figure 1 Adobe Muse
The following is a short list of the new and improved features found in Adobe Muse 3rd quarter update for 2012:
- Forms (new)
- Adobe Edge Integration (new)
- Guides and Align panel (new)
- Asset Upload (new)
- FTP Upload (new)
- Usability improvements
- Sitemap.xml
- Other improvements
Forms (Business Catalyst Integration)
For the first update release after the initial launch, adding drag and drop forms capabilities is a big move. One caveat, though—to use the forms in your site, you need to host with Adobe Business Catalyst. If that is the case, adding a form and editing it is made easy. The form data is sent as an email to your account email address with a simple webBasics account.
Two forms are located in the Widgets Library panel: a Longer Contact and Shorter Contact form. These forms are widgets, so they behave much like other widgets in that you can drag them onto your page, change the widget options, and make visual changes as you see fit. Here’s a quick run-down of some of the things you can do with a form in Muse:
- Open the Widgets Library panel.
- Click the Forms category and drag one of the form widgets onto a page in your site (we dragged the Simple Contact form out), as shown in Figure 2.
- With the form selected—you can tell it’s selected because it shows “Form” in the Control panel—click the blue circle with the white arrow in the upper-right corner of the form to show the form options (see Figure 3).
- The form options that you can change range from the name of the form, to whom the form data is emailed, and which form fields appear.
- With the Selection tool and the form selected, click to select one of the form fields. You can set individual field options by clicking the blue circle with the white arrow (such as being required), delete or move the field, and change the formatting options.
- Click Preview and fill out the form. You will see that the form uses jQuery-type validation to indicate required fields if a field is not filled out properly after you click Submit (see Figure 4).
)
Figure 2 Drag out a form
)
Figure 3 Form options
){kind=link}
)
Figure 4 Form validation while testing
Adobe Edge Integration
This next new feature is one of my favorites. Adobe Edge, which is currently still in public beta, allows you to create web animations without the use of Adobe Flash. The secret is in the HTML, CSS, and JavaScript that it uses. You can now export from Adobe Edge and place the exported content into your Muse pages to add some really cool interactive animation (and more).
Here’s the generic workflow for inserting Edge content into Muse:
- In Adobe Edge, after creating your content, choose File > Publish Settings. In the Publish Settings dialog box, deselect Web and select InDesign/DPS (maybe someday we will see a Muse option), as shown in Figure 5.
- You can set publish options such as directory, name, and if there is a poster (initial) image from your assets. Click Save.
- Choose File > Publish. This creates an .OAM file that contains the necessary content.
- Back in Adobe Muse, choose File > Place. Locate the .OAM file and place it.
)
Figure 5 Publish content from Adobe Edge for Adobe Muse
You can then test out the page to see your Edge content. If you need to replace the content, you can edit the content in Adobe Edge, re-publish, and then update the link in the Assets panel in Muse.
Guides and Align panel
While having guides and an Align panel may not be the sexiest new features, they are more than welcome. When most of us began using Muse for the first time, these two things were one of the most complained-about options that were missing in Muse. Well, they’re here.
The guides in Muse work just as they do in other Adobe apps, such as InDesign. You can drag them from the rulers (View > Show Rulers if hidden). The measurement label (tooltip) appears indicating their exact position (see Figure 6). A selected guide (blue) can be adjusted by dragging or changing the X or Y value in the Transform or Control panel. To delete a guide, simply click to select it (it should then be blue), and press Delete or Backspace.
)
Figure 6 Drag a guide onto a page in Muse
In order to work with the Align options, you will either open the Align panel, or if your screen size is large enough, access the align options in the Control panel.
- Choose Window > Align.
- Select one or more objects on the page in Muse with the Selection tool.
- Choose an align option in the Align panel (see Figure 7). If your screen size is large enough, you can also click the word “Align” in the Control panel to access the align options.
)
Figure 7 The Align panel in Adobe Muse
In Muse, you can align objects to each other or to the content area. Choosing either Align to Selection or Align to Content Area from the Align To menu before aligning can change what the content aligns to.
Asset Upload
Muse now includes an option to place an asset (example PDF file, .zip file, .dmg or .exe) so that it can be hyperlinked on the page and downloaded from the website. All placed downloadable assets will be uploaded/exported along with the rest of the Muse site (see Figure 8).
)
Figure 8 Create a link to an asset (example .PDF or .zip)
FTP Upload
One of my favorite new features is useful if you plan to host the site somewhere besides Adobe Business Catalyst. Muse now allows you to export and upload to web hosting providers directly from within Muse by selecting File > Upload to FTP Host (see Figure 9).
You need to have a hosting account with another provider and the typical information for that account such as domain name, username, password, FTP host, and Host directory.
)
Figure 9 Upload to another host via FTP within Muse
Usability (UI) Improvements
You will discover boatloads of usability improvements that are hidden throughout the program. This list includes a few of them:
- Descriptions of page elements (example: text container, widget part) now shows when you hover over elements on the page.
- Groups and widgets are now indicated with dotted line containment rectangles.
- Additional controls have been added to the Control panel: Transform, Text controls, and Align.
- The Control panel now reports states for pages and objects and shows a drop-down of states applied to that object (see Figure 10).
- Preferences (Adobe Muse > Preferences) now allows you to turn off hint label/tooltip.
- Publish has an FAQ link to help users understand the publishing (see Figure 11).
- Drag and drop styles/swatches/colors. For instance, you can drag a Paragraph or Character style onto a text frame to apply it to the text.
- Feedback was added to the measurement label so you see the angle next to the cursor as you rotate (see Figure 12).
)
Figure 10 States in the Control panel
)
Figure 11 The FAQ link in the Publish dialog box
)
Figure 12 Cursor feedback for rotation
Sitemap.xml
Muse now creates a sitemap.xml file for better search engine optimization when the site is exported and hosted somewhere other than Business Catalyst. While this may not be very interesting to most of us, and you may actually never touch this XML file, it can be helpful when trying to optimize your site for search engine rankings (see Figure 13).
)
Figure 13 The sitemap that is generated (not for the faint of heart)
Other Improvements
Many other improvements throughout the program didn’t really fit into other categories, so I lumped them together here. The following is not a complete listing by any means, but these are the options that I felt made more sense to bring to your attention.
Add Files for Upload:
- This is going to seem like an odd addition, but it is very welcome in my camp. Suppose that you had a cool slideshow that you found on the web and you copied the code and inserted it into your Muse page. But you later found that the slideshow required some other files like images and JavaScript. In the past, it was rough to upload that content when hosting with Business Catalyst. Now, by choosing File > Add Files for Upload, you can tell Adobe Muse to upload those other files as well. The files will be listed in the Assets panel.
Widgets:
- Shuffle is now an option for the Slideshow and Composition widgets.
- You can now define fractional seconds in the Autoplay duration field (example .1 or .5 of a second) for Slideshow and Composition widgets.
Text/Formatting:
- Shift-return creates line break (<br>) instead of a hard return in a block of text.
- The font drop-down menu in the Control panel and the Text panel now includes a preview of the word "Sample" in the font.
- Muse automatically generates a list of recently used fonts. You can define the number of fonts to display (from 0 to 50; the default is 10) in the Preferences dialog.
- You can now see a multi-face family preview in sub-menus.
- You can now filter the Font list by typing any partial aspect of the font name.
- The overall font menu has been flattened into a single navigable font menu.
)
Figure 14 The Font menu got an overhaul
Other:
- The Browser Fill drop-down now supports gradients.
- You can now define a Background Browser image with options to scale according to browser size (fit or fill).
Final Thoughts
As you can see, the first update to Muse is a pretty big one. There are some major new features such as forms and guides, as well as numerous improvements to the program. With program updates coming fast and furious, compared to Creative Suite launches, Adobe Muse will be in braces and driving soon enough.
To learn more about the new and improved features in Adobe Muse, visit the Adobe Muse website.