Macawesome

Posted on July 25, 2013

If you are moderately-experienced web designer or developer, you might look down upon WSIWYG editors with the same degree of scorn that a chef might view single-use, gimmicky cookware – a crutch for the amateur that still under-delivers on the one task it was designed to do. On Tuesday we got a sneak peek of MACAW, and it was exciting to see something that could shatter those preconceptions. What was even more encouraging was the positive reactions from many leaders within our industry.

Design deliverables have always been a hot topic for designers and stakeholders alike. We’ve already learned to favor a more iterative approach over the big reveal. But there is still the question about the format in which deliverables are produced, and that complexity becomes amplified with fidelity and responsive design. What is the fastest way to convey our ideas as we move towards launching the MVP? Static comps, which are quickly produced, cannot account for varying browser capabilities nor those places in between breakpoints. Putting those comps into deployable code requires additional time and creates some redundancy whereas a functional prototype is something we can see in the browser but takes longer to initially produce.

This, it seems, is where MACAW tries to step in. It gives designers a fluid canvas and a practical tool palette with properties and measurements appropriate for the web. To use it effectively, designers will need familiarity with implementation. However, MACAW will enable non-coders to more comfortably get their feet wet than hacking around CSS frameworks.

We are still long ways away from an editor that writes acceptable, production-level code. I doubt we’ll ever see one because writing good code requires consideration for the site as a whole: elements that might not be on that particular page, third-party content, and so-on. What separates MACAW from the pack though is that designers have a direct hand in the code that gets produced: markup, class names, common styles, grids, etc. Depending on the person, that could be a good or a bad thing.

There is some skepticism in the design community, however. We’ve never had tool that can deliver on this type of promise. Software like Dreamweaver belches out hilariously unusable code. Newcomer Adobe Reflow could pose a serious competition, but it’s not a flagship product and I haven’t seen any indication of how it may produce HTML. Also, we can safely assume that anything from Adobe is a memory-sucking leviathan. The MACAW demo did not showcase all of its capabilities either. It also creates style guides, consolidates styles, and “learns as you design.” Judging from what we can see in the sample page, the code is actually very good. Workable, even.

I’m still not sure if MACAW would my primary web design tool. I prefer to move fluidly between sketches, designing in the browser, and Illustrator. I work quickly this way, adjusting where I spend my focus on a project-by-project basis. Is this something I can fit into my current workflow at my organization? Does it play nicely with preprocessors? How well will MACAW handle multiple templates within a site? Will iteration bork code? Can it reverse publish? I’m getting of myself here and all this might not be within the app’s scope. There are no silver bullets and that’s fine. We shouldn’t expect them.

MACAW will certainly enjoy lots of success. Even it doesn’t generate production-ready code, it is going to be positive for our industry. We desperately need an alternative to Adobe products. While I don’t know its co-creator, Tom Giannattasio (@attasi ) personally, I do know of his work. To put it bluntly, it’s fucking impressive. So I feel confident that no corners will be cut. Things are about to get MACAWESOME.