August 17, 2011

Adobe Muse promises HTML5 and CSS3 design without coding

Hot on the heels of their new HTML5 motion graphics application, Edge, Adobe has released a public beta version of a new product code named Muse.

"People don't hand-edit PDF or PostScript files for print file or PDF document, and in 5-10 years I don't think very many people will be coding in order to design a website." Adobe's Muse Quality Engineer - Jason Prozora-Plein.

 

Muse - Icon

At first glance Adobe Muse appears to be the infant child of happy parents, Adobe InDesign and Adobe Dreamweaver. Muse also feels a little like Apple's forgotten iWeb product.

The tool itself is built as a stand alone AIR application that is available as a free download from http://muse.adobe.com. On Adobe's Muse microsite you can watch an introduction video by the Muse product team and get further details on pricing for Muse once the product is released as 1.0.

Using Adobe Muse

The wizard-like workflow is a nice approach to the Muse interface. Adobe has given designers a clear process to follow in creation of their site: Plan > Design > Preview > Publish.

Plan

Muse Sitemap

Adobe starts out by having you create a sitemap in Muse by adding pages and subpages off of your root homepage. With each page you create you can choose which master page to base it off of. Print designers will be very familiar with the concept of designing certain elements on a master page to be included on all subsequent pages based on that master.

Muse Masterpage options

Design

Muse's design tools are 100% focused on the layout of your page elements and the styles applied to your text. There is no "Code-View" in Muse, so all CSS generation is achieved through the different design panels. Font selection, leading, kerning, spacing, text wrap, alignment and other options found in Adobe InDesign appear in the text panels within Muse.

Once you have styled your text to your liking, you can save the style as a stylesheet. Paragraph styles are applied as <div> classes and character styles are applied as <span> tags within the HTML.

Muse Style Options

Swatches, gradients and graphic styles are available for images and objects. Complex CSS tasks such as applying drop shadows or rounded corners, become an afterthought when designing with Muse.

Muse Object Effects

There is also no need to down-save your high-resolution graphics before importing them into Muse. Muse will automatically scale and convert your image to a web-resolution PNG file.

Preview

Muse has a built-in WebKit engine (Safari and Chrome are built on WebKit) to preview all of your work within the application. Muse also has the option to preview your work in your default browser application.

Publish

By default, Muse is setup to publish your site up to Adobe's hosted servers. If you would like to host your site with Adobe you will need a Business Catalyst account. Luckily, if you do not already have a Business Catalyst account, Adobe has integrated the sign-up and agreement form. As part of the Muse public beta, users are eligible for a free trial Business Catalyst account. If you would rather not create an account and want to take your Muse creation and publish to your own hosted servers, you can do so by selecting "Export to HTML" from the File menu.

Thoughts

There are a lot of additional features in Muse to explore. With Adobe Edge and now Adobe Muse, you can see that Adobe is working hard to give creative professionals a set of tools for designing rich digital content with HTML5 and CSS3 underpinnings. There are those that feel that Adobe may be biting off more than it can chew with this product, or that Adobe is over-simplifying the complexities of coding (To see differing view points head over to NetMagazine). I can only say that while Muse may be controversial, it certainly is an exciting product that is looking to help solve a very relevant pain point. 

When looking at the pricing for Muse, one thing that you will notice is that there will not be a way to purchase the software outright. Adobe will be offering Muse to users only as a subscription service. It will be interesting to see if users that already have subscription licensing plans for Creative Suite will be given Muse at no additional charge, or if the product will only be available through a separate subscription.

Posted at 09:57 am by Ivan Mironchuk

 Database Publishing Consultants Inc. BBB Business Review

Case study

Workflow Management Consulting for McGraw-Hill Education

McGraw-Hill Education hired DPCI to help the company overcome workflow management challenges and devise a strategy for future expansion and process improvements around the K4 Publishing System.

> more

All case studies


Press Release

EMBridge provides advanced image management capabilities to Drupal by connecting to EnterMedia, an open source digital asset management system. more
Alltop, all the top stories