UX Tools: Wireframing and Prototyping Tools

• 6 min read

658 Shares

Today, let's look at some great value options for developing wireframes and prototypes for your project. If you’re not sure what these are; let’s refresh your memory.

What is a Wireframe?



A wireframe is a model of your site without the coding and design. It can be used to test ideas for your UX project before you deploy expensive design and development resources. In general this tends to be a low-fidelity approach and won’t look too much like the end project.

What is a Prototype?

Similarly, a prototype is also a model of your site/app but often some of the design elements are already developed and a high-fidelity prototype will include visual mock-ups and even some of the functionality that you intend to test.

Pencil


It’s hard to beat free as a price point for a tool and Pencil is a fully open source prototyping tool. It’s easy to use and has a good support community too. There are a number of stencils and templates available that help you mock up an app in the correct environment. The drag and drop interface makes building prototypes easy.

FileSquare

FileSquare is a free to use, community based online product for developing simple prototypes that work on a click-through basis. You just upload some mocked up images and then connect them using the software. There are premium options available which add functionality too.

Handcraft

For those who want a bit more oomph from their prototyping tools; they might want to consider Handcraft which is a paid for tool (though there is a 30 day free trial) starting at just under $20 a month to use. You can develop your prototypes using HTML, JavaScript and CSS. The website is not the prettiest though and you’ll need to use the trial to gain some appreciation for the features.

PowerMockup


PowerMockup is focused on turning PowerPoint into a wireframing and prototyping tool; they supply templates and tools to do just that. The price point is not extortionate starting at about $60 for a permanent license but there are always going to be limits to just how much you can do from within PowerPoint.

Moqups

Moqups is a completely online tool and won’t be a favorite of UX folks working in areas with dodgy internet connections. It is however incredibly simple to use and there’s no mucking around – as soon as you land on the Moqups page – you’ll be starting to create that first mockup. It is a paid for product and licenses start at less than $10 a month.

JustInMind


JustInMind has a free trial and after that it has a monthly subscription cost of around $20. It works on Windows and Mac OS and is designed for web and mobile application prototypes. It’s pleasing on the eye too.

One More Thing

As usual IxDF does not recommend any specific tool for your project; you need to decide which tool is the right one for your team. 

Header Image: Author/Copyright holder: Unknown. Copyright terms and licence: Unknown. Img

Image Source:

ZURB (link to image)

Best Vendor (link to image)

PowerMockup (link to image)

Graphic Rating (link to image)

Kim Bieler (link to image)

Learn More in This Course:

AI for Designers

10 days
16 % booked
View Course

What You Should Read Next

  • Read full article
    Why Care about Statistical Significance? - Article hero image
    Interaction Design Foundation logo

    Why Care about Statistical Significance?

    The categorical data depicts the success and failure rate of the low-fidelity wireframe above. There is not a large enough difference between the two to determine if the designs were successful.There is an element of error involved in measuring anything. So, when we want to compare measurements, how

    Social shares
    431
    Published
    Read Article
  • Read full article
    Web Fonts: Definition and 10 Recommendations - Article hero image
    Interaction Design Foundation logo

    Web Fonts: Definition and 10 Recommendations

    Web fonts bring digital content to life. They enhance readability, set the tone, and ensure consistency across various platforms—all vital ingredients. When you understand web fonts and their impact, it can help you with effective website creation—and greatly so. We’ll provide a comprehensive overvi

    Social shares
    780
    Published
    Read Article
  • Read full article
    How to Screen Research Participants - Article hero image
    Interaction Design Foundation logo

    How to Screen Research Participants

    Finding the right participants is crucial for gathering user research. We usually need to do research with participants having a particular set of needs or experience. In this short video, you will find out about the basic need for screening and how we make sure that we have suitably qualified parti

    Social shares
    450
    Published
    Read Article
  • Read full article
    Pitfalls in Recruiting Participants for User Research - Article hero image
    Interaction Design Foundation logo

    Pitfalls in Recruiting Participants for User Research

    The level of participant engagement is an important part of the user research results. Our results are dependent on proper engagement with our participants. In this video we look at some of the issues around participant recruitment and hear practical examples that arose in a large online study.[[vid

    Social shares
    418
    Published
    Read Article
  • Read full article
    How to Fit Quantitative Research into the Project Lifecycle - Article hero image
    Interaction Design Foundation logo

    How to Fit Quantitative Research into the Project Lifecycle

    Quantitative research methods fit into the project lifecycle at different stages of the process.In this video, we see where different quantitative research methods fit into a typical project lifecycle. Bear in mind that even with an iterative process such as Agile, the short cycles still address dif

    Social shares
    509
    Published
    Read Article
  • Read full article
    How to Resolve Conflicts Between Design Thinking and Marketing - Article hero image
    Interaction Design Foundation logo

    How to Resolve Conflicts Between Design Thinking and Marketing

    In the past, designers often reported to marketing managers and were neither expected nor allowed to make business decisions. When traditionally-structured companies transition to a design-driven mindset, there can be friction between the marketing and design teams. Let’s take a closer look at this

    Social shares
    682
    Published
    Read Article
  • Read full article
    Stop the Generic Portfolio Trap! Design a Stand-Out Portfolio for Your UX/UI Niche: User Research - Article hero image
    Interaction Design Foundation logo

    Stop the Generic Portfolio Trap! Design a Stand-Out Portfolio for Your UX/UI Niche: User Research

    User research is indispensable—and without it, well... UX design is guesswork. When you’re a user researcher, you know this well—but it can be hard to communicate your work in a way that grabs the viewer and holds their attention. And that’s what a portfolio is all about—grabbing the attention of yo

    Social shares
    382
    Published
    Read Article
  • Read full article
    Top Service Blueprint Templates - Article hero image
    Interaction Design Foundation logo

    Top Service Blueprint Templates

    Service blueprint tools are vital for effective customer experience design—and for designers to make experiences that are exceptional. Here, we’ll discuss why these tools are so important. What’s more, we’ll explore templates and practical resources to create high-quality, efficient service blueprin

    Social shares
    637
    Published
    Read Article
  • Read full article
    How to Write Research Questions that Lead to Confident Design - Article hero image
    Interaction Design Foundation logo

    How to Write Research Questions that Lead to Confident Design

    Designing with Data provides an extensive background to A/B testing.As with all other research methods, we need to start with a research question. A/B testing concerns itself with changes in user behavior, meaning that our questions need to be centered on measurable goals. In many cases, these will

    Social shares
    449
    Published
    Read Article
  • Read full article
    Getting Started - Article hero image
    Interaction Design Foundation logo

    Getting Started

    We start our introduction to A/B and multivariate testing (MVT) by looking at their basic principles and their differences. Note that the video mentions Google Optimize, which has been withdrawn. Google Firebase can be used for mobile platforms. Third-party solutions are needed for A/B testing on th

    Social shares
    223
    Published
    Read Article

Top Articles

Top Topic Definitions

Feel Stuck?
Want Better Job Options?

AI is replacing jobs everywhere, yet design jobs are booming with a projected 45% job growth. With design skills, you can create products and services people love. More love means more impact and greater salary potential.

At IxDF, we help you from your first course to your next job, all in one place.

See How Design Skills Turn Into Job Options
Privacy Settings
By using this site, you accept our Cookie Policy and Terms of Use.
Customize
Accept all

Be the One Who Inspires

People remember who shares great ideas.

Share on:

Academic Credibility — On Autopilot

Don't waste time googling citation formats. Just copy, paste and look legit in seconds.

Feel Stuck? Want Freedom?

Get one powerful email each week, like 326,226 others.

Learn to design a life you love.

Next email in
6
days
20
hrs
45
mins
20
secs