Nudge and duplicate actions, better button widget and more

Posted on by - Comments

Hi there! I am happy to announce a new release of WireframeSketcher. This new version brings a new set of improvements meant to improve your productivity. Please read on.

Nudge actions

Nudge actions let you move widgets using only your keyboard. This is very useful when you need more precision. I’ve made a few changes so that widgets can now also be resized using keyboard shortcuts. To make this all work consistently existing shortcuts had to be modified slightly:

  • Arrows – Nudge selection by 2px
  • Shift+Arrows – Nudge selection by 20px
  • Ctrl+Arrows – Nudge resize selection by 2px
  • Ctrl+Shift+Arrows – Nudge resize selection by 20px

The logic is simple. Use Ctrl (or Command on Mac OS X) for nudge resize. Use Shift to nudge in increments of 20px.

There is also Alt key that you can use to reduce the increments to 1px and 10px respectively. However there is a slight problem with Alt+Ctrl combinations on Linux so lets say that it’s not an official shortcut for now.

Duplicate action

Duplicate action is something you can find in most graphical editors and WireframeSketcher now also has it. The shortcut for duplicate is Ctrl+D.

Duplicate works mostly like Copy&Paste. So instead of using Ctrl+C, Ctrl+V you can now simply press Ctrl+D.

However duplicate is a bit smarter than just a simple Copy and Paste. When you duplicate some widgets, move them and then duplicate them again, the duplicate action records the relative position of your first copy to the original and then positions the second copy relative to the first copy in the same way.

If it sounds complicated then try to quickly create a form like this. Create a label and a text. Select both and press Ctrl+D to duplicate them. Align this first copy vertically with the original. Press Ctrl+D and watch how the second copy is magically positioned exactly the way you want. Continue pressing Ctrl+D to create as many rows as you need:


Better Button widget

The Button widget saw some improvements in this version. First, buttons now have font properties. Additionally buttons can now be vertically resized.

Another change concerns button colors. Buttons are now smarter and will switch their foreground to white if the background is too dark:

Button Colors

Note in the above screenshot that icons are also rendered using the foreground color. This is something that now also works in other widgets like Label and Text.

Palette rearrangement

A took the risk to rearrange all palette entries. Now all widgets are sorted alphabetically. I think this should make locating a widget a much more easier task. Please let me know how you like this change.

Other changes

  • Added Background/Alpha properties for Table and List widgets as requested by Jonathan
  • Fixed resize feedback while zoomed
  • Fixed the bug when changing size for multiple icons at once
  • Better position scaling for non-resizable widgets when resizing groups
  • Added a small set of mobile icons
  • Fixed a slight problem with Alpha slider
  • Improved the look of Browser widget
  • Better search support for auto-completion with Ctrl-Space


As usual to update to the latest version of WireframeSketcher just use the Eclipse update manager.