Ask HN: what tools do you use for UI mockups?

https://news.ycombinator.com/item?id=5558802

by offdrey • 13 years ago

15 26 13 years ago

news.ycombinator.com

I am currently trying to choose a product for making UI prototypes. So far I've found these : Balsamiq, FlairBuilder, Moqups, JustInMind, Axure RP. So I was wonderng if anyone had any experience with them or other ones?

aespinoza3• 13 years ago

I used Visio for the longest time. This year though, I began using balsamiq (http://www.balsamiq.com/) and I am extremely happy with it.

I have also seen Jetstrap (https://www.jetstrap.com/) and it looks very cool but haven't tried it myself.

[EDIT] Fixed Typo.

codegeek• 13 years ago

also check out http://easel.io

thdn• 13 years ago

Take a look at http://pencil.evolus.vn , it can run as an standalone .exe and also as a firefox extension.

palidanx• 13 years ago

http://www.cacoo.com

userium• 13 years ago

I have used Mockingbird (https://gomockingbird.com/) and Balsamiq (http://www.balsamiq.com/) in the past. Currently I like to use Omnigraffle pro (http://www.omnigroup.com/products/omnigraffle/).

mrgreenfur• 13 years ago

I use and adore Omnigraffle. It is hands down the best diagraming software I've ever seen.

gee_totes• 13 years ago

Totally recommend https://www.draw.io if you're on Google Apps. Syncs with Drive, has a ton of cool elements, and all elements are super customizable if you know a little code. Also the developer is very responsive -- I've submitted bugs and feature requests and they've gotten back to me right away.

bwh2• 13 years ago

Whiteboards and a camera phone for sketching; HTML+CSS+JS (Foundation or Bootstrap) for clickable prototypes.

kurotek• 13 years ago

If you are on a mac, I'd suggest checking out http://keynotekungfu.com/

monkeymajiks• 13 years ago

Keynote and keynotopia is a winning combination. It's super quick and can output to a vast number of formats.

ajaxguy• 13 years ago

new kid on the block : webflow.com I haven't tried this yet.

ereckers• 13 years ago

I use Balsamiq (which is great and I would highly recommend) as well as a simple yellow Tops notepad.

chris_mahan3• 13 years ago

Pen and paper. If I need to have an electronic version, I take a picture with my 8 megapixels phone camera and I email it.

It's the fastest tool, but it does require knowing how to draw straight lines.

It also leaves management under no illusion that the thing is "almost done".

I work at a company in the top 15 of the Fortune 500.

aespinoza3• 13 years ago

I agree to a certain extent. I still use my notebook to create mock ups, but nothing beats balsamiq's demo-ability. The fact that you can take a mock up and make it interactive, and show the real flow is amazing. I have taken our mock ups done in balsamiq to design meetings, and it makes it extremely easy.

chris_mahan3• 13 years ago

The thing I like about pen and paper is that I can go hang at the local coffee house or library or park, and not have to worry about wifi. Also, a guy scribbling in a book isn't as stared-unwelcomingly as a guy with a laptop.

tallofrenzy• 13 years ago

Unfortunately,with pen and paper, it gets clumsy when you have to erase (even if you use a pencil/eraser)..

chris_mahan3• 13 years ago

That can be a problem. I usually just make all the changes I need (gets scribbly fast) then turn the page and copy the good stuff to a new page. This works because I can draw fast.

michaelbuddy2• 13 years ago

Axure is a good tool. Really easy to get up to speed and small niceties that keep things quickly moving. I like it better than the Free 'Pencil' software because you can mockup dropdowns really easy. You can also change the fidelity of the mockup so it looks like hand drawn. Seems gimmicky but people sometimes need it to be hammered into them that it's a wireframe.

When you export, you can export to a working clickable mockup with notes and things on it. I've felt pretty darn productive with Axure and that's why I recommend it.

meerita• 13 years ago

Adobe Illustrator all the way.

rbargagli• 13 years ago

We use InvisionApp (http://www.invisionapp.com/)

You transform designs into beautiful, interactive web & mobile mockups and you can receive feedback and collaboration in real time inside the mockups

offdrey• 13 years ago

Thank you everyone for the feedback. So far I really enjoyed using balsamiq. I like how simple it is.

inokon• 13 years ago

Hi, I have been looking at fluidui which is purported to be faster than paper for web apps. I like it because you the UI is drag and drop. You can zoomout and just make a thumbnail view or zoom in and detail each page. I like invisionapp for stiching together your paper or illustrator sketches with hotspots and an easy to email url that invites you to bookmark the app. I bought Balsalmiq because it was so dang satisfying but I find my workflow is not awesome because I can't play with it easily on my phone.

Right now I just bought a $4 pad of news print from BLICK. It's cheap and I can use it on the airplane which is where I'll be tomorrow. HTH!

bitlather1• 13 years ago

I like Balsamiq because it's easy to work with and the jagged edges boldly state "I am a prototype, not the final product"

michaelbuddy2• 13 years ago

If you work on Windows and want something with full vector graphic drawing, take a look at Xara Designer Pro or Xara Web Designer Premium. You'll have drawing capabilities like with Illustrator, but it's faster and you can assign things as buttons and mockup working websites.

You can make working dropdown menus too.

It produces a lot of absolute positioned css code, so it's not integrated with any web framework but does render pixel perfect.

I'm not sure how it would handle a responsive site, probably not, but you could quickly mockup the mobile version though.

You might also look at Corel Draw too.

If you want free, again Pencil, Inkscape or try the Google Draw templates - http://mortenjust.com/2010/04/19/a-wireframe-kit-for-google-...

another recommend for draw.io and also look the maqueta software - http://maqetta.org/news/2011/ibm-contributes-maqetta-html5-v...

professorTuring• 13 years ago

I use the well known InkScape http://inkscape.org

Ask HN: what tools do you use for UI mockups?

Related Stories