Markup hack: toggling states is not "markup"


#1

I was watching https://support.balsamiq.com/tutorials/markup/ , and it bothers me that the distinction between editorial annotations to the design and the design itself is being blurred.
Showing different states of a control is not the same as explaining what a control does or motivating some design choice.
Do others think that this is a valid concern? Is there a better way to approach this in Balsamiq?


#2

Hi @Jean_Jordaan and thanks for sharing your thoughts about this.

Another way to display different states of a control/wireframe design is to use the Alternates feature. Or you could also create different wireframes and link them together if needed.

Hope this helps! :slight_smile:


#3

Alternates would be workable, but it’s going against the grain of the UI. E.g. it doesn’t make sense to have Promote to Official on the “dropdown active” state of a control.

Linking is also OK-ish, but you end up with two entire pages that need to be kept in sync.


#4

Yes, alternates are usually dedicated to showing alternative designs indeed but it can be used for the type of workflow you describe too.

That being said, since we recently introduced powerful comments with callouts (as you mentioned in another thread), you could use those for editorial annotations and the Markup “hack” for showing states of a wireframe.

At the end of the day, we simply want you to use the different features so that it fits your workflow the best.


#5

That’s true. Balsamiq is in the first place a tool for communication though. In this thread I’m giving feedback on aspects that can hamper the clarity of communication. Callouts are good for anchoring a conversation about a design, while markup is good for adding a layer of specifications and annotations. I think a markup layer is a powerful idea. There are great freeform diagramming tools like draw.io and omnigraffle, I think what sets good wireframe tools apart is the ability to structure a design conversation in terms of relevant concepts rather than generic shapes and layers.