3

Should I use sketch for wireframing?

over 7 years ago from , Interactive Media Designer at Allink AG

Lately I've been looking for alternatives to photoshop for wireframing. In this quest I came across a couple of articles suggesting sketch as a viable option. At the moment our office primarily works with Adobe products and with illustrator also being a resident tool in my dock I ask myself if instead of buying a new piece of software for the whole team I might as well just use Illustrator for this specific task.

What are your thoughts on this? Is Sketch a good tool to consider for this? And how does it perform vs illustrator for wireframing?

thank you!

20 comments

  • Ollie BarkerOllie Barker, over 7 years ago

    Sketch can work really well for wireframing. I think the best tool for wireframing is always going to be the one you find the fastest and easiest to use.

    I probably wouldn't use Illustrator because it's not pixel based, so it's harder to get a good idea of scale with it.

    Personally I use Photoshop, and Sketch occasionally when I've been working in that before on a project.

    2 points
    • Joel Sinnott, over 7 years ago

      Thanks your insights! But as far as I know, sketch isn't pixel based either. Or am I missing something?

      0 points
      • Ollie BarkerOllie Barker, over 7 years ago

        Technically Sketch is both vector and pixel I based, but it's more geared towards pixels than vectors. That's what I was trying to say :)

        0 points
    • matt michelsonmatt michelson, over 7 years ago

      Agree that it should be the fastest to use. Personally for me that's Illustrator, but any program where you're comfortable with the range of keyboard shortcuts will work. Illustrator's pixel preview mode does have its problems, but it's light years ahead of where it used to be. And for me, the ease of creating / applying /editing /sharing symbols and character/object styles makes it brilliant.

      1 point
      • Dean HaydenDean Hayden, over 7 years ago

        Shared symbols really is the key thing here. Sketch has an equivalent but it's nowhere near as good (in my opinion).

        Wouldn't worry too much about the pixel thing (though it is supported) as wire frames should only suggest layout.

        0 points
  • Sergey Jech, over 7 years ago

    I personally do wireframing in Sketch, then use the very same wireframes for elaborate design.

    Saves time when you have to do both!

    P.S. Sketch is awesome

    1 point
  • Guillermo MontGuillermo Mont, over 7 years ago

    Yep.

    1 point
  • brad wrage, over 7 years ago

    You should use it for everything.

    1 point
  • Scott Johnson, over 7 years ago

    In my opinion, no. I recommend a wireframing tool like Balsamiq or simply sketching. Otherwise you'll be spending too much time focusing on pixel perfection instead of figuring out function and high-level IA, which should be the point of wireframing.

    1 point
    • John MenardJohn Menard, over 7 years ago

      Agreed

      0 points
    • Joel Sinnott, over 7 years ago

      We do use Balsamiq for tasks like creating flow charts or real quick mockups for internal use and to be honest the sheer simplicity & intuitiveness of it would make it my first choice as well. Unfortunately it just doesnt look like much. The end result should be stripped of colors, styles etc. but still presentable for the client...

      0 points
      • Scott Johnson, over 7 years ago

        Yeah, that's understandable. They intended it to be ugly so you focus on function over form. Admittedly it's hard for some to realize that. I've learned that prefacing that fact before showing wireframes helps set expectations. Highlight the value of talking in terms of layout and function early without the prettiness. It can save time and money in the long run and changes are far quicker to make.

        0 points
  • Alice PhieuAlice Phieu, over 7 years ago

    I use Sketch for wireframing. Sketch + Marvel (for interactive prototyping) = awesomeness

    0 points
  • Olivier HeitzOlivier Heitz, over 7 years ago

    No, stick to Illustrator if you have it already and all you need is drawing boxes and lines. Sketch is only good for you if you want to use it for real mockups/design, not just the wireframing part of it.

    0 points
  • Tyrale BloomfieldTyrale Bloomfield, over 7 years ago

    Hell yes. It's all my team uses and its amazing.

    https://medium.com/p/ux-triage-what-i-have-learned-performing-ux-audits-around-the-globe-250266ac95a5

    0 points
  • Michael WhithamMichael Whitham, over 7 years ago (edited over 7 years ago )

    Sketch is sort of a hybrid between Omnigraffle, Illustrator and Visio. I don't know for certain that it was designed like that but it certainly seems like Bohemian Coding picked specific features from each of those to create a slimmed down, purpose focused software that Sketch is today.

    The thing about Sketch is that it's designed for ui design. It can do more but it's real focus is around creating user interfaces. I personally find Sketch to be more efficient in general, especially for wireframing. The key features that help are the artboards/layering system, shape tools, symbols and the plugins.

    Once Wireframes are created in Sketch you can easily convert them into the final full color ui, a lot less throw away work this way.

    Photoshop can do a lot and because of that it can get in the way of wireframing sometimes. If you're working with a lot of photos or you're an art director or just super comfortable with Photoshop then I'd stay with Photoshop. Don't switch for the sake of it.

    The present reality is that you're going to need a copy of Photoshop and Illustrator somewhere at the office; for working with photos, legacy design files or kits that you need to use.

    However if you're looking to boost long term efficiency around rapid creation of Wireframes and reduce costs in the long run, Sketch costs $99/per user vs $49/per user/per month with Adobe CC. Depending on the size of your team there may be a significant cost savings long term.

    0 points
  • Jeremy RouxJeremy Roux, over 7 years ago

    It all depends on your workflow and how comfortable you are in those software.

    I tend to stay away from Illustrator, I find it too heavy and laggy for my needs. I switched to sketch a few months ago, starting with wireframes only, but soon realized the potential, so wireframes naturally evolve into mockups without leaving the app - no more photoshop. Combined with the easy artboards management and export features, I find it's the most efficient way to work.

    0 points