

Proto.io is a surprisingly powerful web app it has many, many functions. Web-based, with players for iOS and Android.
#Flinto icon for mac#
Proto.io, Pixate, Framer, Facebook’s Origami, RelativeWave’s Form, Principle, Flinto for Mac and Tumult Hype 3 are the tools I tried. But they’re great for trying out new interactions, or for tweaking the timing of an animation. Prototyping a complete app in a tool like this would be crazy, though it would be too much work (you might as well build the real app). Layer-based toolsĮvery asset, interface element, or in other words, layer can be made tappable, swipe-able, draggable… but also animated. Granted, in some of these tools you can have animations or scrollable areas within a page, but you cannot use them to emulate every interaction possible in real native apps. It’s a bit clunky, but it’s a good way to make quick mockups when you’re still figuring out the flow of an app (which and how many screens are needed, how they would appear, where buttons should go, etc.).Įxamples of page-based tools are: Briefs, InVision, Notism, Flinto, Fluid, Mockup.io, Prott, POP, Marvel, Balsamiq, Red Pen and Keynotopia. Page-based tools generally also have a choice of different transitions between screens, like fade in, slide in from the right, slide up from below, etc. You tap a button somewhere on one screen to go to another screen. In a page-based tool, you lay out different screens, and then you make hotspots or buttons to connect them together. The majority of tools only let you connect static pages, while only the more complex ones let you animate different objects or layers within a given page. Why did I select these eight? I discovered that recreating something that is this animation-heavy (icons moving around in different directions and at different speeds) is not even possible in most prototyping packages. See how these recreations behave compared to the real thing:

I recreated the IF by IFTTT user onboarding in eight different high-fidelity prototyping tools to get an idea of the differences between them: Proto.io, Pixate, Framer, Facebook’s Origami, RelativeWave’s Form, Principle, Flinto for Mac and Tumult Hype 3.
