Mac Design Software: 20 Vector, Bitmap, and Web Design Apps

“The Mac is geared towards creatives.” That’s what you hear most often when a discussion turns to the benefits of operating systems. But what exactly are those fantastic apps that appeal to us creative folks?

Other than the well known giants of Adobe Creative Suite, there are many other software gems with plenty of functionality (and a far lower price tag). Today I’ll be showcasing the giants in the design software world, and a few alternatives that may actually suit you better.

Read on for a showdown of the essential Mac design software – whether it’s for the web, bitmap, or vector design (and I’ve thrown a few apps for developers in for good measure too!)

Mac Web Design Software

Strictly speaking, we are talking about web development apps, since these help you to create a fully functional website, inlcuding the necessary code. But many of these apps mix design and coding functionality, appealing both to beginners and advanced users.

Let’s take a look at what should (or could) be on your hard drive if you’re serious about creating websites.

iWeb

Yes, you read right. iWeb might be scornes by serious developers, but it comes pre-installed on every single Mac and can open the doors to the wonderful world of web development for folks who previously had nothing to do with it.

iWeb’s graphical interface is very easy to understand, and the wealth of included templates allows for the quick creation of visually appealing web pages. If your sole goal is to set up a web site to showcase a couple of videos or photos, share some personal family moments or the memories of the last snowboarding trip with your friends, iWeb is a handy solution.

For those who – rightfully – complained in the past that iWeb was too much of a closed system, this was rectified with last year’s update of the iLife suite. Now you can also add YouTube videos, Google Maps and Adsense, RSS Feeds or HTML Snippets. These extensions will appeal to advanced users who want more control over their website, but most iWeb users will be satisfied with the included options.

Verdict: iWeb comes free with every Mac and is the perfect solution for people who don’t know anything about web development but are looking for a way to create a small personal site to share moments with friends and family.

Dreamweaver

Originally a Macromedia product, Dreamweaver is now part of the Adobe family of products. It may very well be the most powerful web editor available. It not only comes with code completion and subversion support, but it also allows for CSS validation with a few clicks and, as of CS5, Dreamweaver also supports authoring and testing of content management systems like Joomla or WordPress.

The complete feature list of Dreamweaver is way too long to be listed here, but it will be hard to find something that this editor can not do (apart from serving you breakfast in bed and cleaning your house).

Obviously, this wealth of options comes not only with a steep price tag, but also with quite a learning curve. The ability to both code and use the WYSIWYG (what you see is what you get) visual editor will appeal to many people, but there are less expensive alternatives that can do almost as good a job.

Verdict: Dreamweaver is still hailed as one if not the one most powerful web editor. If you can spare the cash (at $399 Dreamweaver is the most expensive of the development apps), have the hardware to run it smoothly, and the time to get know all the features, why not use it?

But before you decide to buy it, take a look at the alternatives listed below – you might be surprised to find cheaper apps that can give Dreamweaver a run for its money.

RapidWeaver

RapidWeaver is another WYSIWYG editor, right in the same category as iWeb. You don’t have to worry about code and all the cryptic stuff – all you need to do is click and drag and drop.

The app comes with over 40 pre-installed themes which can be adjusted to your liking (to a certain extent). Also, there are many free and commercial plugins to extend the functionality of RapidWeaver and make even seasoned coding veterans consider an affair with this editor (after all, why not chose the easy route from time to time?).

Verdict: If you feel limited by the abilities of iWeb but still don’t have the experience to code directly, take a look at RapidWeaver. It’s easy to extend and fits in well into the Mac environment. RapidWeaver is priced at $79.

Flux

The closest Mac equivalent to Dreamweaver might be Flux by The Escapers. It also offers the choice to design in either code view or the WYSIWYG editor. The interface is very sleek and, once the basic principles of the app are understood, professional websites can be quickly created using both editing environments.

It requires some time to learn since it also comes with a wealth of features and even supports Coda plugins, but it only costs a fraction of the better known Adobe cousin.

Verdict: If you are looking for an app that allows you to develop both in visual and code view but can’t afford Dreamweaver, give Flux a try. Set aside some time to truly discover all the potential the app has to offer, and you will find it a very powerful tool in your workflow. It’s priced at £69.99.

Espresso

For the coding junkies out there, meet Espresso. It won’t fuel you with caffeine (sorry, folks!), but it will give your creativity a good kick and gear it into action. With a wonderfully minimal interface, Espresso surprises with powerful features like CodeSense (a.k.a. code completion), an extensible core, smart snippets library (why type the same stuff again and again?), code folding, tab support, live preview and a built-in project manager as well as an FTP client.

Verdict: For just $79.95 Espresso should be at the top of your web design apps to check out. It’s sleek, fast, reliable and a pleasure to use.

Coda

Another one for coding evangelists. Coda by Panic is on the same level as Espresso and it’s down to personal preference as to editor you chose. I myself have licenses for both, but ended up using Espresso for most of my coding projects just because I liked the interaction with the app better.

Personal taste aside, Coda has a fantastic site/project manager, offers free Subversion support, has a truly amazing find and replace function – not to mention the live preview and the ability to visually edit your CSS.

And have I mentioned that you can actually build up a library of reference books right within the app? So, whenever you need to look up some Javascript, jQuery or CSS definitions, it won’t matter if you have an internet connection or not.

Verdict: A little pricier than Espresso, Coda is still an amazing deal for $99. A free trial version is available and you should compare it thoroughly with Espresso and Dreamweaver to find out which code editor suits your needs best.

TextMate

Many professional coders swear by TextMate. They consider it the most powerful coding solution currently available. It is incredibly adaptable and brings powerful snippet support and macros as well as a wealth of other features.

Verdict: It might not have the eye candy of Coda or Espresso, but for coders who like to adjust their coding environment to their specific taste, TextMate offers just what they need at very reasonable price tag of $55.

Sandvox

Yet another editor aimed at beginners and intermediate users who do not want to code manually. With Sandvox, you have the choice to edit your code (Pro Version); the basic version supplies you with Pagelets that allow you to extend the functionality of your site with photos, a contact form, social site integration like Flickr, Delicious or YouTube and much more.

Just like iWeb and RapidWeaver, Sandvox comes with a bunch of themes that you can use out of the box or build upon.

Verdict: As with the professional editors, it will be up to your personal workflow and taste which WYSIWYG editor will power your site. At $57 Sandvox is slightly more affordable than RapidWeaver, but it might not be quite as slick.

Mac Vector Design Software

Ever wondered how some graphics can be scaled to crazy dimensions without starting to pixellate (they won’t become blurry)? That’s because they are vector graphics, which are not drawn (strictly speaking) but rather calculated from a mathematical information.

By resizing the image, the lines are simply recalculated and therefore you can scale such an image to fit a huge poster or a web preview – it will always stay sharp. Let’s have a look at the apps that allow you to do that on the Mac.

Adobe Illustrator

Once more, the Adobe product leads the line. Adobe Illustrator is the industry standard solution for vector work.

Illustrator’s features are too numerous to mention, but here are some that set it apart from the competition by being unique or much easier to use: perspective grids for easier drawing shapes in different perspectives; editing within panels (quicker than selecting many separate controls one after another); great gradient and transparency control and – not to forget – a huge community that comes up with extensions to Illustrator.

Verdict: Of course, such a powerful app takes some time to learn, but it is time well spent. You’ll master the industry standard, and you’ll have the peace of mind that your files should work with any professional agency out there. At $599 the investment hurts at the outset, but if you want to earn your money in this field, the cash will be well spent. If that’s too high a price, check out the competition.

Sketch

A new player – and one that has quickly garnered the attention of professionals – is Sketch. It offers an infinite canvas, slice export options, multiple pages to a document, a wealth of shapes to reuse and a library function to store reusable objects. Additionally, you can easily group and rearrange objects and perform boolean operations on them.

Sketch is very easy to use. Everything is stored away neatly to let you focus on your work, but you can access all palettes quickly and not get lost in a ton of options you don’t need.

Verdict: If you do not need the full capabilities of Illustrator but would rather have a less expensive yet powerful dedicated vector app, take Sketch for a test drive. At $40 it is very reasonably priced and the development continues, adding more and more functions and implementing user requests.

Draw It

The developer of Sketch also brings DrawIt to our hard drives. The two apps are comparable to a point, but the biggest advantage of DrawIt over Sketch is that it allows for bitmap-like image filters to be applied to objects.

You can still create vector objects, group, and layer them, but you can also stack effects to give your drawing that little extra to make it stand out. You don’t have an infinite canvas as with Sketch and in DrawIt, if you zoom in, you can actually see pixels whereas in Sketch you will always have smooth lines.

Verdict: Depending on your needs, the effects and stacking capabilities of DrawIt might just what you need. At $37 it’s reasonably priced and should fit into a designers or amateur’s budget.

Eazydraw

Eazydraw claims to be simple enough for a beginner, yet powerful enough for the professional. If offers layer support, user libraries, and it plays nicely with a large number of file formats.

Verdict: At $95 for a full license, EazyDraw is on the expensive side of the vector apps. It has an interesting pricing model though: you can purchase a 9 month license at $20, giving you more than the customary 30-day trial period to really get to know the app.

Inkscape

The first free app in this rundown, Inkscape is an open source vector editor that can hold itself up when compared to Adobe Illustrator. Something that makes Inkscape stand out is the use of the open SVG (Scaleable Vector Graphics) format which is a W3C standard.

Verdict: While development might not proceed with the same speed as with paid apps, the Inkscape project is alive and offers a respectable number of features for free.

VectorDesigner

Another paid app is VectorDesigner, which in my opinion stacks up with Sketch (which I found easier to use). VectorDesigner offers the use of filters and Quartz compositions to shapes and images, and it also brings a Flickr browser to the canvas to make the search for images, colors and shapes easier.

Verdict: Whether or not you’ll like VectorDesigner will depend a lot on your personal preference. The inspector windows are much like the ones found in iWork, so if you like that kind of GUI, check VectorDesigner out at $69.95.

Lineform

Another affordable vector app is Lineform with freeflow text support (type text within shapes), morphing arrow functionality, powerful bezier editing and even boolean operations. Moreover, you can preview your images in CMYK color mode, preventing unpleasant surprises after you get your files back from a print shop.

Verdict: Lineform offers rich functionality for a very reasonable price of $79.95 and it should at least warrant a try when you check out vector apps.

Acorn

Surprised to see Acorn in here? Yeah, the little app actually offers vector support. It is not a dedicated vector drawing application, but you can add basic shapes and lines to your images and change their properties later on as well. If that’s all you need and you already own a copy of Acorn, rejoice.

Verdict: Since it is not a dedicated vector app, Acorn can only serve for very basic needs, but if those are all you have, why invest the time to learn a complex vector app? At $49.95 Acorn has lots of other functionality that you might come to appreciate when working with images, so you’ll have one editor for many purposes.

Mac Bitmap Design Software

Now that we’ve covered vector and web design apps, let’s take a look at the bitmap design apps that will – or should – be on everyone’s hard drive who is interested or serious about design.

Adobe Photoshop

By now it shouldn’t be a surprise that another Adobe family product leads the line up, but for professional design purposes, there is just no getting around this powerful application. While it might be argued that hardly any single person ever uses the full extent of the functionality offered by Adobe Photoshop, those needed functions are all there if you need them.

No matter if you’re doing web layout, photo manipulation, or extensive graphic creation – Photoshop just has the tools for all your needs. Add to that the huge community that comes up with brushes, gradients and other extensions to enhance the app further, and you have all the graphic power one can wish for at your fingertips.

Verdict: Yes, at $699 Photoshop truly is a huge expense, but for professional users, that money will be repaid quickly since you can compete with everyone out there. It’s only a tool, though – you’ll need to bring the talent to the show.

Pixelmator

Quite a young application in the vast market for image editors, Pixelmator has nonetheless acquired a huge following among Mac users already. For those who either can’t afford Photoshop or who simply don’t need all the tools, Pixelmator is a slimmed down yet still incredibly powerful app that can satisfy most editing needs.

It supports filters and layers, imports Photoshop brushes … basically you have slightly less than Photoshop but a ton more functionality than Photoshop Elements. Since it’s GPU powered, a powerful Mac can really enhance the experience.

Verdict: Pixelmator is an amazing product and I have come to rely on it as my editor on the fly. It’s fast, easy to use, and if you are not in need of all the things Photoshop has to offer, you won’t find better at a bargain price of just $59!

Acorn

Yes, I have mentioned Acorn already in the vector app section, but it is also a very nice editor for bitmap graphics. Just thought I’d mention it!

Seashore

Meet Seashore, an open source image editor, with layer support, boolean operations, gradients, brushes and transform tools. You can even apply filters and use effects. If your needs are more basic, for a private or team page, you will probably be more than happy with the feature set that Seashore provides.

Verdict: Non-professional users and those with no budget will find a handy tool in the free Seashore app which comes with many pro app features.

GIMP

Of course, we cannot miss out GIMP, the image editor aiming to providing a free alternative to the all powerful Photoshop and which has been around for ages.

It offers – for a free app – an astonishing number of features such as painting with brushes, pencil and airbrush, gradient editors and blend tools, advanced image manipulation with channels and layers, a wide variety of selection tools and extraction tools, animation support, and support for a large number of file types, including PSD.

Verdict: As a freeapp, GIMP is very well worth a look. The downside is that it still requires X11 to be able to run on OS X and it might scare non-tech-savvy users off.

Conclusion

That was our round up of essential graphic and web design apps for the Mac. Apart from the well-known giants of the Adobe family, I hope that we’ve opened your eyes to some of the other fantastic software available for the platform.

If we’ve missed anything out (I’m sure we have, somewhere!), please let us know in the comments. And feel free to share which software you use for your own needs as well.

Thanks for reading, and happy designing!


  • Ross Feldman

    No Fireworks?

    • http://caveim.com Denny

      I can’t figure out why people hate on Fireworks so much… it’s got tons of features custom-tailored for web development (optimize/export options, mulitple pages/master page, web layers, etc) yet everyone still seems to prefer Photoshop. Don’t get me wrong, Photoshop is great for certain tasks, but converting from PS to FW is one of the best decisions I ever made.

      • http://twitter.com/aholsteinson Arsen

        Me too, I used to swear by Photoshop but once I gave Fireworks a shot for web design, I haven’t looked back. It really is a superior app.

        I think Fireworks should have been included in the list. It seems like a hidden gem which for some reason many don’t use.

      • Jacob

        I don’t hate Fireworks, but I use Photoshop over it for these reasons:

        Fireworks only does web graphics where as Photoshop can do web and print.

        It doesn’t play nicely with bringing in complex vectors, gradients, etc from Illustrator.

        And most importantly it’s the most buggy and unstable piece of software I’ve used since Windows ME.

  • http://www.elblogolico.com.ar eMancu

    Thanks guys! yesterday I found myself looking for some alternatives to photoshop and I found Pixelmator that its great but not the one that cover my needs.

    I used to love Macromedia Fireworks, and I’m evaluating to buy a license of Adobe Fireworks for mac.. but first I’ll look into free alternatives.

  • http://carlosvidal.pe Carlos Vidal

    Intaglio is also nice vector drawing application. Macworld give it 4 mices.

  • Mike

    How about NetBeans. I use it for most of my coding now because it has a sleek interface (on the mac, at least) and it is free. I don’t even write Java so I just downloaded the PHP version.

  • David W

    What about Fireworks?

  • Bryanwoot

    Where’s skEdit that’s what I use??? But thanks for the post, its very helpful.

  • Andy

    No Adobe Fireworks???? Shameful.

  • http://fairheadcreative.com Adam Fairhead

    I was hoping you’d do this post sooner or later. Great read, thanks! :)

  • http://www.nemrod.info NEMROD

    I’m like rhe others …
    I’m pretty sure you know Fireworks;
    If it’s not here, it’s not a mistake.
    But why ???

  • http://www.rpgrafik.com Rasmus

    Can anyone recommend Flux3?

    I think i might buy it!

  • http://id.linkedin.com/in/rizky Rizky Syazuli

    “The Mac is geared towards creatives.”

    imho.. this post just proves how wrong that statement is.. from this long list, the only “creative” app that comes pre-installed is only iWeb. even your top choice for each categories are Adobe apps. last time i heard they’re available on windows too :|

    btw, sorry for being OOT.. I’m just saying that the “mac is for designer” argument is just so old..

  • uthne

    I myself use the entire Adobe suite as my work span design for both print and web (and some basic video editing). Even tho’ Dreamweaver is a great application for creating HTML, javascript and PHP – anyone serious about knocking out code for their webdesigns should look into AptanaStudio. I use it all the time for Javascript and PHP. It got all kinds of frameworks and code-completion for Javascript, AJAX, AdobeAir, PHP, Ruby, Python etc…

    Best of all though – it’s free!

  • http://www.indonesiatravel.nl Willem

    You should not forget to mention Freeway and Freeway Pro as website building apps. Very nice and now there is 5.5

  • http://luissalvador.net Luís Salvador

    I use Dreamweaver, Illustrator and Photoshop : )

  • http://buildorpro.com james

    And of course, if you want a design/dev app in the cloud there’s http://buildorpro.com

    I might be slightly biased tho… :)

    James @ Buildor

  • http://jump22.com Scott Montminy

    Gotta place another vote for Fireworks. It’s definitely the hidden gem in the Adobe line-up and the only Adobe product I could’t live without.

    Also, I must say that moving from Dreamweaver to Espresso has been very refreshing. Love the clean interface of Espresso!

  • Mark Osborne

    +1 for Fireworks!!

  • http://twitter.com/z0r z0r

    Dw? No way, Espresso rocks (even better than Coda to be honest). And Pixelmator is a hude thing as well.

  • Erica S

    I use Espresso myself. I think it’s awesome, after using both DW and Coda.

  • Pingback: Thursday Morning News | MacTalk Australia

  • http://www.grantmccall.com Grant McCall

    Fireworks is by far the best tool out their for designing interfaces, has both vector and bitmap tools, pages, master pages, styles.

    I just don’t know how people use Photoshop for designing layouts.

  • Jacob

    Great list. I use a lot of software listed here myself both at work and home.

    Although I’m surprised you didn’t meantion MacRabbit’s CSSEdit. http://macrabbit.com/cssedit/

  • http://davetaylormp.com dtmp

    How about SeaMonkey for a quick visual web editor. Although billed as a browser, it has some of those old Netscape editing features.

  • Steve H

    Vector Designer is nice, but all development has stopped so I would not waste your money there. Sketch seems like the way to go now.

  • Pingback: Best of AppStorm in November | Programming Blog

  • Pingback: Best of AppStorm in November | Mac.AppStorm

  • http://pixldinc.com/blog/ Prince Bazawule

    I’ve been an Adobe CS faithful for ages, but I’m ready to move on from having to cough out a small fortune with every Adobe Creative Suite release.

    With that in mind I am really excited about all the amazing alternatives listed in the post and the invaluable contribution from the comments as well. I seem to be tilting towards Panic or Coda

    I’d also quickly want to put my vote in for Fireworks. It is easily Photoshop and Illustrator rolled into one for us web peeps. > my opinion : )

    Thanks again guys!

  • Tim

    Inkscape requires X11…
    boooo

  • Tim

    I would also like to recommend Sketchbook Express and Sketchbook Pro by Autodesk. They are pretty awesome painting apps. Express is free through the App Store.

  • http://www.twitter.com/KodyBitch Kody

    Espresso and Pixelmator alone are more than enough to support my web/graphic design needs. :)

  • freed

    Adobe has some time ago gobbled up one marvellous vector design programme, the once supreme Macromedia Freehand. It sits in their pockets, some (but not all) of its main features have been transferred to Illustrator. Abandoned, and lacking any support, it withers further with each progression of the operating systems. A group of enthusiastic users has started a website http://www.freehand.org to reanimate this sleek software. Meanwhile, there are some 6.000 signers to the noble cause. I am one of them, and I encourage you to take a look at this charming alternative.

  • freed

    Sorry I mistakened the URL, it is http://www.freefreehand.org

  • http://www.feedamodel.com apple

    Hi there, I just decided to actually write and ask for help. I found your program (coda) in a frenzy and always ending up pointless search for “how to SEE..VISUALLY..and edit smarty code”
    This smarty is making me crazy! I am not a coder at all….I don’t know html text by ay means. I have always used dreamweaver to design sites. I am good with figuring out “what goes where and to what” when it comes to re-arranging and pulling from data base, etc…
    all i want is a program to visually see smarty code……or maybe you have a suggestion for my side (its social engine) to where I can change the look, menu items, what the search pulls up, item categories, a way to choose more than one “vendor type” for creatives that do more than 1 thing, and stuff like that. I don’t want someone to do it for me…I want so have a system where I can visually edit all those aspects. Any ideas? Thanks so much for any help you can provide. I am just going in circles here trying to “learn” the smarty stuff but its simply impossible…oh and the dreamweaver plugins that work with smarty still don’t give me anything I can actually progress with….. thanks for your help
    Apple Price
    ps my site is http://www.feedamodel.net. if you would like to see and add any advice or input…..but even in admin panel there are no tools for the templates and layout…..only a spot to add or edit code with text….if you have knowledge ..please help me…the site was a 10,000 site….and to me…it looks outdated and cheap…if I could only figure out how to visually see the layout and/or upload graphics etc…I would even create in photo-shop and upload…whatever can make it better at this point!

  • Tom

    I recommend Freeway.

  • Mark

    Sorry but the glaring omission from the Vector selection is Freehand. Although being starved to death by it’s current master Adobe, it still manages to work wonderfully. Superior in many respects to it’s step sibling Ilustrator. If only it could be wrestled free we thousands that still use it daily could look forward to a brighter future. Join the fight!

  • Dee

    I am after software to convert photos to vector images, without having to fork out the expense of Illustrator. Is there some thing out there that i can use.

    Cheers
    Dee

  • Alberto

    Hello, I`ve just bought Sketch, but It can’t import EPS.
    Anyone knows how to import EPS into Sketch?
    Thanks!

  • http://anson.3michigan.org Anson S

    Huh. What about Freeway for web design? It’s easy and blows the others away in features/power/ability.

  • http://www.report-articles.info/2012/05/26/Great-deals-by-Comparing-Auto-Insurance-Organizations/ comparison

    I’ve been recently thinking the very same factor personally lately. Glad to see an individual on the same wavelength! Nice article.

  • http://www.buyraybancanada.com ray ban sunglasses

    There are many useful tips soon enough in it all publish but I don’t understand if I notice all of them target to heart. There is a few validity but I will take hold opinion until I look into it all further. Great publish , appreciate it and we wish even more! Added to FeedBurner as well

theatre-aglow
theatre-aglow
theatre-aglow
theatre-aglow