Hi there,

Firstly can I say great product - we bought 2 licences already for 2 of our team to make quick mockups and its doing the job great.

We have real time sapper though and I'm hoping you can help.

We are currently using lots of the yellow notes boxes with arrows to point to a section on the screen where the note relates to.

The problem is when designing we need to constantly move these around and becuase the arrow is not linked / connected to the note they move independantly. Now I know you can just select both at the same time but then this moves the pointy end of the arrow away from the location it is ment to be pointing at.

So our question is is there a way (or can you please please add a way ;0) to have notes / annotations that you can point an arrow to a section of the screen and then move the note / annotation and the arrow will stay connected to it but the pointy end of the arrow will not move.

Lol I hope this makes sense and I am very confident that this will help lots of other users as annotations and notes are a vital part in producing mockups for clients

Many thanks, Ben

Hi Ben,

Thank you for your feature request. Adding connectors (arrows that stay attached to objects) is on our todo list. I'll bump it's priority.

We are also considering adding a different method for specifying annotations as separate information that does not pollute the design. The idea is to add a special Notes property that can be used to enter a note for each object. These notes then would be displayed separately with only some number bullets overlayed on the screen. Does this sound like something you would use?

Hi Peter,

Yes it does, anything to help explaining a mockup to the client.

The way we are currently using your system it to produce the mockup screens and then link the buttons to flick between the screens to simulate a system or particular process.

We then create the story screen and then use the export to html. This gives us one html file and a folder with all the asserts in which is just perfect as its simple to move around and also explain to the client should we send them the mockup. they simply click the html file and then the screens walk them through the process.

Elaborating on this point a little more then, and with the above goal in mind, it would be really good to have a dedicated "notes" panel at the top or bottom (or both) that you could use if needed. This functionality is available on mindmeister which we use for mind maps and is great because it gives a place to put the narrative / overview / notes for that screen. But this sits full width across the bottom of the mockup as not to interfere with the mockup screen itself. So bringing it back to wireframesketcher, when we export to html, it would be great if there were a full width notes panel at the bottom of each screen that the end user could toggle on and off (eg extend the little nav bar you have at the bottom with the next and back arrows etc so this could have notes in and you can already toggle it on and off).

This would give a common place to put general screen overview notes or functionality. To then go with this you then need the ability to have floating notes with arrows (and or say your number markers idea with the explanation text somewhere else) but these serve a different but equally important function. This is to provide notes that relate to a specif part of the screen eg to explain the purpose of a button.

These two bits of functionality would allow us to build a much more professional end user mockup / demo with more consistency.

Many thanks Ben

Ow and one last thing, in an ideal world you would be able to toggle all these notes (and their connected arrows) and annotations (like you can now with the links in the bottom right of the html export).

This would allow us / the end user to quickly remove all the notes to see a very clean and simple screen (eg remove the clutter) and then flick them back on to read more.

So, will all this be in my next week ;o) lol no joking aside I'm sure that we are not alone on this topic and I defiantly think it would help take wireframsketcher to the next level when it comes to creating mockups of workflows to show or give to and end user / client.

Hope this helps.

Many thanks, Ben


I would really love the possibility to connect any kind of objects with each other with arrows or lines. Bezier curves would be even greater then lines, but I guess it's trickier to implement.

-- Anders

A big thumbs-up to object connections from me too.