The Best Mockup Tools To Plan Your Dream Site

Planning and mapping out your project is a crucial step in creating your idea. Whether it’s a website, mobile application, diagram, landing page or marketing page, you need to create a website prototype of how you think the product will look and function.

This is most important if you are creating this to hand off to a designer or developer, as they need an understanding of your vision. Our five favorite mockup tools are below along with more info so you can decide which is best for you.

**Learn how to Prototype Web and Mobile Applications with this FREE, online course from UX Guru Amir Khella**

1. Omnigraffle

A favorite among developers, Omnigraffle is a great tool for Mac OSX. This program produces graphics, diagrams, fast mockups and page layouts for your sit,e creating a result similar to what the final product will look like.

It has an extended option for stencils to help you further create a more detailed mockup.

Best used for: Detailed, realistic website layouts and mobile mockups. From $99.99.

2. Balsamiq

A fun, basic tool to use for non-complex mockups. Balsamic uses sketch-like icons and images to create the layouts you need. Unlike Omnigraffle, this tool has a more playful approach with simple drag and drop actions and is amongst the most widely used tools for designers and front-end developers.

Best used for:  iPhone mockups and website layouts. From $79.00.

3. Lumzy

This web-based tool has the look and feel of a Microsoft product, though it’s fairly intuitive and clean. Lumzy has a similar drag and drop experience as Balsamic but with straighter edges and realistic images and icons.

Best used for: Website layouts. Free.

4. Mockflow

Web-based with a ‘sketchy’ look, this tool comes equipped with user-generated templates. Simply use the templ