Use QuickMockup for Quick-and-Dirty Prototyping

Productivity Sauce

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.