I am an experienced programmer but new to graphic design.

I am making mobile apps for both iOS & Android, and I am wondering what graphic design tools/software I should use (in Mac) would be the best fit for a starter and for designing graphics for mobile apps?

Any advice will be appreciated. Thanks.

  • A visual example of a style would be more helpful in the future. Shopping questions based on today's market are not going to be relevant for long, as the software will continue to change. Recommending the feature sets that you would want, along with some software that implement them, will increase the amount of time that this question can help someone else. – Alex Blackwood Feb 24 '14 at 19:25
  • There is no 'best' software. Use what works for you and your needs. – DA01 Jan 26 '15 at 20:08

If you have the device you're designing for, you want something that can pitch out the image you're working on, straight to the device, so you can see what you're editing on the actual intended screen.

This sounds so logical you'd imagine it's easy to achieve and that someone had thoroughly setup a situation that did this live, easily.

Not true.

Let's deal with Apple first, because you should always design for this platform first. If you need this explained as to why this generalisation is true, you probably still believe in a benign Microsoft and the "virtues" of laissez-faire economics. So use an iPad or iPhone to begin with. Android devices compound the fiddliness of doing this.

The best rig is either iDisplay or AirDisplay. //both also work for Android

I prefer iDisplay but do use both, and at $20 a shot, it's not like you're breaking the bank to try each. There's minor differences between them, both developers are responsive, but iDisplay is the little guy, and he's super cool with his email responses. So gets my nod:

iDisplay http://www.getidisplay.com

Air Display is here: http://www.avatron.com/apps/air-display/

// BOTH of these apps are designed for extending your display, so their benefits don't end with your testing of app interfaces dynamically. They're generally very helpful. iDisplay's touch screen responsiveness is (to me) a little better. So yes, you can operate your apps and draw on screen in Photoshop with these things. Amongst other benefits over things like Skala View etc.

Now for the hard bit. You need to get your work view over to the screen without borders and chrome etc.

Some apps are good at this, some are near impossible to get right.

Indesign is good at this. It has a full window preview mode that you can push out to the iDevice, as a duplicate of the open document, so you continue working in Indesign on the computer and see live updates on the iDevice screen.

I prefer a more powerful vector app for editing than Indesign, so I embed an Illustrator document into that Indesign document with live linking and then draw in Illustrator...hit a key combo that updates everything in Indesign and see it all update on the iPad/iPhone.

Adobe Bridge can do similarly, more directly, but is so prone to "losing its connection" that it's only stable for a few updates to the original file.

Photoshop is rather painful to work in for interface design, because it's not really suited to the job, and Fireworks, which was excellent for UI design is now a thing of the past. BUT, Photoshop can also do second screen, full screen previews with a duplicate of the current document, so you get live updates on the device, without chrome and other nonsense obscuring your full screen viewing.

I've spent a lot of time testing these sorts of setups to do LIVE editing on the device, and this can be much more fiddly and unreliable than it should be, so please don't be shy about asking more questions. It may well be annoying to setup. But it's very much worth it for the ability to live edit and preview onscreen.

It would be completely remiss of me to not point out that this app does this "automagically", apparently:


I haven't tried it. But it's worth considering.

Sorry, while I'm handing out free advice, one more thing. If you're a competent programmer I think you should focus on becoming a great programmer. They're very rare. And in so doing, partner with a designer for design. Design might look like anyone can do it, that all you need do is learn the tools. But there's a magic ingredient to design, and that's an intuitive understanding of humanity's desires and opinions, feelings, sentiments and the zeitgeist of now. This is something that can't really be taught or learned. You either have sufficient empathy to be a designer and will push through learning the tools to express that, or you're a programmer.

If you're a programmer, and can communicate with a designer, that will ultimately be a 1+1=3 type of equation. You'll both benefit massively from the others talents, and be able to more deeply focus on your own talents and improving in that area.

So, in deeper answer to your question, the best design software for you to use is a designer.

  • Thanks for your detailed information. However, probably my question wasn't clear enough, I am actually wondering what graphic design "software" I should use. For example, should I use PhotoShop, illustraotr, iDraw... the graphic designed will be used in a mobile game app. That's what I really like to know. Thanks. – Joe Huang Feb 22 '14 at 9:10
  • argh, that question is almost impossible to answer. Almost. We're in an interesting point in time when new drawing ideas are coming about, and if you're not already an Illustrator convert, and don't need the "rep" of being an Adobe user, I'd suggest drawing with Apple's Motion. For 2 reasons. 1 it's got very cool drawing tools, and 2. You can animate stuff, which is a HUGE boon for testing UI ideas. And it's only 49.99. – Confused Feb 22 '14 at 9:20
  • Further to this, using a modern Apple app will be a great insight into how UI can be. Adobe's software has (gently put) archaic user paradigms. I'd strongly suggest avoiding it if you can because just about every other app does it better. – Confused Feb 22 '14 at 9:23
  • Joe, please see new last sentence in my "answer". If you can express what you need, and how you want it, this is probably 10x faster for 10x better result. It looks like you're probably working in Corona, making some kind of game. That's a great place for designers to have fun. Designers have a lot of talent and time on their hands, it's just a matter of finding one that understands how difficult and time consuming programming is. Then you're balanced and set to go. – Confused Feb 22 '14 at 9:39
  • Thanks a lot for your advise. I can understand your point (work with a designer). However, here is my situation. When I am trying to make some prototype of a game, I really need some fast development of some graphics regardless of its quality. I usually work with designers, but now I am thinking what if I can do it by myself first, would it save more time? And later, if the game is developed into a certain phase, I can start to work with a designer to replace the graphics used in the game. – Joe Huang Feb 24 '14 at 1:44

In the past I've mainly used a combination of Photoshop for actual pixel rendering and Illustrator for vector artwork (icons, bars, illustrations).

To preview artwork on my devices I've used Liveview and Silkscreen.

The pros to Liveview is that it's broadcasting a live view of a particular view port to your device from your desktop. The con is that it's broadcasting a live view of your desktop. I found myself moving windows a lot or screens savers triggering and needing to log back in.

The pros to Silkscreen was that it creates a new preview image every time you save your PSD. The cons to it was it didn't retain history of recent PSDs for quick reference so I found myself reloading files a lot.

There are a lot of interesting products coming out to assist designers with previewing artwork, though most of the time nothing is better than actually building the app. The recent Facebook Paper app was designed with a custom design tool built on top of Quartz Composer. (Source)

My best advice is to find some tools you're comfortable with and use those. Since you're a developer using something like Quartz Composer or even the open-source tool Facebook built on top of Quartz, Origami.

Not the answer you're looking for? Browse other questions tagged or ask your own question.