Macaw: A Review

3
6117
Macaw: A Review

A couple of months ago I embarked on a journey that would involve testing a few different applications in the hopes of breaking the dependence of Photoshop in our web design work flow. One of these applications was the new, and promising “Macaw“.

I was hoping that this program would allow me to quickly design and present a working prototype for client reviews, and give our front end developers something they could work with as well. Long story short, Macaw is not the program for me, for that purpose at least.

With that being said, I think that to review this application framed in that particular context is unfair, because we need to look at what it was built for and what it can do.  So on with the real review:

Quote from the site:
“Stop writing code, start drawing it.
Macaw provides the same flexibility as your favorite image editor but also writes semantic HTML and remarkably succinct CSS. It’s time to expect more from a web design tool.”

What Macaw is

Macaw is a web design tool that allows a designer to create static, responsive web sites, using an intuitive code-less* interface (WYSIWYG). The more you know about HTML/CSS and JavaScript the more you will be able to do with this software.

*You can embed HTML and Javascript but obviously this requires some knowledge of these languages

What Macaw isn’t

Macaw isn’t a content management system (CMS). Macaw is similar to Adobe Reflow or even Adobe Muse (although this is more true with the former than the latter). Macaw is not a product for developing complex or deep sites (many pages), at least not yet. Macaw at the time of this review does not have any functionality that allows for global elements or universal symbols that make life a lot easier when dealing with multiple pages or screens of an application.

The Good

  • Writes great code/CSS. It really does.
  • The UI design is nice, and well thought out.
  • Simplistic & Intuitive Tools (relatively easy to learn)
  • The preview view allows you to simultaneously test your work on any device on your network without additional software (like Adobe Edge Inspect for example). This really is an awesome plus for this application. I wish it was this simple to test on devices with Adobe.
  • It takes a bit of getting used to, but the “Outline View” acts similarly to the layers in Photoshop. However understanding HTML/CSS is a definite asset in using this feature and application.
  • Creating breakpoints is straight forward, and is a good app for working with responsive designs.
  • Price – a one time fee of $179 for professional use beats a subscription for similar Adobe products (Reflow, etc.)
  • Keeps you closer to the HTML/CSS than other similar programs so you don’t lose touch with how things are built. What does this mean really? It makes a designer think about structure and layout and how it relates to real code.

The Bad

  • Needs master page or symbol elements (components are nice but don’t cut the mustard at this point). Editable master items would be required for serious multi-page site building and very handing for prototyping and wire framing. This limits you to smaller sites (1-5 pages) for sanity’s sake.
  • Gets bogged down occasionally (Nested divs). Multiple undos done too quickly can lead to odd results. Being a new release – these bugs are to be expected.
  • A solid understanding of HTML/CSS is required for clean code. You can use this tool if you don’t really understand how to write markup but, you probably won’t benefit from the cleanest code it can output. As a result you may find some frustrations in trouble shooting issues when previewing your designs in browsers or the preview tool.
  • Slight learning curve in clicking into elements, etc.
  • Too simplistic (things like HREF and lists have to be created via the DOM and elements). For example if you don’t know that a hyperlink is an <a> tag or that an unordered list is <ul> etc., you will struggle to work with some of these very basic HTML elements.
  • You need to be able to hand code Javascript (JS) or know how to plug in and modify JS for any kind of interactivity beyond basic hover states and links.

Conclusion

I am really rooting for this application. I think it’s a great start for what it is, but it still has a way to go before it will take any permanent place in my tool box. Global elements, or master page type control is essential to make this application a contender (in my opinion).  Integration with other responsive frameworks like Bootstrap or Foundation, might also be a bonus. All in all I think for it’s price, it’s worth getting on board and supporting this company. If you need to quickly make a one page site, or small site that has clean code and you don’t have the budget for Adobe products, Macaw just might be for you.

3 COMMENTS

  1. Thanks for the article Chris. I find Macaw to be very beautiful – certainly in concept. However I am new to web design and the like. Accordingly, it is easy to buy lots of things that may not serve me. I appreciate the experienced professional review. Concise and to the point. Pro / Con list is super. Like you I am a big fan of what Macaw is trying to do. Hope they keep it going. Meanwhile, I’ll use the tools I already own.

LEAVE A REPLY