Quasado opensources Gravit, web-based design tool

Quasado opensources Gravit, web-based design tool

Berlin-based company Quasado released source code of Gravit, their HTML5-based design app, under dual GPLv3+/commercial license.

The news is a quite interesting development of a slightly dramatic story involving a community of extremely passionate Adobe/Macromedia Freehand users, an ill-accepted rebranding from Gravit's predecessor Expressive into Stagestack, a failed fundraiser, first considerations to open the source code, and, finally, a bold move into rewriting everything with HTML5, CSS, and JavaScript, followed by rebranding into Gravit.

The new vector graphics app is an ommnivore: it's available online, there are builds for Linux, Mac, and Windows, you can install install it on Chrome and Chrome OS. And yes — now there's also source code on GitHub.

Gravit

While Gravit subjectively feels a bit barebone in terms of features as compared to either free/libre apps such as Inkscape or commercial counterparts such as Adobe Illustrator, it has the foundation for something serious. Basic shapes, gradient fills, multiple strokes, snapping system with smart guides, transformation and alignment, as well as slicing are going to make one hell of a v1.0 in September 2014, should the deadline be met.

We spoke to Alexander Adam, CEO of Quasado, about the reasoning behind the change of heart, and about company's further plans.

Alexander, judging by your article on Medium, your situation falls neither under "we are broke, so we opensource it to let it live", nor under "we really dig that opensource thing, but we've no clue about our business model" case. What is your plan for making this project commercially sustainable?

Gravit is the core of our soon-to-be-released commercial cloud-based solution to manage collaborative design projects, gain customer feedback etc. It's going to integrate perfectly with Gravit.

In your post on Medium you also mentioned commercial addons. What kind of?

Prototyping (including actions for events etc.) and animations are biggest ones. Furthermore, we’re also working on a full PostScript interpreter addon to read/write AI, PDF, EPS, and PS which will be a commercial plugin for Gravit, even though others are, of course, free to write their own free addon to do the same.

Given your extensive past expertise with SVG, the Renesis SVG player, it's interesting that you only made use of HTML5, CSS, and JS. Why?

SVG turned out to be too slow and inflexible for such a huge undertaking. As I know SVG pretty well in-and-out, it was, after all, a technological decision made, and it turned out to be the better one.

Did you design your own DOM?

Yup, absolutely. We’ve designed our own scene graph model. It works similarly to the one we previously designed for Stagestack which already was optimized for fast rendering and performant changes including animations without eating too much memory and CPU power.

How would Gravit handle really complex project with lots of paths and nodes, fills, and blurs? Will you be using WebGL?

Upfront WebGL is (not yet) available everywhere considering especially mobiles. Furthermore, Canvas 2d is blazing fast due GPU acceleration, and most time is spend on blitting anyway which WebGL wouldn’t help with, because you’d need to get the textures in and out.

One of the reasons the Free Freehand community supported you — up to a point — is that they needed both workflow and .fh files support, and you were interested in giving it to them. How do they currently affect your roadmap, and what's up with the importing/exporting system?

Well, Gravit already combines best of Freehand and Fireworks as of now. Furthermore we already have a large code base for importing Freehand files which will be open-sourced as well, so people may improve it, if things don’t go well.

Speaking of combining the best of Freehand and Fireworks in a single new app, how closely do you replicate the way Freehand tools work? How and where do you draw the line between "we'll do the same way" and "we'll do it differently"?

Well, we’ve taken a sheet from the Free Freehand community where they’ve listed a lot of features of Freehand they wanted to see implemented in Adobe Illustrator, and we implemented most of these.

However, we’ve put a lot of effort into combining those features with the ones from Freehand, because we wanted to build a tool that is as good for print design as it is for screen design, and I am really happy with the result so far. Sometimes, understanding and combining features of both applications took us more time then actually building them ;-)

Can you say you have solid feedback from the Free Freehand community at this point?

To be honest — no. We’ve expected so much more, but there’ve been roughly about 25+ people interacting with us, and that’s about it.

My impression from the Stagestack story is that you overestimated the amount of Freehand users actually willing to sponsor development of a viable substitution, given how many had already moved on to other tools. So while Stagestack fundraiser page prominently mentioned Freehand, Gravit's project page is completely lacking any mentioning of Adobe/Macromedia tools. Is it a marketing decision?

Yes, absolutely. We’ve integrated a lot of features from Freehand and Fireworks, when we’ve considered them to be versatile enough. However, we’ve also mixed a load of our own ideas and experiences into the app, and we didn’t want to be "just a clone of Freehand", because Gravit will be so much more. That’s why we call it Gravit, a tool in the spirit of former Freehand and Fireworks.

One of the results of rewriting Qt4-based Expressive/Stagestack into HTML5/JS-based Gravit is a dramatic cut of lines of code: from ca. 400K to ca. 100K. How did you do that?

There are a few points here:

  • We’ve learned so much on Expressive/Stagestack that we knew how to write more efficient code.
  • We’ve implemented a more effective Geometry library based on Vertices that does all the hard work (low code).
  • We’re able to utilize a lot of browsers' features including HTML5 Canvas API, CSS3 and generally HTML5 Layouts reducing code.
  • JS is such an expressive language that we, using our own OOP-Framework for JS, were able to reduce a load of code using more functional/expressional programming.

Do you see Gravit as a tool with full support for spot colors, CMYK (vectors and images), and reliable PDF exporting with all the print/crop marks and suchlike?

Absolutely! This is one of the "last" challenges considering Gravit being based solely on HTML5, CSS and JS but it is on our list.

How are you going to deal with the licensing challenge when it comes to e.g. Pantone? Will you be using XREF?

We’ve started talking with Pantone but as you can imagine, they won’t license to us as of now. XREF might be a viable option. We’re, however, targeting to create a commercial addon supporting full Pantone spectrum.

What are your plans for Gravit beyond the v1.0 release?

We’re trying to improve the print/CMYK capabilities after 1.0 as well as introducing more features still missing from fireworks/freehand in Gravit to become "feature complete" in 2.0, namely symbols, states (Fireworks), and extended typography features (Freehand).

Was it useful? There's more:

21 Comments

Leave a comment
  1. I hope they aren’t overly attached to the name
    http://en.wikipedia.org/wiki/Gravit

  2. Not sure why “Browser’s” was capitalised. Not clear if the article is talking about web browser functionality or features from the JSON software Bower.io

  3. Alexandre Prokoudine 28 August 2014 at 8:01 pm

    Alexander is a German, that’s why :) I fixed that, thx.

  4. The key question - will it be able to open Freehand files.

    I’m sure I speak for the vast majority of professionals when I say - if Gravit doesn’t open Freehand files, I wouldn’t bother with it in any way.

    We have to use Illustrator in this industry now - like it or not, Adobe has sewn up the entire design field.

    Freehand users with thousands of legacy files want to be able to open those old files on a modern computer with a modern OS and be able to work with them. That’s the beginning and the end of my interest in Gravit, and it’s not mentioned here.

    Right now, I keep a 2007 Mac Pro with 10.5 installed, which I struggle to not update so that I can always have access to many, many Freehand files that I constantly need access to. But that kind of situation can only go on for so long.

    So do you have an answer for this, Andrew?

  5. Sorry - Alexander.

  6. Alexandre Prokoudine 28 August 2014 at 11:44 pm

    @Steve, the interview specifically covers that: “Furthermore we already have a large code base for importing Freehand files…”

  7. Oops - sorry, I missed that. Thank you, Alexandre.

  8. Alexandre Prokoudine 29 August 2014 at 1:16 am

    A word of warning though: .FH is an extremely convoluted file format. Nothing is undecipherable, of course, but reading some parts of the data correctly will be quite complicated. I would expect some initial issues there.

  9. Understood. Thanks for explaining.

  10. As Alexandre says, the FreeHand code is convoluted. Many years ago, I had a conversation with one of the devs about FreeHandMX. This is what they said at the time:

    “Our file format is based a mechanism that sends a message to each object instance asking it to tell us about itself. The method then sends messages to a passed in interface telling the interface about it’s structure in file format/chronological order (i.e.. first comes a reference to another instance then a 32 bit number then ...). Therefore the only real documentation on what is in the file format is the FreeHand code itself. Also, there is a header and a trailer. If I remember correctly the header contains a file format identifier, version number and a pointer to the trailer at the end (I forgot the rest of the header if there is any). The body of the document is is saved in zip file format using a build of zlib. The trailer contains a mapping of the object type index to an object class name. This allows us to save off arbitrary indexes (small numbers) for the object types and then remap them to the current class names in FreeHand. Each object reference contains an arbitrary numeric identifier and a object type identifier. We would read the trailer at the end first and create a mapping of object class indexes to classes to start off with. The file format was designed to be as small and tight as possible because we had customers who wanted to transfer files over the internet (which wasn’t as fast in those days).”

  11. The news is a quite interesting development of a slightly dramatic story involving a community of extremely passionate Adobe/Macromedia Freehand users, an ill-accepted rebranding from Gravit’s predecessor Expressive into Stagestack, a failed fundraiser, first considerations to open the source code, and, finally, a bold move into rewriting everything with HTML5, CSS, and JavaScript, followed by rebranding into Gravit.

    The new vector graphics app is an ommnivore: it’s available online, there are builds for Linux, Mac, and Windows, you can install install it on Chrome and Chrome OS. And yes — now there’s also source code on GitHub.

  12. Pretty interesting how they combine vector graphics with web design in one tool—although, I don’t think I can throw away my Adobe Illustrator just yet!

  13. For information Gravit is no longer under GPL 3, but Creative Commons Attribution-NonCommercial 4.0

  14. This is great, it’s like an open source Photoshop. I was looking for a tool like Gravit for a long time. Thank you!

  15. @Laura We have launched a public beta for gravit. Just beat the pacman game’s score and you’re in. http://www.gravit.io/product/play-invite

  16. Thanks for the info. I designed my logo here. For a long time i am searching logo creator for free .i got it here. Check my website i created logo with this.

  17. I am an adobe fan, but this look amazing too :) should try

  18. We would read the trailer at the end first and create a mapping of object class indexes to classes to start off with. The file format was designed to be as small and tight as possible because we had customers who wanted to transfer files over the internet. Btw Thanx Alexendar,.. for this article.

  19. is a quite interesting development. The problem is to abandon my Adobe Illustrator

  20. If I had to abandon Photo Shop or my beloved Fireworks, i’d probably give this a go. Looks pretty intuitive and easy to use.

  21. It sounds great, it’s like an open source Photoshop. I was in search of this type of tool like Gravit since a long time. Thanks to let me know.

Tell us what you think

Submit the word you see below: