Welcome to another entry in our series exploring the wide world of software created by developers other than Adobe! In this article we’ll be going through a collection of awesome vector art applications, with something to suit you whether you’re a high end graphic artist, a web designer creating SVG for sites, or someone newer to vectors looking for something simple and clean.
Just as with all the software we’ve looked at in our series thus far, every application on this list is available without needing a subscription, and is also under $100. In fact, every application on this list, with the exception Affinity Designer, is completely free. So if you’re looking to do vector work on a budget the going is good!
These programs are also fully cross platform, (except Affinity Designer), with great software for Linux, Mac, Windows and even ChromeOS, so whatever your setup is there’s something here for you.
On a side note, you won’t see the popular Mac-only application Sketch here I’m afraid, and that’s not because it isn’t an excellent program. At the moment it’s widely praised as being the leading solution for UI design. However as I said at the start of this series, I’m only including an application if I have personally tested its latest version, and as I chose to retire my Mac earlier this year that’s not going to happen any time soon with Sketch. However if you are on Mac and working heavily with UI you should definitely check it out.
And now let’s get underway with our Adobe alternative vector applications!
1. Affinity Designer
In the same way Affinity Photo is currently the leading Adobe alternative in the photo editing space, so too is Affinity Designer the leader in the vector editing space. If you’re a professional who leans hard on Illustrator and you’re looking for other applications with comparable power, right now Affinity Designer is, in my opinion, unsurpassed.
Like Affinity Photo, Affinity Designer has the uncanny ability to just allow you to pick it up and start being productive almost instantly. Everything in the interface is intuitive, clearly and accessibly placed, yet powerful. When using Affinity Designer I feel like all the speed bumps have been cleared and I can just race ahead. If you have any experience at all creating vector art chances are high you’ll be able to go in blind and be productive right away.
It’s also my feeling that Affinity Designer is currently the application that’s most in tune with what creative professionals need in their day to day workflows, and by a pretty large margin. If you haven’t looked into Affinity Designer yet, watch this video on the latest version 1.5 to take a peek at what this awesome software can do:
At the core of any vector application is its pen tool, and Affinity Designer’s is excellent. It has four modes: pen mode for straight lines and bezier curves, smart mode for automated smooth rounding of curves around nodes, polygon mode for straight lines only, and line mode for, well, lines. It’s also very easy to convert any node into any one of the aforementioned node types by just selecting it and hitting the desired node type button on the UI.
When it comes to keeping an eye on your work Affinity Designer has some excellent features. It has an incredible zoom function that can move in by up to 1,000,000% - essentially infinite for all intents and purposes. It allows you to preview your work in the default of vector mode, but also in 1x pixel mode, 2x pixel mode, and outline mode as well. Additionally you can split your screen and view it in two modes at once, with a divider you can scrub left and right to transition between views:
Affinity Designer also has an advanced grid system that allows you to setup grids however you like, but with more than just standard square grids. You also get: isometric, 2:1 isometric, dimetric, oblique, trimetric left, trimetric right, triangular, horizontal triangular, 2:1 triangular, and two types of custom grids you can fine tune even further with control over spacing, divisions, gutter, angle and snapping. This is probably the best grid system I’ve seen in any software to date.
Just about everything in Affinity Designer is live and non-destructive. Boolean actions are non-destructive and shapes can be moved around and adjusted afterwards. Adjustment layers are non-destructive and can be stacked, sorted and edited after the fact too. Blending modes are instantly previewed the moment you hover over them in the dropdown list. These are the types of features that really smooth out and speed up a workflow.
Unique to Affinity Designer is its system of “Personas”, of which it has three: vector, pixel and export. You start in “Vector Persona” by default, which is where you find all your vector tools, but if you hit the “Pixel Persona” button you’ll find yourself in a full featured raster editor all within the same program. This ability to use advanced vector and raster tools in a single application is a phenomenal feature that makes Affinity Designer hard to beat.
For example, Affinity Designer has brilliant vector brushes, allowing you to create a real hand painted look and retain all the precision of vector work. However it also has raster brushes you can use in its “Pixel” mode to give you the essentials of digital painting. You get the best of both worlds.
Recently, Affinity Designer been making moves to allow for professional level UI / UX development, something that will be welcome news for Windows based web and app designers. It now includes artboards, symbols, and constraints to give you semi-responsive layout adjustment, among other features that help the process along. The devs have put together a presentation page where you can check out all the details: Affinity Designer for UI / UX.
For professionals depending on high level software, Affinity Designer is rising fast as the number one contender. As would be expected with a top tier application there are plenty more features than can be described in a single article, so you might also find it helpful to follow along with our Affinity Designer Quick Start course, where I step you through all the essential features of the software.
Affinity Designer is $49.99 and offers a 30 day trial which, particularly with the help of our course, is definitely ample time to play with all its awesome features.
- Website:https://affinity.serif.com/en-us/designer/
- Platforms: Mac, Windows
- Price: $49.99
2. Inkscape
As can often be the case with software from the Linux / open source world, Inkscape contains a lot of power that may at first seem hidden behind a user interface that takes some time to learn. You won’t instantly pick up and run with Inkscape like you will Affinity Designer, but don’t let that allow you to miss out on the punch being packed by this application.
Even if you’ve used Inkscape in the past and didn’t take to it, it’s time to take another look because some great new features have been added in version 0.92, released in January this year. Check it out:
There is a long list of new inclusions, as you will have seen in the incredibly fast video above. One of the standout additions is the new and much sought after gradient meshes. At present, among the applications on this list, only Inkscape has this feature. The devs behind Affinity Designer did say they plan to add it, however that comment was a couple of years ago and while they assure it’s on the roadmap, there’s no ETA at the moment. So if you love mesh gradients and want to try some new software without spending hundreds of dollars, or any dollars at all in this case, Inkscape is your ticket.
Another significant new feature for anyone creating SVG for web is the switch from 90dpi to 96dpi to match the CSS standard. Additionally you can directly edit your SVG’s XML structure directly inside the interface, making Inkscape a strong prospect for web graphics creation. And further to that point, the 0.92 release notes also say:
“Many SVG2 and CSS3 properties are now supported (e.g. paint-order, mix-blend-mode). Not all are available from the GUI.”
BSplines make an entry in version 0.92 too, making the laying out of controlled smooth curves a breeze. And the freehand drawing / pencil tool now has smoothing and real time path simplification making Inkscape a great drawing tool.
And in another addition there are now live on-canvas gradient editing tools, where previously gradients had to be edited via the UI. Now you can just double-click anywhere on a line that represents the gradient to add a new stop, select stops and shift or recolor them, and drag around the end points to control where the gradient applies.
When it comes to the toolkit, Inkscape has everything you’d expect to find in a vector application, as well as some things that are not all that common.
The pen tool is excellent, and very powerful. It has the
regular functionality of placing straight line nodes and bezier curves, but it also has a “spiro” mode
for automating the creation of smoothly rounded shapes, version 0.92’s “bspline” mode for
creating soft curves and waves, and “paraxial” mode to create shapes using only right angles.
It has a fantastic sculpting tool which allows you to modify your shapes by pushing and pulling near nodes to modify the edges of shapes, which is a very organic editing process. If you’ve ever done 3D sculpting of terrain or meshes, this tool feels very similar just in 2D form.
There’s also a nice calligraphic brush stroke tool, the standard rectangle and ellipse tools, and several other shape tools.
And perhaps on the less serious side, though certainly useful as well, Inkscape’s spray tool is a lot of fun. Select any shape you’ve created in your document
then you can spray that shape repeatedly around your canvas, or single click to stamp it.
Once you have all your paths down there is the ability to add “Path Effects” which are live alterations to paths that can be tweaked or removed at any time. And the path simplification feature works very well, which is particularly helpful when used to clean up messy vectors that were created with the freehand tool or by using the “Trace bitmap” function.
To help speed up your workflows Inkscape has a symbols library in which you can create a drag-n-drop collection of reusable assets. It also has a system of clones that allow you to duplicate an object then edit all instances of it simultaneously in real time.
The community driven process behind Inkscape shows through in the degree to which it can bring in external components. On top of its in built tools Inkscape has a robust extension system and ships with some useful extensions out of the box, with the ability to install more should you like. It can also have custom scripts written to control its behavior.
One thing I definitely appreciate in Inkscape, and this seems to be another running theme with Linux / open source tools, is the extensive list of settings you can use to get the software setup to best suit your preferences. You have control over UI layout, keyboard shortcuts and tool defaults to name a few things. And yet another thing Inkscape has in common with its FOSS peers is its extensive documentation and wiki content to help you along. You might need to put in a little time while picking up this tool, but you won’t want for information as you go.
If you want a tonne of power but don’t mind a learning curve to get it, and you like to have a lot of control over your software, Inkscape could be the right tool for you. And if you’re on Linux, bringing this tool into your workflows is a no brainer.
- Website:https://inkscape.org/en/
- Platforms: Linux, Mac, Windows
- Price: Free
3. Gravit Designer
Gravit Designer is a serious up and comer in the vector art space. It might not quite be on the same level as the very top players just yet, but it’s already very powerful and developing fast. Between the time I started on this article and the time I finished it a whole new release came out with a laundry list of excellent new features, including cloud save & sync, placing linked images, measurement guides, Sketch file imports, a new gradient editing system, international text support, a localized Chinese version, improved SVG export, and a new API providing support for plugins.
Gravit has a reputation for being the most powerful browser based vector editing program available today, and that it is, however it also provides desktop versions so you can work in whichever mode you prefer. Generally speaking, my experience was the desktop versions seemed to be more stable, but the web versions ran faster.
And by the way if Gravit’s default purple interface is not your thing, never fear, in the latest version there is the option to use a light or dark theme instead.
Right from the moment you start using, Gravit has some cool features. For example, it gives you the option of working with an infinite canvas. Just leave the page height and width fields empty when you create a new document and you’re away. The only restriction in this mode is you can’t set a canvas background given Gravit won’t know what size said background needs to be drawn at.
And while we’re on the topic of creating new documents, one of the latest features is that when you do so you can select “New from template”, which shows you a selection of template categories. After choosing one you are presented with numerous existing templates you can grab from the cloud and iterate on. Even though this feature is new it’s already well populated. I look forward to seeing where it will be a little ways down the track.
Once you’re into your document there is more content ready for use in the new Library section. It already has a sizable library of in built shapes, illustrations, icons, emojis, stickers and decorative lines. All of these are freely accessible and can be dragged and dropped into your document.
When you move into designing the first thing you’re likely to look for is the pen tool, and the one in Gravit works as expected, providing straight line and bezier curve functionality. However the bezigon tool is a little different, and allows you to create curves a little more easily on the fly by holding ALT when you place points–the bezigon tool will then automatically create smooth curves between these points for you.
When working on the canvas Gravit has very good snapping guidelines making it quite easy to place objects aligned properly. The color picker magnifies the area you’re selecting it from, making it quite easy to hone in on the color you want. Selecting shapes is easy as you will get a clear outline of shapes as you hover over them, making them stand out from one another.
Gravit also supports multiple fills & strokes, and the feature is very neat and well done. Each fill or stroke behaves much like an individual layer. They each have their own blending mode and opacity settings, can be stacked in any order, and can be shown or hidden.
One thing I absolutely love in Gravit is the color management system. You get your regular run of the mill color picker and swatches, but you also get an automatically generated collection of swatches showing all the colors in your current document, and an excellent “Mixes” tab that provides you with several tints, shades, tones and mixes based on your current color.
Instead of artboards in Gravit you have pages, each of which can be individually sized; a feature very useful for complex designs and UI work. Speaking of pages, Gravit also has a feature that stands out among vector programs, and that is it has a Powerpoint / Keynote style presentation system built right in. You just create each of your slides as pages, then go to View > Play/Presentation and use the arrow keys to proceed.
Sadly I did encounter a couple of little glitches. There is a “background fill” feature demonstrated on one of Gravit’s tutorials that allows your document background to show through any shape no matter what is stacked below it. However it would not work for me, and I tried every combination of app version, browser and GPU I could come up with because that seems like a really cool feature. I also
had a strange offset on transparent fills, where the shapes behind them appeared out of position, and some flickering on the background fill.
I also had a little trouble with documentation as Gravit has gone through a transition from an old website and app name to a new one, and the docs don’t seem to have made the same journey just yet. That made it a bit hard to find out what all the tools in the software actually do. This is a fast moving software and to a degree some issues are to be expected, so just be aware little things might pop up for you too.
Gravit is completely free to use, and the dev team behind it have said they fully intend to keep it that way, without of any type of intrusive monetization. Rather they plan to go with features along the lines of attaching a marketplace you can dig into for resources should you choose. They also already license their software’s engine to third parties, which is part of why they say they have been able to keep the software free and clean thus far.
If you want an intuitive interface, powerful tools you can access online or on any OS including ChromeOS, and you like the idea of accessing integrated collections of usable assets, try out Gravit Designer.
- Website:https://designer.io/
- Platforms: Linux, Mac, ChromeOS, Windows, Online
- Price: Free
4. Boxy SVG
Boxy SVG is a web-based tool that is squarely focused on working with SVG, so if you need to create SVG assets to use in websites it might be the vector application for you. It’s a relatively simple program, but if you need web friendly graphics I feel that can actually be a positive. The reason is you can’t accidentally do something in Boxy that won’t translate well to SVG, because every tool available to you is designed for creating SVG. And because Boxy is browser-based displaying SVG right on the canvas, you’re already seeing the way your designs are going to look in a live site.
Boxy SVG may be web-based, however when you install it in either Chrome or Chromium, (and possibly Vivaldi), it will look on your system just like a regular application. You’ll be able to launch it as you would a native program, and though it will be running a browser instance it will look just like a normal program too.
That said, if you’d rather just run Boxy straight out of a browser window you can do so via the live demo.
This live demo currently seems to have some differences to the version on the Chrome app store. For example, the demo has masking tools while the Chrome app doesn’t, and the Chrome app has a library of drag and drop assets while the live demo doesn’t, so you might find you want to use each one a little bit.
In the Boxy toolkit you get all the regular tools: straight line, bezier curve, freehand, text, rectangle, ellipse, triangle and other assorted shapes.
On the SVG specific side of things there is a “View” a panel designed to let you directly control the view box, as well as settings for the preserveAspectRatio property including alignment settings and toggling between meet or slice.
The “Arrangement” panel allows you to control alignment of objects relative to the view box, or to other objects. Here you can also control object rotation, flipping, ordering, as well as grouping objects.
There are some solid path modification tools including boolean operations, (unite, intersect, subtract, exclude), compound path tools for joining or splitting, push button object to path conversion, and push button opening, closing and reversing paths.
And to help you speed up your work, there’s a library containing a collection of drag and drop assets you can make use of, or you might like to just check them out in order to see what Boxy SVG can do.
When it comes to exporting, Boxy SVG might be SVG focused, but you can still output your work as PNG, JPEG or WebP. You can also output in HTML instead of SVG if you choose, though the code produced is only marginally different.
If you’re looking for a highly accessible tool, and particularly if you create SVG for the web, Boxy SVG might be a great new additional to your arsenal.
- Website:https://boxy-svg.com/
- Platforms: Linux, Mac, ChromeOS, Windows
- Price: Free
5. Vectr
Vectr is a very simple application. It doesn’t have a lot of bells and whistles, and what you find in the interface is very clean and straight forward to use. I’d describe it as all the essentials in a compact package.
When you first jump into Vectr it takes you through an excellent series of interactive tutorials to get oriented
with the software, though most of what is covered will already be
familiar to users of other vector design applications.
In
the toolkit is a bezier curve pen, a freehand pencil, a text tool,
image uploader, rectangle tool, rounded rectangle, ellipse and a
collection of extra shapes. You also get the ability to create multiple
pages within a single document.
All paths and shapes in a Vectr document can have multiple backgrounds, borders, outer shadows and inner shadows applied to them, as well as have their opacity controlled. Backgrounds can be set to flat fill, image, linear gradient or radial gradient.
When working directly on path adjustment, converting points from straight to curved or vice versa is a simple matter of double-clicking on the point. There is also a very accessible corner radius tool on every point. And Vectr has some super quick to use on-canvas contextual tools with which you can flip shapes,
bring them forward / backward, or perform boolean actions. These kind of helpful little features are great for getting a flow while designing.
Of particular interest is that Vectr has a plugin you can install into a WordPress site to get a fully fledged image editor embedded in your post and page editing screens. Any image you create using Vectr inside of WordPress will automatically get its own URL on your site you can share with others.
Vectr is free, however you are required to create and sign into an
account with them in order to save your work. There aren’t any local
save options, all saving is pushed to the cloud. The only local option
is to export in either SVG, PNG or JPG format, but there doesn’t seem to
be any way to save your work and preserve pages, layers and so on. I
hope they decide to add a local save feature at a later date because not
having access to source files to create backups could be problematic.
The upside is that whatever you work on will be available from any web browser you can use to sign into your Vectr account. On their roadmap is the plan to attach a marketplace to Vectr where you can both sell your work and buy from others, so it might be fair to assume this is how Vectr plans to fund itself, meaning the software is likely to remain free.
If you’re looking for a light tool to get some work done fast, or when you’re on the move, check out Vectr.
- Website:https://vectr.com/
- Platforms: Linux, Mac, ChromeOS, Windows, Online
- Price: Free
Which Vector Software to Choose
We’ve covered five awesome vector applications and while all of them will let you create great vector art, each one is probably a little stronger for different kinds of use cases. My best summary of how to choose would be as follows:
- If you’re a pro working in a design studio Affinity Designer will almost certainly be the right fit for you. It’s high level software that’s under active development, and it will get you productive fast.
- If you don’t mind a learning curve to get at some power Inkscape might be your software of choice. If you’re on Linux, this is undoubtedly for you. Probably best for freelancers and solo artists who can pick their own software.
- Gravit Designer is the most powerful web based vector editor, and is rapidly increasing its feature set. If you’re looking for an intuitive UI and a strong web based / cross platform vector editor definitely check this out. Just be aware you might need to work around the occasional glitch.
- If you’re a web designer creating SVG for websites, Boxy SVG might be your perfect fit. It’s totally focused on SVG, and being browser based you can feel confident what you see on the canvas is what you’ll get in your live sites.
- For a simple program that has all the basics, if you don’t mind cloud-only saves, and if you’d like to able to do a little graphics editing directly inside WordPress while working on content, Vectr could be great for you.
Of course, there are still a lot more features in each application than I can cover in one article, so be sure to go check them all out for yourself!
One this is certain, the choices for vector art are very strong right now, so there is likely more than one tool you’re going to love using.
Coming Up Next: Video Editing
In my personal opinion, probably the strongest software in Adobe’s suite right now is Premiere Pro, making it the most difficult to identify realistic alternatives to that will suit everyone. However the landscape is changing and there is a collection of video editors now available that are getting better and better all the time. In our next entry in this series we’re going to check out the top contenders, once again all budget friendly software.
It’s undoubtedly possible for people with certain workflows to take on new NLEs, and I’ve heard several accounts from people who have done just that and transitioned to one of the applications in our upcoming article. It’s not going to be feasible for everyone just yet, but depending on exactly what you do it’s very possible you could be one of the people who now have multiple options to choose from.
And whether you can bring more choice of software into your video editing life yet or not, there are some applications whose feature sets are rapidly expanding to accommodate more and more use cases. That means it’s a great idea to start keeping tabs right now and be on top of new options as they become available in the near future.
We’ll be covering these applications and what they already include in the next article. I’ll see you there!
