Design

5 Best Wireframing Tools

By May 22, 2014 No Comments

I mentioned before that wireframing is one of the most important steps in creating a new website or mobile app design. However, finding the right tools to do that can sometimes be tricky. So I’ve put together a list of my favorite tools to help you kick start your next project.

  1. Balsamiq

    Balsamic Wireframe

    Balsamiq is a user-friendly digital tool that will help you create quick and easy wireframes. Its user-friendly interface allows you to drag and drop and has plenty of UI elements to choose from. But quick and easy wireframes are not always the best, as these sometime come out looking childish and messy. At any rate, this tool will allow you to focus on content and functionality rather than design.

  2. Fireworks

    Fireworks Wireframe

    Fireworks is one of the more popular tools amongst web designers for wireframing and designing. Not only is it geared towards web and mobile app creation, but it also has professional UI templates and wireframes built right in. Even though Adobe announced that they would no longer be including feature updates for Fireworks, I’m sure it will continue to be a popular program amongst designers.

  3. Mockingbird

    Mockingbird Wireframe

    MockingBird is one of the best, free wireframing tools. Like Balsamic, Mockingbird has a user-friendly interface with drag and drop tools. It also has great built in features such as 960 grids, blue prints, exportable pdfs and easy sharing capabilities. This tool is strictly web-based allowing quick and easy access with nothing to install or download.

  4. Photoshop

    Photoshop Wireframes

    Photoshop is most known for it’s graphics editing capabilities, but it’s also a great tool for UI design and fantastic for wireframing. If you spend the time to lay out your content areas and measure your spacing from the beginning, you will be able to use the exact same file to start your design mock.Plus your wireframes will look clean and professional.

  5. Pen and Paper

    Pen & Paper Wireframes

    Use a pen, paper, or even markers and crayons and wireframe the good old-fashioned way. This can be great when meeting with a perspective clients or even a coworker. It just might be the quickest and easiest way to get your thoughts on paper.

 

What’s your go-to process for wireframing? Have you used any other good tools?

Executive's Guide to Web Development

80 pages of topics and tips to navigate your way to a better website.

Leave a Reply