Lost your Mockups key?
Log In to myBalsamiq
Already have a monthly subscription for our cloud-based web
Log In to myBalsamiq
The following is a guest blog post by Vipul Mishra of CanvasFlip.
One of the biggest challenges in building good apps is to get actionable feedback while user testing your mockups or prototypes. Most of the responses from teams or real users are very subjective. Consolidating this feedback to iterate on your designs is a cumbersome task.
To help UX professionals perform user testing on their Balsamiq mockups, we built a utility tool to import Balsamiq mockups seamlessly into the CanvasFlip prototyping studio.
CanvasFlip.com helps product managers and UX professionals to capture and consolidate user behaviour in their prototypes just by sharing a web link. CanvasFlip generates user testing insights like interaction heatmaps, conversion funnels, and user session replays which help you to find usability issues during the design stage. Once you have found these issues, you can make the necessary changes in your Balsamiq mockups to improve usability.
Let’s go step-by-step through user testing your Balsamiq mockups in CanvasFlip:
Once your Balsamiq mockups are in place, Click Export > All Mockups to PNG.
Open Prototyping with Balsamiq and upload your Balsamiq mockup PNG files.
After uploading a mockup, you'll see a frame with a crop option. You can resize the frame to select the screen area from your mockup. Click “Crop” and the cropped screen will appear on the right side. (We will add zoom, move, and a magnifying function soon.)
Once you have cropped all the necessary screens you need, you can click “Sync with CanvasFlip” in the bottom-right corner.
To upload your screens into CanvasFlip, you will need to login to your CanvasFlip account. If you don’t have an account, you can sign up for a CanvasFlip account instantly by entering your email address and a password.
Once you have logged-in to your CanvasFlip account, you can create a new prototype or choose an existing prototype to upload your Balsamiq prototypes.
All your cropped screens will appear in the CanvasFlip prototyping studio. Here you map your screens to create a prototype for user testing. CanvasFlip prototyping studio is specially designed for fast prototyping to save up to 70% of your prototyping time.
Once you have mapped your screens, preview your prototype and go for a quick and lean user testing. Enter emails of your users / team members and add a task for them to follow.
As soon your users / team members start going through your prototype, you can see how are they navigating through your prototype, which devices they are using, and how much time are they spending on each screen.
The conversion funnel helps you understand usability in your UX flow, for example: How many interactions are users taking to complete the task? What’s the completion rate? What’s the most popular flow on the existing prototype?
Once you spot the screens with higher drop-off or observe where most of your users are leaving the expected flow, you can open the analyze screen with a heatmap to understand where users are interacting most. It helps you to optimize your Call-To-Action.
The conversion funnel and interaction heatmap help you understand what’s happening in the UX flow and interface. User videos give you the opportunity to observe and analyze how the user was navigating through the prototype and why they made certain decisions.
These user testing insights in CanvasFlip will help you iterate and enhance the usability of your designs right in your Balsamiq mockups.
As a Balsamiq user, you get 2 months of our premium subscription (instead of the regular 15-day trial). You get unlimited prototyping and can record up to 5 videos for each prototype. Please feel free to reach me at Vipul@CanvasFlip.com, if you want an extension of your current plan or more testing credits.
With CanvasFlip, you can save money by validating and iterating on the user experience early at the concept level instead of iterating with live apps. Not to mention faster app development and happy users.
Enjoy 2 months of our premium subscription to CanvasFlip prototyping - http://canvasflip.com/prototyping-with-balsamiq.php. It’s on us!!
We'll send you just one email a month and share a ton of information that you'll get before everyone else. More info about the newsletter here.
We'll never share your email address or spam you.
Your email is never published nor shared.
I really like Balsamiq and the idea to do user tests for my Balsamiq prototype with canvasflip.
Unfortunately the Balsamiq integration into Canvasflip is really crappy.
It would be nice if the crop area would remain after you click on the next screen. But as that does not work you will never hit the same dimensions. So in the output the tab-menu of the prototype is on another position on the different screen. That really makes them unusabile.
I’m really sorry you’re having such a hard time testing your prototypes. It must be frustrating.
Unfortunately, there’s not much we can do on our side since this integration is in the hands of our friends at Canvasflip. I shared this comment with them and they should reply soon to learn more and find a solution.
Thanks for sharing your experience with us. Hopefully, this will help make the integration better for you and everyone else.
I’m really sorry that you weren’t able to import your Balsamiq mocks into CanvasFlip. Most of users find it really intuitive and love it… 🙂
Can you please drop me an email to Avanish@CanvasFlip.com? I’ll be happy to hear more about what are you trying to accomplish and see how can we help you best.
UX Researcher @CanvasFlip
it’s a shame the import to canvasflip simply doesn’t work. that and their customer service never respond.
We are working on it. Will update you as soon as we have it in place.
Thanks for sharing your views.
It’s a shame we can’t upload a PDF that is exported from balsamiq and already includes the clicks between mockups.