Presentation mode...
I was using Balsamiq Mockups the other day to demonstrate some some Mockups I had created to a large audience.
While doing so, I often used my mouse cursor to point and click, as to simulate and walk through the user experience for my audience. Obviously when I clicked anything, it selected it. If I hover the mouse over, I get that tool tip edit box. A few times I inadvertently nudged a UI component.
Tip: I figured out that I can select all and lock the entire mockup.
But wouldnt it be great if there was an option in the view menu called presentation mode?
This option would do the the following:
- Temporarily lock all mockups in session (all tabs)
- Hide the UI Library (or maybe only allow the Markup library)
- Hide the Quick Add tool
- Add a right click "End presentation mode"
* Presentation mode would automatically end if the user used any of the "Mockup" or "Edit" menus, or opened a .BMML file.
I think this would be a great little feature.
While doing so, I often used my mouse cursor to point and click, as to simulate and walk through the user experience for my audience. Obviously when I clicked anything, it selected it. If I hover the mouse over, I get that tool tip edit box. A few times I inadvertently nudged a UI component.
Tip: I figured out that I can select all and lock the entire mockup.
But wouldnt it be great if there was an option in the view menu called presentation mode?
This option would do the the following:
- Temporarily lock all mockups in session (all tabs)
- Hide the UI Library (or maybe only allow the Markup library)
- Hide the Quick Add tool
- Add a right click "End presentation mode"
* Presentation mode would automatically end if the user used any of the "Mockup" or "Edit" menus, or opened a .BMML file.
I think this would be a great little feature.
2
people have this question
I have this question, too!
Tell me when someone answers.
The more people who ask this question, the more it gets noticed.
The more people who ask this question, the more it gets noticed.
-
Inappropriate?Recently I gave a presentation on UI design and usability testing. This was in front of a big audience. The presentation was a big hit.
I spent 30 minutes talking about the importance of low fidelity mockups and paper prototyping. I gave a great demo of Balsamiq and the audience was very much interested as they all wanted to know where to buy it.
However in part of my demo, I was trying to walk users though a few designs and workflow. Using my mouse as a pointer, I kept accidentally nudging components around, the property panel would appear on top of important areas, and I accidentally renamed a component. Needless to say this was a bit frustrating. Even more so when it kept asking me to save my changes when I wanted to close.
Regarding the original post:
I am surprised nobody responded on the idea of a "Presentation Mode". Perhaps by me posting this comment, others will chime in with their support.
I’m thankful
-
Inappropriate?Hey Michael, I have now added a "Full Screen Mode" to 1.5, check it out! http://www.balsamiq.com/products/mock... - it needs a little more feedback (like a "hit ESC to exit full screen mode" label) and other tweaks, but it should be enough to play with.
1 person says
this answers the question
-
Inappropriate?Does it only work on the desktop version? I tried on the Web version - does not work.
-
Inappropriate?Oops, I forgot to do something to enable it in the web. Let me fix that.
-
Inappropriate?Ok, it's fixed. SHIFT+refresh to make sure you get the latest html
1 person says
this answers the question
-
Inappropriate?I was pleased to see it properly handles windows that need scrolling. But I wonder if the page-up/down keys could work here. No biggie, but it would be useful.
-
Inappropriate?Keyboard input is totally disabled in the flash player (security reasons), but I could make those keys work in the Desktop version, let me take a look.
I am also thinking of trying to automatically centering the mockup when in full screen mode, what do you think? -
Inappropriate?Yeah - that sounds good.
Keys page keys in desktop version, and auto center. -
Inappropriate?I just added the auto-center: what a difference it makes!
(Also, check out the new "Export Snapshot to Clipboard" command in the Desktop version. Bonus!)
I’m stoked about 1.5
-
Inappropriate?I think it makes sense to call it presentation mode. When I opened it in "full screen mode" I was expecting to be able to work in that mode (I should know better that flash does not allow that).
Presentation mode tells me that I should not expect to work and just show off my handiwork (and yours Peldi). -
Inappropriate?I agree with you, hence my original requests. :)
-
Inappropriate?How about "Full Screen View"? Presentation is such a loaded word...and CTRL+F is better than CTRL+P (already used for printing).
-
View works. Show full screen...? -
Inappropriate?I added the "big ass pointer" (or BAP for short) feature when in "Full Screen View", let me know what you think!
The idea here is that you normally go full-screen when you're showing something, either in front of a client or an audience. The BAP helps you point out different mockup features.
I’m silly
-
You win Peldi. Can't beat the BAP. -
Inappropriate?I can't switch between mockups in presentation mode.
Would it be a next enhancement step or is it implemented already?
I’m excited
-
1 person says
this answers the question
-
Inappropriate?Thanks Marco.
Just for the correct explanation of my intention:
It would be also nice to be able to set the appearing order of mockups (maybe by moving its tabs) and switch off autocenter for precise placement.
Whit these enhancements I can easily demonstrate a complete scenario in presentation mode. That would be great!
I’m excited
-
Inappropriate?Hi Marco!
The new linking mockups feature invalidated my request about switching.
Thanks -
Inappropriate?I think the Presentation Mode just rocks and adding in top of that the ability to link between mockups just made me buy the desktop version :)
I have a suggestion, nonetheless. Would it be possible to disable the blue color it shows when there is a link over an object?
I'm using it to show how an interaction through a menu would work, but the blue is too distracting. I already know I can click there and the arrows give a clue too. Perhaps a preference somewhere could help chosing whether to show it or not. -
Inappropriate?I would like this too, but it should be optional. For Usability testing in front of users, I don't want to hint to them where they need to click.
-
Inappropriate?I would like it too.
Now I have to color everything to blueish to hide link hints. :-D
I’m kidding
-
Inappropriate?Michael: Exactly, that is one of my concerns. It distracts too much from the rest of the mockup by having a too strong visual signal (which is what we try to prevent by using BM :P)
Perhaps it should me an optional global preference somewhere, since setting it up on every link would be somewhat tiresome (but could work too). -
Inappropriate?If I'm being real honest here - I am not crazy about the big pointer arrow and the huge blue finger that you get when you hover. If I had my wishes:
- Use a smaller regular pointer in presentation mode
- Do not use the pointer facing towards the center
- Make the hand on links to look more regular
- Option to hide the arrow hints
- Create a separate special control to be used for linking. Would be same as rectangle area that is transparent and no border. -
Inappropriate?- A smaller pointer will not suggest enough the sketchup feeling. I need the BAP at least as an option.
-
Inappropriate?I actually like the arrow but agree with the other wishes. The hand on the links looks to big (and even works a bit slow on my Macbook when changing from the pointer to it).
About the linking control, having no border and background wouldn't make it too hard to update/modify and remembering where did you put it? Maybe it should have the arrow hint on it.
Having and additional rectangle-like link control would be a nice idea as long as the other controls remain with the link functionality (which is a given I think).
Balsamiq Mockup + Silverback make a great couple for that :)
I’m happy
-
Inappropriate?BAP? What is that?
-
Inappropriate?Big Ass Pointer :D
-
Inappropriate?The Big Ass Pointer causes me issue as its so big it covers up a lot of UI.
-
Inappropriate?Maybe it could be an optional thing then. I like how it helps me guide in a 3D kind of way around the mockup, like a pen would do.
Don't particulary find it too big (and if it does covers some area I can always maneuver with it) but it certainly it's some matter of personal taste.
I’m happy to interact with a great product and a great community :D
-
Inappropriate?Hi guys, thanks for all the feedback, it's just what I need. I'm starting to think that we need a separate "user testing mode" which is the same as full-screen is today but doesn't use a BAP or big hand, doesn't show hints for links and maybe even hides all markup elements while we're at it?
Thoughts?
I’m thankful
-
Inappropriate?I'd agree and like the idea but lets me wondering, do the hands and links and blue colors on the presentation mode we have already are actually needed?
I'd like a User Testing mode but wouldn't mind opt-in for the BAP :P (I just like that big 3d-ish arrow).
I’m excited
-
Hi Alvaro, the BAP in full-screen mode serves the purpose of showing where the mouse is when Mockups is shown in front of a crowd, often on a large screen or projector. The blue color on the links is to highlight them so that a user will know which areas are clickable in the prototype they are being shown and which aren't. But I do agree that sometimes you don't want to show them (when you're using mockups to test a UI, something that's only recently made possible by the new linking feature). -
Inappropriate?Hi there, so I thought about this a bit more, and here's a proposal:

This would be a little "control panel" which shows up when you first go into Full Screen Presentation mode and fades out in 5 seconds unless you mouse over it.
To bring it back, you just mouse over the bottom-right corner of the screen (very similar to how DVD playback software works). To send it away just stay away from it with your mouse for 5 seconds or click on the x icon if you don't want to wait.
As for the buttons, they are 4 toggle buttons and should be self-explanatory.
Whatever selection you make will be remembered on your computer so that you won't have to muck with it each time you go to full-screen.
Thoughts?
-
My only concern is what happens if the UI you want to show is in the lower right corner? Perhaps the hotspot can be much smaller than the control size. -
I like that idea...I also think that this little control bar would be pretty small (much smaller than what it looks like in the mockup above) -
Peldi,
How quickly could we get this? The current implementation is unusable for some, and there is an upcoming usability event happening at our company, We would love to use mockups. -
Even pretty small, it disturbs the usability test if the user moves over there. The initial showing and fading is fine, but the bring back method would be better to assign to a keyboard shortcut.
To hide markups options is awesome. -
Hi Michael, which part is the most problematic for you? The blue area, the link or the big pointers? -
Inappropriate?I think I love this idea. Its better than having two whole different "full screen modes" and lets us adapt for several situations with great flexibility.
Kudos!
I’m excited about this new mode :D
-
Inappropriate?I don't like the BAP ... the changing orientation of the cursor is really clunky and jittery, as is the hand cursor. Don't know why it's not smooth. If the arrow was just a single orientation and was smoother and if the hand only displayed when over a link (there seems to be a region around a link where it no longer displays the destination link but still has a hand) I'd be happier.
Another suggestion is that instead of arrows you use element highlights ... so hovering over an element highlights it in blue glow outline. The person navigating will still need a cursor of sorts to get around the screen but not the BAP. Just an idea ...
I’m pretty stoked about BM
-
Inappropriate?Peldi,
Not sure what you mean by blue area.
This is what is needed for it to be useful in presentation mode:
- a plain cursor
- no hotspot on link hover (blue hand)
- no little blue arrow hints in presentation mode
I realize though some will want these feature and some will not. So ideally a way to shut them on/off. -
Sorry with blue area I meant the blue hint. I was trying to get a sense of priority between the 3 items that you mention, but it seems that you don't want any of it...clearly you're using the mode for user-testing while I designed it for illustration. I'll see if I can build all 3 toggles at the same time then. -
The other thing I just thought is to just have a single toggle that turns off all 3 (big cursor, blue hints and links), and call it "toggle linking hints". Thoughts? -
Yes, single option to toggle all of those effects/helpers on and off - not individual controls. -
Inappropriate?Hi there, I just implemented the two toggles:

The tooltips say "Show Linking Hints and Cursor" and "Show Markup".
Values are remembered across sessions...set it...and forget it! ;)
In the desktop version you can also use the "m" (or "M") and "l" (or "L") keys to toggle the two settings.
The new build with this feature in it is here: http://www.balsamiq.com/products/mock...
Please let me know what you think! If it all checks out I'll push it into 1.6 next Tuesday.
-
I was excited to see this but it's still missing an important thing, which is to also hide the huge hand when you hover over the links. Can't we make that happen too? -
Is the problem that the hand is too big and covers some elements or what? You still need some sort of hand pointer right? -
Also - its quite strange to click this tool bar when using the big ass pointer. Is it possible to dynamically change the cursor when you hover over this toolbar toggles? -
Peldi,
This big hand is a distraction yes. I would expect that if I turn off Big Cursor, that the hand reverts to normal cursor (the kind you get when you hover over an HTML) link. No color, just a plain link cursor. -
Yup, I still have to work on that part. -
Right...easier said than done, but I'll do it. -
Just wanted to send big thanks to you for your work on this feature, Peldi. I use BM every work day and the features list just gets better and better! -
Inappropriate?Cool - One problem I have is the BAP (Big Ass Pointer) doesn't return to a small pointer when I mouse over the region - it also is behind the toolbar layer. It still works when I click where I think i should be clicking just missing the proper feedback.
For whatever reason I can't seem to screen shot with apples built in tool easily when in the full screen mode.
One suggestion, I like, have the link icon displayed to tip of what is clickable but dislike having the whole link area colored blue. It might be nice to add that in a multi-state button on the link display button
default (button has link icon and blue background on).
Click 1 - turns off blue highlights
Click 2 - turns off link icon
Click 3 - turns on blue highlights
Click 4 - turns on link icon -
Yup I still have to work on the pointer behaviour when you're on the toggle area (hide the BAP, show the normal pointers).
As for the "keep the icon but loose the blue area", I need to understand what the problem is beyond a cosmetic issue...should the blue area be a little lighter? Does it cover important information? -
Yeah it is strictly cosmetic. I like the arrow icon to show it is a link but not the region being colored blue in the demo. I imagine for some users it is the opposite. But having both is a bit confusing like what does the blue region plus the icon mean as they graphically don't feel like they are related to each other when they both appear -
ie. I prefer the look of links when it isn't in full-screen mode and get a bit confused when it changes when I go to fullscreen mode -
Inappropriate?In another Fullscreen mode option - is there a way to keep the Apple menu bar at the very top. I was trying to make a Jing recording the other day from Full screen mode and since the image shifts when entering full screen mode it was hard to use Jing to draw the proper size recording window as the function wasn't accessible once I went to fullscreen.
Ideally I could go to full screen then select the Jing > Capture function from the menu bar and properly select the size of window I wanted to record.
I noticed that if did the following steps I could get around the limitation
1. Go to fullscreen mode
2. Use apple command to view all windows
3. Select another window to bring into focus (which brought the menu bar back)
4. Minimize that window leaving Balsamiq fullsceen in background
5. Select Jing > Capture
6. Draw the proper capture size window
;) -
I can't do that, AIR won't let me. -
Inappropriate?I don't find presentation mode useful. Fortunately, I'm not "presenting" to anyone. :) But I would find it very useful if the linking feature worked outside of presentation mode. For example, clicking the blue arrow followed the link. Whereas clicking the control, but not the blue arrow, opened the inspector.
-
That would be very annoying in the phase of mockup design. -
A lot of mockup design is flipping between pages and seeing how the flow works. For me, it's annoying to go in and out of presentation mode to do that. Presenting is the output of design. Clicking through my design is part of the mock-up process. -
I agree that a way to click through links in design mode would be great. Not with a regular click, but perhaps with a control, as is done in other software? -
Inappropriate?Hello everyone, thanks for your continued feedback on this important topic!
Since the last changes (the two toggles) were overall well received, I have now spent some time polishing the experience, specifically:
- made the blue highlight much less visible
- changed the big hand pointer with a smaller one when you have selected not to show linking hints
- made it so that the mouse pointer goes back to normal when you mouse over a scrollbar or the toggle area
- other little tweaks here and there.
Please give it a try and let me know what you think, I'd like to merge this into 1.6 soon: http://www.balsamiq.com/products/mock...
Two questions remain open in my mind:
- should we add a way to navigate from a mockup to another in design mode? I would have to be something like CTRL+SHIFT+Click, since both CTRL+click, ALT+click and SHIFT+click are used for selection operations.
- should I split the mouse pointer and the hints (icon and blue area) toggles? I'd rather not, but if someone has a very convincing argument, I'm willing to budge. ;)
Thanks again everyone!
-
OMG - Much much better. Thank you thank you thank you. We can now use this, and just in time for a big usability test we are conducting. -
Agreed... I like the new toggles.
- The BAP is a bother. Definitely needs a toggle and to stop the rotation.
- For the navigation in design mode, Alt- or CTRL + SHIFT(Arrows... left/right) makes the most sense to me.
- You and your team are Rock Stars! -
Hi Matthew, the first toggle turns off the BAP. That works for your right? Or do you want the hints but not the BAP?
I'm not sure what you mean with using the arrows to navigate in design mode, I was talking about how to click on a link in design mode to follow it. -
Peldi... sorry for my ambiguity. I misunderstood... yes following links in design mode would have value.
I like having a pointer... I just dislike the rotation of the BAP. -
Inappropriate?"CTRL+SHIFT" as ON/OFF toggle for link following in design mode would be absolutely convenient.
-
Inappropriate?Hi all, so the two toggles shipped today: http://www.balsamiq.com/blog/?p=1320 - The CTRL+SHIFT+click on a link in edit mode is still not there though. Any other huge thing missing around this feature?
I’m very thankful
-
Inappropriate?First of all, THANK YOU for adding the new toggles - they are really helpful for presenting ideas to customers prior to prototyping (in some cases prototyping might not even be necessary any more!). One last bit and it will be near perfect:
I tend to have several mockups with a single primary object shared between all of them (in my case the iPhone, in other cases it could be a window though). I add markups around this object but the markups vary greatly from mockup to mockup. Some mockups also have no markups. I would really like the main object to remain aligned as I click through the links, but the mockups are used in evaluating the scale/zoom of the preview. Best case would be to lock the position of all mockups so that it didn't reorient as I switch through mockups, but I would also get most of what I need if the markup objects were not used to determine scaling unless they are visible.
For example, right now if I put a markup (say a sticky note) to the right of another object, when I preview that it will center on the objects including the sticky note. If I hide the markups using the new toggle, the sticky note is invisible, but the preview still zooms and scales so that the sticky note would fit on the screen if it was visible. I would prefer it zoomed and scaled as if the sticky note was not part of the mockup if it's hidden. -
Timothy, thanks so much for this. You're totally right, the fact that markup controls are "counted" for determining the mockup size even when invisible is a BUG! I have added it to my list and we'll get there, I promise.
Loading Profile...









