7
Flinto vs. Principle in late 2018?
over 4 years ago from Simon Gustavsson, Designer at Heydays
What’s the consensus at the moment? Which tool do people use? Pros and cons? Are there better alternatives for app and web prototyping?
36 comments
Brian Hinton, over 4 years ago
Flinto is better with Sketch, and Principle is better with Figma. Flinto has better structuring of work (reusable behaviors, transitions AND components) and I'd argue that it's easier to work in and understand how your project is flowing. Principle feels more like a quick and dirty way of creating interactive prototypes. I find the arrows showing flows in Principle extremely difficult to follow in larger projects.
Ariel Verber, over 4 years ago
They're both pretty equal, and both not perfect. I stopped using them because I rarely need interactions so they were quite expensive for me, but here's what I think:
First of all, they both suffer the same main problems (Correct me if anything has been fixed in the past year, I would love to know): lots of bugs, changes in design break everything, no support for all types of layers in sketch
Other than that, these are the main differences between them:
Principle -
Pros: Easy to learn, has a timline, fastest way to create a prototype
Cons: gets messy in larger projects
Flinto -
Pros: More organized, Better focus on specific animations
Cons: no timeline
Antonio Carusone, over 4 years ago When you make a change in Sketch, you can update the assets is Principle by reimporting the artboards. It will retain everything, as long as you don't mess around with the naming of things.
Changes can also be deleting a layer, or adding a layer. Adding two layers into a group. Etc... All of these are trivial changes that are usually chaotic in prototyping tools.
Jan Semler, over 4 years ago
Both are still Deadends for designs. After you import it you can not alter the design or flow. If you want more use Framer and learn to code. Then you will get results that can be altered further and might help your developer.
I feel you get the same restricts (in Framer) you do when designing in code. The mind is boxed into the mindset of what can be accomplished versus what you imagine. At least that has been my experience with Framer Studio and Framer X.
Dexter W, over 4 years ago I feel the same particularly with Framer X.
Interesting insight, didn't work with framer, just had a look on it. But if you work with components in framer which have code you should be able to alter it and change their behavior, right?
Because in Flinto/Principle you have to do it all by hand, again...
I ran through complete tests of all of the major interaction tools before deciding on one. Re-examined Framer X recently.
I'm not 100% following the scenario you are providing. But I can say...
Both Flinto and Principle can re-import designs from Sketch (AND Figma in Principle's case). The interactions remain, and the designs are updated. Principle even has components that can be reused between projects.
Flinto which I'm more familiar with allows you to change a behavior, or transition that is used throughout your design, and have all elements using those interactions update as well.
Framer is great...don't get me wrong. My experience with it is that the workflow is very locked to a code-centric way of thinking, and that doesn't allow freeform interaction design work as readily as Flinto or Principle.
Should do another test. Last time i had huge problems when flows are designed differently new components came in others are gone, different layouts. It was a mess.
Sounds like you changed layer naming. I use it almost daily.
Like i mentioned several times i had to because of flow changes new components are in with a complete new layout. Whats the soluttipn for this issue? ;-)
I think I answer, and communicate my thoughts pretty well in my other reply below.
Andy Dent, over 4 years ago Brian, did you include Supernova Studio in your "major interaction tools"?
Supernova Studio is more an app builder instead of a prototype tool.
Antonio Carusone, over 4 years ago In Principle you can. When you make a change in Sketch, you can update the assets is Principle by reimporting the artboards. It will retain everything, as long as you don't mess around with the naming of things.
For sure you can reimport which is a risky thing to do, but what happens when you change the flow. You can do the nice principle stuff all over again. I design living things which will change over time because technologie is changing. So i don‘t really need animations. I only do that when the devs ask me to.
It's not that risky. I have done it many times. I've yet to have something break. As long as you work intelligently, and don't alter layer names things work perfectly.
Interesting that you don't do animations for items that change over time. I imagine data dynamically changing could really use some visual callouts to help communicate those changes.
Florian Grau, over 4 years ago
Depends on how you define "deadend": In Flinto you are able to edit vector shapes and text layers, which I find mighty impressive and useful. Of course it does not offer all capabilities of Sketch, though.
It seems that no one is thinking of flow changes or other changes that come around. Like i mentioned above i build living things which will change over time, and high def prototyping is still a dead end because of that.
I don't quite understand the argument. Obviously, if you decide to change something, you have to apply these changes to the design file, the interaction prototype and the real product. But how is this the fault of the tools you use in each step?
I will try to explain it further. I design a user flow in sketch. Than i move over to principle / flinto and so on. Now my Developer / Client / Stakeholder / PM says change this or that. I go back make my changes in Sketch two views will disappear another complete different will be placed, the interaction changed. The prototype is useless, it might be faster to create a new one. This is what i meant with dead end, it is time consuming to change the prototype, if you work in sprints like i do you won't have the time to make changes all over the place. Like i said above on another comment i only do prototypes when developers ask me to do and only after the story is set and the developer is on it. But to elaborate and test designs i am not sure that it is a good thing to play with principle or other high fidelity prototyping tools. Besides the dribbble people who do it for fame ;-)
Sure thing ... but the fact, that prototypes take a lot of time and therefore iterating on them constantly is not a viable option in every situation, is not the fault of the tool (which I had the impression you were implying with "dead end" in the first place).
Oh then i might explained it not correctly. But i think you know what i meant with Dead End.
Still want to add something to our conversation. I think that all the prototyping tools (and i tried a lot of them) aren't suited for designing user flows. Because in the end in my experience is that some, of course not all prototypes are over the top. These tools seduces the designer while working with it to create a cool transition or a crazy interaction. Which the developer in most cases cannot reproduce in a short time and i worked with winners of the Apple Design Award. Because the focus will then lie on animation/transition instead of flow and interaction.
For me are transitions and crazy interactions are only used when it brings performance or a better experience. I see it more as a cherry on the cake.
I understand what you are saying, and I promise you that most of us work in Sprints, and "Agile" environments with living products. Just because a flow changes doesn't mean the entire interaction design isn't broken. You can add another view into the flow, or alter as needed, updating the few behaviors that need changes. We do occasionally make those rare rapid changes before implementation (even scrapping entire flows), but more often we have simpler clickthrough prototypes, and white-boarding sessions that decide flows before we ever get to adding the micro-interactions that Flinto, etc are intended to provide.
I'd also wager most of us (myself included) don't do an entire prototype flow within Flinto, ProtoPie, Principle, etc. but instead use them to show complex visual behaviors that provide callouts, direct the user, and enhance the overall experience. I can't imagine (nor would I recommend) doing an entire application flow in those tools, and would never attempt to do that.
Figma clickthroughs have been mainly what we use now, and jump into Principle (as of late) for micro-interactions, and to demonstrate to the development team how we want something to function. I've even created quick prototypes with vanilla HTML, CSS and JS.
Andy Dent, over 4 years ago Jan, I come from a developer perspective (35 years) and I'm crazy in love with Supernova Studio because it backs up what you do in design with full code generation. (I also have a long pedigree in code-gen having worked on the two dominant products in Classic MacOS days).
I have long despaired about how the tooling world was ever-focused on products which only got as far as generating image assets and sometimes videos for hand-over but had no brakes to bring them back to reality. Obviously, a skilled dev team can build anything but the budget often doesn't allow for it.
Supernova Studio requires you start in Sketch and their one weak point at this time is re-importing a single screen loses some details, but it's a team that moves very fast so any criticism you read needs to be current.
After importing static screens from Sketch you then set properties, add animation, prototyping links between pages and generate full working native code or React Native apps.
Because it's constraining your work to the needs of the code generator, it's like having a developer by your side continuously. They also have a cloud product for sharing designs and reviewing.
Two other products worth looking at if you're just prototyping animations but want working output:
- Haiku generates Lottie files and code so you can have mobile animation, but also has website output with more control, integrated with major JS frameworks. It's a competitor for After Effects.
- Flow takes two Sketch artboards and generates the animation between them automatically, then lets you fiddle with it. It generates only Swift code for iOS apps at present but has a flexible generation system that's template driven.
Offtopic but still gold:
Still know people who use axure...
James Young, over 4 years ago Once you learn Axure its hard to pick up another product to use. You hit the limitation wall so quickly. Axure 9 is coming out and I'm cautiously optimistic they will finally get all the ducks moving in the same direction but I've been hoping that saince V5.
Gage Wright, over 4 years ago
I primarily used Flinto the last few years but since Sketch 52 I've experienced a lot of bugs that sometimes makes the program unusable at times so I've switched over to Principle recently. I really like using the timeline in Principle and Flinto excels at micro interactions because of behaviors. Both still have a place in my workflow based on what my needs are per project. I bought a license for ProtoPie on Black Friday so I'm going to give that a try soon.
Pooya K, over 3 years ago Flinto supports more Triggers like Swipe up or down, but Principle only supports Scroll Begins.
Darrell Estabrook, over 4 years ago I just wrote about this workflow (Sketch/Flinto/InVision), and discovered a surprising new contender. Whatever tool you pick, the primary objective it to be as creative as possible, render as realistically to the end product as possible, as quickly as possible.
Read The ultimate design tool mashup on Medium.
tony w, over 4 years ago
What's the use case?
Fredo Tan, over 4 years ago There's more than just those two animation tools, like an interaction-focused tool like ProtoPie. Mentioned on DN a few times before.
Andrew Washuta, over 4 years ago Have seen it mentioned a few times before. How does it compare to Principle or Flinto?
Mariusz Ostrowski, over 4 years ago
Try Kite - https://kiteapp.co
Which problem of Flinto/Princliple does it solve (better)? I tried it once afair, but didn't stick. Also, I had the impression it lacks traction in the design community, which is never a good sign for new indie software.
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now