X

Adobe Muse: Creating sites out of thin AIR

Adobe debuts a site creation tool for design-oriented builders that just launched into a six-month public beta. We take a look at it.

Lori Grunin Senior Editor / Advice
I've been reviewing hardware and software, devising testing methodology and handed out buying advice for what seems like forever; I'm currently absorbed by computers and gaming hardware, but previously spent many years concentrating on cameras. I've also volunteered with a cat rescue for over 15 years doing adoptions, designing marketing materials, managing volunteers and, of course, photographing cats.
Expertise Photography, PCs and laptops, gaming and gaming accessories
Lori Grunin
7 min read

Lori Grunin/CNET

Adobe bills its newest Web design software, codenamed Muse, as coding-free site creation for InDesign and Illustrator users. And as far as the interface goes, the development team did a good job mimicking what it could from those applications using the lighter weight, far less mature AIR programming platform. But as I see it, in a market glutted with site creation tools for all levels of sophistication and budget, Muse looks like Adobe's first real chance to wrest designers away from using tools like Photoshop for designing and prototyping sites. However you plan to use Muse, it needs a lot more cooking before Adobe's ready to stick a fork in it. (Note: I try to distinguish beta bugs from what I consider architectural problems in my criticisms, but some frustration leakage may result in inappropriate attribution.)

Related links
Adobe debuts Muse, a no-code-required site builder
Adobe's new subscription model

Muse is split into four logical workflow task areas: Plan, Design, Preview, and Publish. In Plan, you build the structure of the site using a combination of hierarchical thumbnail org charts and "master" pages. I like the org chart metaphor for designing a site, and I think it's the way most people still think about a Web site: as a series of linked pages. It's also great for architecting on the fly if you're responsible for all the Web site content or if you're visualizing the site architecture with a client.

Adobe Muse's Plan view Lori Grunin/CNET

I also really like the concept of master pages as a way of dealing with repeated content. But the implementation is a lot more basic than I'd anticipated. It seems that to Muse, a master is really just a place to park page design elements you plan to use on multiple pages. It doesn't, for example, use them to group CSS that you plan to use repeatedly for a set of pages. Though you can define some tags to associate with the styles, you can't even redefine the default font or associate a default style with the p tag. In practice, that means that every new text box reverts to 14-point Arial. And when I exported my test site for publishing, there was a separate CSS file for every page and the global CSS was completely generic. It would also be really nice if I could take existing CSS and just paste it into a page header. But you don't have code access to any element that doesn't live in a body tag.

I also think the Masters are kind of unintelligent; you can duplicate them, but you're basically forking the design every time you do. On one hand, this is similar to the way they work in design software, but it's less of an issue in static documents than on a dynamic site that will require frequent updating. You have to plan your master strategy carefully, using a reductionist approach--first building the most complex, then deleting elements, duplicating that one and deleting, and so on. Furthermore, Muse goes so far to resist templates that it doesn't even provide basic page settings for different types of sites, such as optimal sizes for mobile display, or offer up some typical screen sizes. But it handles dynamic page sizing well, allowing you to easily pin page elements to a footer.

Design View Lori Grunin/CNET

The design interface is logical and should be nonthreatening to the code-phobic. It's got the usual assortment of tool palettes and features familiar to all Adobe Creative Suite users, including character, paragraph, and graphic styles, and color swatch palettes. The typography tools let you control character and line spacing and paragraph alignment. Unfortunately, there's no equivalent to Illustrator's Glyph palette for inserting nonstandard characters. There are some rudimentary fills--solid and gradient--with opacity, stroke, and corner controls, plus background image handling. There's text wrap with user-defined offsets, but I couldn't get that to work in my beta.

Bafflingly--and the company has done this before--Adobe leaves out align and distribute tools in this version. Somehow, early versions of Adobe software frequently drop this capability into the "nice to have" rather than "users will beat us with rulers in protest" bucket. The Smart Guides make up for that a bit, interactively displaying gaps between objects in pixels and lighting up when you're equidistant between to objects or aligned with another.

For basic interactive content and navigation, Adobe supplies some widgets (Spry and jQuery, if you care) which in their beta state still feel a bit glitchy to work with; for example, when trying to select widget "previous" and "next" text in one of the slideshow widgets, it instead goes to the previous or next image. The selection feels a bit thin, too. Still, they're mostly customizable. The biggest issue is that at least for the near term, Adobe will be the only source of those widgets; there's no framework in place for allowing third parties to write their own widgets, or to allow in-house developers to provide drop-in parts for the designers to use. Muse also has a States palette for defining Normal, Mouseover, Mousedown, and Active appearances, but in the beta at least it's really underdeveloped. You can't add more states, and you have to use a workaround (create a graphic style) to apply the state design to other objects.

Widget before customization Lori Grunin/CNET

If you want to add basic HTML, it's pretty easy as long as it is self contained--in other words, as long as it would normally go between the body tags. Anything grabbable can be added to a page using Insert HTML; I added a YouTube embed, Twitter follow button and stream, Facebook widget, and a Google map. You'll still need to know how to customize the colors via coding or diagnose errors, because Muse's code "editor" is just a basic text editor. (Ironically, the only code I couldn't successfully embed was a Flash SmugMug slideshow, which crashed the program.)

Widget after customization Lori Grunin/CNET

I think the biggest disappointment is the type handling. Adobe purposely limits the initial implementation to "exposing what's appropriate for the Web so far," which in this case means the typical set of Web-functional fonts and creating rasterized versions of any custom typography. There's no support for any type of Web fonts. For me, working with Web fonts is still one of the more confusing but desirable capabilities to evolve lately, and I think Adobe's really missing an opportunity here. To its credit, for unsafe type, Muse rasterizes it and automatically generates alt tags of the text so that it's SEO-friendly. But if any users want high-class typography tools, wouldn't it be this market?

Furthermore, according to Adobe, a large chunk of its InDesign users still have a print-first workflow. You'd think, then, that Muse would allow you to repurpose a lot of your InDesign work. Nope. At the very least, say, it would be lovely if it could map document styles, support cutting and pasting of formatted text, paste a logo, import a swatch palette...anything. Is it the fault of the Muse team that InDesign doesn't use the system clipboard and requires specific application support? No. But it is an Adobe problem.

As for Preview, it's just an embedded WebKit browser that renders individual pages. It's also a bit too stripped down; you can't preview navigation or go back.

What do you do with your site once it's done? You have two choices: export to HTML or publish directly to Adobe's Business Catalyst hosting. HTML export supports complete overwrite or incremental export. One of the nice things about the BC hosting is that you can publish 30-day free trial sites, which is a great way to run the design by other people. But given how confused most people are about how to get a site from their hard disk to the Web, this aspect of the program needs a lot of fleshing out.

The best part about Muse is that at various points I could actually forget I was doing Web design. And you can generate some attractive sites from it. But the code isn't very pretty. Dreamweaver doesn't exactly choke on it--it renders properly in Live View, but comes up a complete blank in Design view. That makes it less impressive as the prototyping solution I was hoping for, since you may still be better off just handing off flat images to someone to re-create in a coding tool.

Once it comes out of beta, Muse--which will have some other, probably less interesting name at the time like "Adobe Web"--will only be available by subscription and cost $20 a month or $180 a year if you get 12 months up front. To that I say "ouch." I think this highlights one of the problems with the subscription model for new software. Basically, Adobe is relying on the revenue stream from the subscriptions to fund further software development on the product. But for version 1.0, $180 doesn't seem worth it to me, which is typical for early versions of software. Maybe the next version would be. But if not enough people sign on for version 1.0, we may never see 2.0. And I think that would be too bad, because it really shows promise. And I have to say, as a proof-of-concept of how far you can push AIR, it's pretty impressive. Best of all, perhaps, it handles crashing quite gracefully, with periodic autosaves in the background. That makes trying out the beta a lot less painful than it otherwise might be. You can download it at http://muse.adobe.com/.