UX: Omnigraffle, Axure or Illustrator?

  • Started
  • Last post
  • 30 Responses
  • iGin

    I sometimes think all these UX tools are mostly there for those who can't use Illustrator (like peeps from a more technical than visual design background).

    Do you use these tools? and what do you think is a plus Illustrator doesn't have?

  • dpi0

    Usually useless. Only + side is that people without illustrator can add or change

  • microkorg0

    We use Axure for wireframing. It's pretty decent in terms of functionality and you can now host your wireframes on their cloud as part of the service.

    It's mostly all drag, drop, position and format.

    Definitely not a design tool but great for wireframing with little technical knowledge needed.

  • mg330

    IGin, that statement about Illustrator is ridiculous!

    Yeah, it will work if you are doing a couple pages of the website.

    • I believe for e-commerce or news site Omnixure and the like are perfect but when it comes to wireframe a game, an interactive installation or anything that goes slightly beyond tap/slide/tap-back gestures then Illustrator to me is the only one that can let you freely draw any shape instantly.iGin
    • an what? Continue, please.mg33
    • Back to this thread after a year.
      Go read the last post on the 2nd page. You'll find out what.
      iGin
  • mg330

    ^ sorry, I hit broadcast too soon. Lots of people like myself who are in UX roles are using things like Omnigraffle and Axure to produce large sets of wireframes, modules, templates, responsive versions, prototypes, etc. and it would be a nightmare to do all of this in illustrator.

    You are going to find very few people doing comprehensive UX work that would solely use illustrator to create their wires.

  • vaxorcist0

    I think its a risk to do this in illy, because some people might think you can "just export that illustrator file to photoshop and start a mockup in the next few days and we're almost done now, aren't we" .... that's the OPPOSITE of what a wireframe is, but it seems a few too many people want to really make the website LOOK like the wireframe, argh...

    why do so many websites end up looking way too much like the wireframe?!?!?!?

    ...then again, if clients and account people really could previs everything well, designers would have much fewer jobs...

  • mg330

    1 - 2 pages in Illustrator with simple annotations, maybe...

    But you can't save multiple Illy files to a single PDF can you? I can't imagine the person who would be cool with opening dozens of individual pages to view single wireframes for a big set of them.

    Also, vaxorcist brought up a good point about what a wireframe is and isn't. I'm of the opinion that the positioning and placement of widgets, navigation, text, etc should be as close to what is desired as possible. But I work with a designer who might be happy if I just placed everything at random on a page and he'd just figure it out. They need to be much more informative than that.

    I'm also doing wireframes with serious annotations and requirements in them. Big tabloid sized pages. Tables of contents, links all over between modules and templates, reusable master shapes ( in Omni - if any of you aren't aware of master shapes in Omni, similar to what Axure has, let me know and I'll post a link). Can't imagine doing that with Illustrator.

    I also use the online tool www.uxpin.com for quick small projects. Really nice.

    • Use artbords in illustrator.jtb26
    • Also totally agree on your wireframes comment.jtb26
    • +1 illustrator artboardiGin
    • The fact you didn't know about artboards only confirm a bit more that you don't use illustratro because you don't master itiGin
  • jtb260

    I use illustrator. Especially for wireframing, but I also use it for creating site maps and user flows. I have template kits that I use that speed this up for me. I know other people who have used omni graffle and axure, but they're just not for me. I know AI, I'm not going to waste time bumbling around in something I'm not familiar with.

    Although, more and more I end up doing this in something that I can turn into a clickable prototype. So Adobe Muse has been really good for this. I wouldn't create a real site in it but for wire framing it's great.

    Vaxorcist. I think the finished site should resemble the wireframes. Not aesthetically of course, but I think it misses the point to create a wireframe and then tell the client "This isn't prescriptive of layout." If you're wireframes don't demonstrate the layout you've a.) done them wrong. b.) you've wasted your time.

    I agree though you're only part of the way there with wireframes. You shouldn't just be adding color and photos to the wireframe and calling it a day.

  • Peter0

    Omnigraffe and Axure are both pretty great.

    Would never use illustrator for wireframing, it's just not built for it. Not specifically anyways. Like using Outlook to write novels.

    Prefer Axure though. What I find very helpful (with either these day) is that once you've come a bit into the project, got sizes, layout and some basic functions done, you can replace wires/object with graphic and see how things look in action. Helpful on more than one level.

    >I sometimes think all these UX tools are mostly there for those who can't use Illustrator

    > + side is that people without illustrator can add or change

    This is not so much of a plus as a giant minus. The part about everybody now being able to fuck around.

    ...but maybe that's my current workplace talking, where kids without any prior knowledge is assigned and put in charge of wireframing. Kids that laugh at the word "information design" because they haven't even heard of the word before, less so even know what it is (that they're doing), but alas, there they are.

    Nothing good comes out of it without coupled with education and experience. Whether the easy dedicated software, or some basic knowledge in illustrator that so many kids now seem to have.

    • oh. didn't finish that last sentence. Im off to bed.Peter
  • jtb260

    Reading everybody's post I think the real answer is this:

    ♪ ♫Now the world don't move to the beat of just of one drum. What might be right for you, may not be right for some.♪ ♫

  • monNom0

    Use whatever you're fast in. Illustrator, Axure, Pencil and Paper. The best tool is the one that gets out of your way and lets you test your assumptions quickly.

  • kona0

    Ugh. Photoshop used to be the tool of choice for wireframes when I came on board. The correct size of art, it's placement, the font, everything was in done in Photoshop. The first time I saw one I asked "What's this?!?" and the team was like "that's our wireframes!" I laughed and said "well then what's left for my guys to design" and the response was no duh comment of "coloring the buttons of course!"

    Fuuuuuuuuuu

    Now we use Omni. They went from Photoshop to Illy and never used art boards or smart objects of any kind. Any global change had to be made individually on a page-by-page basis, and we're talking hundreds of pages. Ah good times.

  • mg330

    The "master objects" that I referenced above for Illustrator are explained here:

    http://viget.com/inspire/how-to-…

    That's from 2010; I'm surprised this method hasn't made it into documentation for OG since then.

    A tip: When you copy the object, delete the original or at least don't edit the original thinking that it's going to update across the board. You need to use/edit the pasted version - it will open in a sort of stencil edit window. Very handy and can't wait to start using this more.

  • spot130

    I use http://www.gliffy.com/ for wireframes

  • omg0

    FFS I'm surprised that Adobe doesn't have their own wire framing tool already.

    • They do. It's called illustrator :Pjtb26
    • It was Fireworks. I still use it but realize it will go away.Josev
  • nylon0

    I had been using hotgloo for wireframing I love it

    • I didn't like that it was Flash based. UXPin is much faster online.mg33
  • cannonball19780

    Balsamic is aight. Omnigraffle is fucking horrible. Never used Axure but heard nice things.

  • iGin0

    Hmmm ok... you guys convinced me that Omni and Axure are the right toys for big sites featuring legions of modules, sub-sub-pages and multi-level footers (e.g. e-commerce or new sites and mags).

    But there’s still a lot of projects like native mobile games or anything that explores the vast world interaction beyond "tap call to action button" / "select radio button" / "tap ok button" for which to me Illustrator is still the only tool allowing you to wireframe a UI and define an experience without predefined boundaries.

  • mg330

    " Illustrator is still the only tool allowing you to wireframe a UI and define an experience without predefined boundaries."

    Not trying to be harsh man, this is a good discussion, but how on earth do you actually believer this statement? I'm so totally confused by what you're claiming here. I use Omnigraffle to create most wireframes. It has shapes. Text. Prototyping capabilities. An open canvas. Layers. I can do 100% of what you can do in Illustrator (and then some) to lay out a web page so that it conveys the desired information architecture. I can do the same with Axure, with Balsamiq, with UXPin, with Hotgloo, with Viseo (although Viseo is total vomit).

    I think you're trying to sell up your expertise in Illustrator to prove that you don't need to consider other tools for smaller jobs. And that's totally fine depending on the level of detail needed. But your claim in the last sentence is pure nonsense.

  • vaxorcist0

    ok... honestly, this flexibility of Illy is a blessing and a curse, as you can make things from scratch, this may help, say cram more stuff in, or stretch things out to fit, BUT that may encourage more last minute randomness....

    ....also, Illy has one strange "designer advantage" ... it's much harder to learn Illy than most of the other tools, so there's some "job security" and/or ability to control things, prohibiting the "ms-office-only" suits from messing with your wireframe....

    But it also means it's more and more about tweeking and less and less about very quickly sketching out possible scenarios which is a main idea of such things....

  • Peter0

    > to me Illustrator is still the only tool allowing you to wireframe a UI and define an experience without predefined boundaries.

    I assume by "defining an experience without predefined boundries" you mean graphics/custom shapes, since that's the one thing Axure and the likes doesn't do.

    And why should it?
    It's wireframing; it's functionality, it's information design. The part where cosmetics, "fun", is not put into visuals yet. And for good reason.

    ...and if you absolutely have to do that it's perfectly fine importing images...

    > a lot of projects like native mobile games or anything that explores the vast world interaction beyond "tap call to action button" / "select radio button" / "tap ok button" for which to me Illustrator is still the only tool

    Personal opinion here of course, but dedicated software is more than fine for doing that (and boy is there more options than just "tap here", btw). In fact I used it exclusivly for a mobile game pretty recently.

    Granted if you're comfortable using illustrator for things then go for it. I, no one, can tell you how to work best or get the job done. But I think you would benefit from looking up those software a little more, since you obviously are working in the field. Check out the advanced tutorials then head on to the specific forums. Check out what people crank out.
    It's not that hard to get up to speed with it, and the payoff is great imho.