Online Vector Graphic Apps

Our fellow tutorial website, TheOpensourcery.com, has recently completed a review of Online Interactive Diagrammimg Apps. The review discovered that within the past 5 years the number and quality of free [or freemium] online apps for Interactive Diagramming had improved considerably. The Features of the online apps rivalled  Microsoft Visio for number of diagram and flowcharting  templates, ease of use, and even team interaction capabilities for users willing to pay for some of the advanced interaction and synchronization capabilities. A few of the apps also had vector graphics features.

So when doing this review of Online Vector Graphics apps it was not a surprise to see a number of common features shared by Online Interactive Diagramming apps and Online Graphics apps :

  1. Drag and drop operations for laying out components
  2. Left sidebar of components and topbar of properties for the currently active component are common
  3. Output in either raster or extensible vector format
  4. Offering  Cloud storage  for basic team connections
  5. Use of the freemium model for advanced features by several vendors

But there is a distinct difference between the two app groups. Interactive Diagramming is really geared towards depicting Information and Business Processes with many complex interconnections and overlaps. Diagrams  help to provide many process insights.This is the world of  Flowcharts and Diagramming components – think MindMaps, UML Diagrams, Coding Flowcharts etc, etc.

In contrast Online Vector Graphics are use for 2D and 3D modeling for creating everything from logos to human & animal figures to complex scenery. Because the output is almost always in vector format it can be expanded or shrunk in size by 2 to 5 times with precision. In addition, the SVG format can be linked with JavaScript, Java , Python and other programming code for marvellous animations.

Online Vector Graphics Apps

Having seen the number of free online Interactive Diagramming apps still did not prepare this reviewer for the number of free Online Graphic apps – nearly two dozen. So to pare down the number of apps to review, two simple criteria have been applied. First, the app must provide free output in SVG and one raster format. Second, the app must have have a complete set of basic tools pencil, line, shapes, vector text, image. Using this criteria still resulted in seven very excellent apps:

DrawSVG – free app
Pros and Cons for the App

  • + very rich set of vector commands with multiple options
  • + arcs plus cubic and quadratic curves for precise user shaping
  • + many predefined  shapes: symbols, flowcharts, arrows, emojis, etc
  • + incorporates images, videos, Google Maps
  • + has image to SVG, SVG to image routines
  • + encode images in base64 for HTML inline insert
  • – setting some properties are very clumsy/awkward
  • – shapes/arcs are unaware of  common endpoints or touching curves 

Gravit Designer – freemium app
Pros and Cons for the App

  • + UI with left sidebar of  2 dozen tools, topbar of output optiond, right sidebar of properties
  • + many optiond – e.g stroke and fill 
  • + user symbols from grouped components then easily duplicated
  • +  available in 14 languages with user guides and tips
  • +  options  to modify blur, color, contrast, saturation, etc
  • – response time is delayed on complex group modifications
  • – premium required for advanced drawing tools and save options

Inker – free app
Pros and Cons for the App

  • + simple left sidebar of vector tools, topbar of options, bottom bar of colors & gradients plus right layers sidebar = easy to use
  • + very effective popup animations on how  to use Draw & Path tools
  • + Draw tool works and corrects logically
  • + One of the most fun Open Graphics Tool to use
  • + has image to SVG, Auto trace routine which produce s fine results
  • + basic set of free tools is remarkably complete
  • – filling in shapes with raster images only by  layer overlays
  • – shapes/arcs are only partly aware of common endpoints and fill areas

Janvas – freemium app, 39euro/year/1userjanvas imsage
Pros and Cons for the App

  • + very rich set of  20 vector tools in leftsidebar
  • topbar has import, print and save commands to local or Google drive
  • + popup properties list for vector shapes on left side for both stroke and fill can have color, gradient, pattern or transparency
  • + right sidebar controls  pages, layers, properties, alignment, arrangement, interactive code popups
  • + has  SVG to image routine
  • – setting some properties are very clumsy/awkward
  • – help system is too brief given  complex tool options

Method of Action free app
Pros and Cons for the App

  • + like Inker and Vectr the left sidebar of tools. right sidebar of properties, bottom bar of colors and topbar of menu controls equals an app easy  to learn and use
  • + a basic set of shapes from Nature thru Music to Flowchart
  • + Draw and Path tools  have minimum set of  special properties -easy to learn,  but more steps to use effectively in complex graphics
  • + basic set of free tools is remarkably complete
  • – no capability to convert raster  to SVG or vice versa
  • – a step behind Inker or Vectr for ease of use

SVGEdit – free app
svgeditPros and Cons for the App

  • + left sidebar of vector tools plus 14  predefined groups of shapes 
  • + bottom bar with stroke and shape fill colors, customizable  linear and radial gradients plus opacity settings
  • + Top bar with session options +  properties of  active component
  • + right layers sidebar with many user controls over layers of objects = real plus
  • +competes well with Vectr and Inker for ease of use 
  • + SVG ode reveal in app plus code avilable on Github for customization
  • – minimal doc or help tips

Vectr free app
vectr uiPros and Cons for the App

  • + left sidebar has Pages & Layers tab plus vector tool & shapes toolbar
  • + right sidebar pops up all properties of the currently active object and is a time saver
  • + Draw and Path tools  have minimum set of  special properties and handy fill/stroke  properties -easy to learn and use
  • + popup of 4 icons – horizontal or vertical flip and move-up or down in arrangement is very handy
  • + export in svg, jpg, & png formats and import in SVG, JPG, PNG, GIF and ICO formats.
  • – a small set of shapes compared to other apps
  • – no raster to svg conversion feature

YouiDraw– freemium 3 apps $100US/yearlm
logom

Pros and Cons for the 3 Apps

  • + 3 separate apps for Drawing, Logo Creation and Painting
  • Different UI for each, fair learning curve  to master each
  • – simple user guide leaves how-to questions
  • – free version just png, jpg output watermarked, no commercial use

Vector Magic premium app costs $10/month online, onetime charge of $295US for 
Pros and Cons for the App

  • + Converts JPG, PNG, GIF to SVG, PDF, EPS
  • + Unlimited use for online and desktop versions
  • Conversion for 1000 x 700px on Chrome with !^GB PC and Fast WiFi  took 35 seconds
  • – only does conversions, limited  photo corrections

There are some added contenders for online Vector Graphics apps:
1 – CleverBrush – similar to Inker and Vectr

2 – Mondrian or Ballpoint.io – again simple tool like Vectr, but not as easy to learn

3 – Inkscape via Rollap – Inkscape in a browser app using Rollapp engine, freemium = $72US/year
4 – TinkerCAD – free 3D online CAD from Autodesk, lots of integrations, tricky SVG output

5 – Vectary – 3D vector graphics freemium app, freemium = $144US/year

6 – Vecta – is distinctly a beta platform, but with some eye-catching team and text manipulation features
Having seen the above list of largely free Online Vector Graphics apps, this is a review of some of the best tools we tested. But for those looking for an exact fit try this list of  simple Online Vector Graphics apps or perhaps consider this list with some desktop PC/Mac vector programs

 

Summary

Given the number of highly usable Vector Graphics apps, one could wonder why so many nearly free apps. Certainly Open Source plays a role with excellent tools like Inker, SVGEdit, and Janvus offering a codebase with JavasCript, HTML5 and CSS being the major ingredients. And the customizable of code is attractive for LogoMakers like YouiDraw and Animation apps is ceertainly a draw. But sophisticated 3D tools for game or movie animations are exceptions – see TinkerCAD and Vecta for examples.

A colleague insists that basically the need to do simple 2D illustrations that can be enlarged with precision by factors of 2 to 5 times is a real Draw for Web Graphics Designers. And so tools like Inker, Vectr, Method of Action and Gravit Designer are first places to stop if your vector renderings are straight forward. 

Even Log Design  can get a great start in the basic Online Graphics apps and then more complex work can be done with SVG transfer to TinkerCAD or YouiLogoMaker. But know that if you need more complex drawings you can export from any of the basic tools using SVG format  and then step up  with SVG import into more sophisticated tools like SVGEdit, Janvas and YouiDraw. My personal favorite is Inker because I can auto-convert  JPG and PNG images to SVG and if it not good enough step up to Vector Magic. 

Leave a Comment

Your email address will not be published. Required fields are marked *

Pin It on Pinterest

Share This

Share this post with your friends!