In this video, Nathan Manousos shows how to create simple transitions involving full screens. First, the link popover is explained in detail. Using the link popover, Nathan tries different options including different built-in transitions and the various gesture options. The preview is shown repeatedly to demonstrate the different transitions after they are assigned to links.
- View Offline
I'm ready to continue creating links in my prototype.…I'm going to create a link from this Watermelon button…to this next screen here,…which is a watermelon juice recipe.…I'll select the Watermelon button,…click Create Link in the toolbar,…and choose Watermelon Recipe as the target screen.…Here's that popup that I told you I would explain.…Let's take a closer look.…Across the top we have gesture options.…The default is Tap, but there's also Double Tap,…Long Tap, different swipe directions, and Touch Down,…which activates immediately when your finger…touches the screen.…
I'm going to leave Tap for this one,…and below there's some transition options.…I'm going to choose Fade In, and click Done.…It should have a link on the Watermelon Recipe screen…going back to the Menu screen.…I'll click Draw a Link,…and create a nice big Tap area over this Back button…and target the Menu screen.…For this one I'll use the Flip Right trasition.…All right, now if we open the Preview…by clicking the Preview button In the toolbar,…we can test this out.…
- What is Flinto?
- Importing designs into Flinto for Mac
- Linking screens
- Designing transitions
- Reusing transitions
- Adding scrolling content
- Previewing and sharing your prototype