/mockup

Simple yet useful mockup designer

Primary LanguageRedMIT LicenseMIT

Mockup Designer

Mockup Designer is probably the smallest and easiest mockup tool ever made. It is just one portable executable file with no dependencies, requires no installation, supported on both Windows and MacOS (and soon it will be available on Linux too).

You can express your UI design ideas to your customers or development team by drawing a mockup using Mockup Designer less than a minute.

Here you can see an example image made with Mockup Designer:

[MockupDesigner]

It's simplicity comes from the programming language used to develop it: https://red-lang.org

It is strongly inspired from Mockup Designer from Fatih Erikli (https://github.com/fatiherikli/mockup-designer)

Features

  • It supports 8 widgets: Label, Field, Button, Combobox, Radiobox, Checkbox, Table and Image.
  • Loading and saving project in a human readable format. You can even create or edit project files, or even generate!
  • Saving as PNG image

Shortcuts

Widget shortcuts

Press below number keys to create respective widgets.

  1. Label
  2. Field
  3. Button
  4. Combobox
  5. Image / Content
  6. Radiobox
  7. Checkbox
  8. Table

Other shortcuts

  • Arrow keys to move the selected widget
  • CTRL-L, to load a project
  • CTRL-S, to save project
  • CTRL-SHIFT-S to save as PNG image
  • F2 (or Right click) to edit widget text
  • D to duplicate selected widget
  • DELETE to delete selected widget
  • SHIFT-DELETE to delete all widgets
  • ESC to quit the program

You can also CTRL-Click to move to front and SHIFT-Click to toggle radiobox or checkbox state.

When you right click on table widget you can set the number of columns and rows, and the column headers.