Use QuickMockup for Quick-and-Dirty Prototyping

Dmitri Popov

Productivity Sauce

Jan 27, 2016 GMT
Dmitri Popov

Next time you need to sketch an app interface or a web page layout, you might want to give QuickMockup a try. It may look somewhat crude, but this simple tool lets you whip up quick mockups in no time from the convenience of your favorite browser. Written in HTML, JavaScript, and CSS, QuickMockup requires no installation. Grab the latest version of the app from the project's GitHub repository, open the index.html file in a browser, and start building mockups. The app offers all basic interface elements such as buttons, drop-down lists, text fields, progress bars, sliders, and more. If you have a working knowledge of HTML and CSS, you can add custom elements too.


Building mockups is a matter of dragging the desired elements from the left sidebar onto the canvas and arranging them the way you want. The sticky notes items can be used to annotate the mockup, and you can use Markdown for formatting text inside the notes. There are two options for saving the created mockup. If you choose to save it as a complete web page, the resulting HTML file will retain interactivity, meaning it can be edited further. If you want to export the mockup as a view-only page, save it as a single HTML file.

comments powered by Disqus
Subscribe to our Linux Newsletters
Find Linux and Open Source Jobs
Subscribe to our ADMIN Newsletters

Support Our Work

Linux Magazine content is made possible with support from readers like you. Please consider contributing when you’ve found an article to be beneficial.

Learn More