iPhone app "wireframes"/ rapid prototypes revolutionized: FluidUI.com

As a professional iOS product manager (working on iPhone and iPad apps that make millions in revenue),  someone who has designed apps that went live in the app store, or for someone who is just thinking about making their first app, my number one piece of advice is : BUILD A RAPID PROTOTYPE. 

In every mobile app project i have done in the past 8 years, i have found that i always want/ need to tweak the app after its built. The smart thing to do, is to catch some of those tweaks, feature, and design changes before a single line of code is written. The best way to do this is to build a rapid prototype.

Put simply building a rapid prototype or mock up of the application makes you think through all the aspect of the app, the flow, how many screens it has, how many button assets, does it handle device rotation , and a million other details.  

Old School app prototyping was done with pen and paper, sometimes called wireframing. 

Ninja graphic designers do it in Photoshop/ Illustrator. Some like to use Keynote, and then load it on Keynote on iPad or iPhone. 

However, now there is a new generation of tools. Sites like Fluidui.com and Balsamiq.com are revolutionizing mobile app prototyping. So let me tell you about this tool i learned to use in my Mobile Interface Design course: FluidUI,  is an awesome rapid mobile app prototyping tool. It is Free to try and $30 per month for the minimum package after the trial.

 Here are the reasons its great:

0. It is 100% web browser based. The website has a click / drag-drop tools for making an iPhone, iPad, Web, or android design. Meaning it is accessible and available to everyone.

1.  It comes with a library of "native" interface components and widgets that are commonly available in Apple apps. Its really easy to drag those components into a "view" (page), and arrange them how you want (resizing, adding table cells, changing color, border, border radius and other options are all available).

2. It has a great "flow diagram" mode , where it is really easy to see how all the screens are linked together. This mode also lets you make buttons "clickable" , link various "Views" together based on taps, swipes, and other touch input. You can even control the transition animations:)

3. The best part is Test Driving your Fluid project. When you click on the green "play icon" in your project, Fluid assembles /builds your project into an HTML 5 website with all the assets and linking that you set. This site can be linked to, it comes with a QR code leading to it, and it can even be saved as a Safari Webclip icon on your iPhone home screen.

These 4 reasons have made Fluid a tool that i think is invaluable for product management of any successful mobile app project. Go check it out already here : http://www.fluidui.com 

P.S. FluidUI.com team if you guys read this, here is my #1 ask:

I do wish there was a way to create transitions/ animations WITHIN an individual view. So things like Scrolling can be simulated. I hope that future versions will bring improvements like these. In the meantime i will continue honing my Rapid Prototyping skills with Fluidui.com , pro tip: you should too ;)