Feature request: Dynamic linking alignment of items in a mockup


#1

I would like to be able to link one item in a mock-up to one or edges or centre of another item.
E.g. I use an iPhone border in one of my mockups. When I want to represent all screen contents including those that I scroll down to see, I lengthen the iPhone image. However, not only does this lengthen the blank area in the middle, it also stretches the top of the iPhone and the iPhone button so that they are no longer in proportion. Consequently I use a composite of 4 elements.

  1. An outline of the iPhone
  2. An image of the top of the iPhone
  3. A blank container, to put my screen contents in
  4. An image of the button

I normally have these grouped.
When I want to lengthen the iPhone, I have to ungroup, lengthen the outline and the container, and move the button back down to the bottom, and then regroup.

Would be great if I could for instance specify that I want to link the position of the bottom image to the lower edge of the outline image, so that when the lower edge of the outline image is moved down, the button image is moved down by the same amount. I would also need to be able to link an edge to an edge. E.g. Link the bottom edge of the container to the bottom edge of the outline.

I’d also envisage being able to group all these items together. If the grouped item is resized, then the existence of these pre-existing links should signal that the inner items that are linked to the outermost element are not to be reseized, but moved according to the linking rules.

Lastly would we great if this group of linked items could be saved as a “dynamic symbol”.

So in detail:

a. Ability to link centre or edge of an item (image, button, etc) in a mockup to the centre or edge of another item in the mockup.
b. Ability to group linked and unlinked items so that when the grouped item is resized, the inner items do not get stretched when they could be moved within the group according to a linking rule.
c. Ability to save a “dynamic group” for re-use.


#2

Hi again @Andrew_Hart,

Thanks for detailing your need on this.

I’ve added this request to our internal tracker so we can review and consider it for the future.

In the meantime, this Mockup To Go might help: https://mockupstogo.mybalsamiq.com/projects/ios/iPhone%20Customizable
The description of your use is pretty similar to this one but is may have some useful elements for you.

Also, here is the documentation about Mockups to Go in case you never used it before: http://help.balsamiq.com/mockupstogo