Flinto for Mac Tutorials
Introduction
A Tour of the Interface
1:27
An overview of creating your first Flinto for Mac document, adding screens and laying out the screen with assets from Finder.
Import from Sketch
01:13
Our Sketch plugin is a huge time saver.
Designing Transitions
Screen Transitions
2:43
Create simple but impressive screen-based transitions in Flinto for Mac's Transition Designer.
Layer Transitions
2:10
Easily create advanced transitions involving individual layers in Flinto for Mac.
Overlaid Content
2:39
Learn to simulate pop-up alerts and other types of overlaid content in this tutorial.
Connected Layers
3:50
Make transitions that appear to take place in one screen using the powerful connected layer feature in Flinto for Mac.
Cell Swipe Transition
2:37
This example demonstrates how to build a cell swipe interaction in Flinto for Mac.
Reusable Transitions
3:31
Learn how Flinto for Mac's reusable transitions work. This is a huge time saver!
Coverflow Transition
7:37
Learn to build a 3D coverflow style transition in Flinto for Mac's transition designer.
Tinder Style Transition
5:42
Follow along with this example to create the much-requested Tinder photo swipe transition.
Designing Behaviors
What is the Behavior Designer?
01:03
A quick overview of what the Behavior Designer can do.
Design a simple toggle switch behavior
01:44
Learn to make one of the most easiest types of behaviors.
Add Gestures to Toggle Switch
00:49
Spruce up your toggle switch with direct-manipulation gestures.
Star Rating Behavior
00:59
Using a state for each possible rating, it's easy to create a star-rating widget.
Button Press Behavior
01:51
One of the most common uses of behaviors is hover and active states for buttons.
Looping Animation Behavior
01:10
Make a continuously looping animation in the Behavior Designer.
Spinning Animation Behavior
01:48
Learn to make a layer spin forever, great for loading indicators.
Scroll Animation
2:14
Create an animation that is triggered by your scroll position.
Other
Links and Gestures
3:00
Add interactivity to your prototype by creating links between screens. Flinto for Mac makes it easy!
Scroll Groups
4:09
Add scrolling areas to your screens using scroll groups.
Parallax Scrolling Effect
2:33
Use Flinto for Mac to simulate a parallax scrolling effect.
Background Color Fade Transition
2:13
A quick overview of how I created this card swipe transition with a nice color background fade effect.
Video Layers
3:48
Add video or animated GIF layers to your prototypes.
Re-Import from Sketch
01:37
A quick tour of Flinto's support for re-importing designs from Sketch.
Rectangle Shape Layers
02:07
Use rectangles to do quick mockups and create stunning animated effects.
Timer Links
1:18
Learn to use timer links to automatically trigger a transition to another screen.