Moqups – mockup and wireframing online tool

Posted November 21st, 2013 in Web Design. Tagged: , , , , .

Creating wireframes is an essential task when it comes to website designing. Wireframes help you to create simple sketches and illustrate the basic skeleton or structure of the website and its components. While cerebrating on the features we want on the website for example Homepage, Layout structure, Site components and navigational scheme, this is known as Wireframing.
Wireframing is surely going to save you time as before designing the website you’ll be creating site’s architecture, content and functionality On the other hand Prototyping is the process of creating a version of the website with full functionality and has same navigational features as the final website is expected to have. Special Prototyping tools are used to create prototypes.


One of the best tools used to create Wireframes, Prototypes, Mock ups and User interface is ‘Moqups’. This free HTML5 app is straight forward, easy to use and allows you to easily share prototypes that you create. The feasibility of using this app built on HTML5 and JavaScript makes it impressive and best in the Wireframing domain. A Google Chrome extension is also available in the Chrome App store making it easy for you to access your moqups account.

Providing a wide range of stencils and formatting options this app allows you to store the offline version of the design that you create or you may even store the design on cloud services like Google Drive or Dropbox. You are even allowed to share it through a link with your clients and colleagues.

A sample page with instructions for creating a mockup loads up quickly when you open the app. The stencil library located on the right hand side of the screen as a sidebar enables you to add components to the mockup while dragging and dropping them to the canvas. These stencils include radio buttons, slider, avatar, Rectangles and boxes, grid, iPhone, iPad, Pie chart, links, placeholder images and much more. We can change the color, states and shapes of some stencils while some stencils offer editable content on the other hand some can never be edited at all. Also, it has powerful stencil search options and with plentiful tags for the same. To annotate your wonderfully beautiful designs moqups provides a notes stencil to add descriptions, explanations and comments about designs and features of the design.


Moqups allows you to set the title as well as the height and width of your webpage and one of the most unique feature of moqups is the Grid snapping option and you can choose the size of your grid and select to snap objects to the grid for an enhanced alignment. It has smart guide feature which allows us to snap objects, align, edit and transform the objects. Moqups also allows you to lock and group various objects as per your need. It has 960 Grid System used in every part of the CSS frameworks. The 960 grid system helps the web developers by providing dimensions which are commonly used and are based on a width of 960 pixels. This grid is customizable and the dimensions can be changed according to the user requirements.

Moqups supports the Hotspot feature which allows you to link objects and elements to other pages. You can upload images using the upload images option and link them to pages using hotspot feature. Hotspot enables the user to link different prototypes together. You can use desktop keyboard shortcuts which you may already be familiar with, for example Ctrl+X for cut and Ctrl+V for paste, Ctrl+Shift+Z for redo and Ctrl+z for undo. There are many other keyboard shortcuts specialized for creating hotspots and editing stencils. These keyboard shortcuts enhance your wireframing experience and you can use the objects easily in a desktop like fashion. You can now even copy paste objects between different pages and projects making the mockup experience more comfortable.

Moqups uses secure SSL communication and all the data is backed up regularly on different servers where they are securely stored the privacy of the different projects created on moqups is taken care of seriously. It also offers markdown support too which is a text to html converter for web writers. Markdown allows you to write using an easy to use, easy to write format, then convert this plain text to structurally valid HTML or XHTML.
Moqups is free to use with or without signup. The signup procedure is very easy and hassle free you just need to have an email account. One can store up to 3 projects simultaneously on an account. While it also offers some premium features which are:

  • It offers real-time collaboration with clients and coworkers. This feature is very useful for people who work in teams to develop a certain project. Not only this, real-time collaboration with client helps the developers get reviews from the client and improve the flaws in the design according to the review. This also allows client to keep a check on the daily progress of the developer on a project.
  • Ability to leave a comment and feedback is a feature through which the client may leave a feedback for the developer when the design would be shared.
  • Master Pages for increased productivity enables you to set a basic page for all your pages which would save your time and energy while you work on different projects.
  • It allows you to create unlimited revisions on the projects which you store and even allows you to fork a new project from the current revision or branch off in a different direction as per your wish.
  • It offers Public as well as Private Projects.
    • Public Projects: Anyone having the link to the design can access it.
    • Private Projects: Only the people with whom you collaborate would be able to access the design.
  • Moqups offers unlimited archived projects to help you maintain your project quota and this may prove to be a good feature if you are planning to work on various projects at a time.

Easily create wireframes, mockups and prototypes with this free yet powerful HTML5 app: @moqups via @supermonitoring

Tweet this

The simple user interface and the ability to create wonderful wireframes this tool is earning a lot of appreciation by the web and graphic designers. As it is widely available to users free of cost and can be used instantly this app is now used popularly with over more than 30,000 unique visits daily. This Tool not only saves your time but also saves environment as you would drop down your pencils saving many trees and would love to design on this extremely pleasant and serene tool. This incredible tool deserves a 5 on 5 rating! What say?

Comments are closed.

  • Follow us

  • Browse Categories

  • Super Monitoring

    Superhero-powered monitoring
    of website or web application
    availability & performance

    Try it out for free

    or learn more about website monitoring
  • Superhero-powered monitoring
    of website or web application
    availability & performance
    Super Monitoring
    or learn more about
    website monitoring