Spring options in the Transition Designer

Handing off your Prototype: Spring Options

Flinto
Flinto

--

As part of recent updates to Flinto for Mac we’ve made improvements to support the handoff from designer to developer.

1. Added a UIkit spring option to the easing inspector.

When you use the UIKit spring, the values are the exact same ones that are in Apple’s frameworks so a developer can easily plug them in.

This spring’s options match the parameters to Apple’s UIKit Spring for easy handoff to developer trying to match springs designed in Flinto for Mac.

This chart shows the names used in Flinto for Mac and their corresponding UIKit parameter values.

As an example, if you set damping 0.8, velocity 0, duration 300ms, this is what the actual UIKit API call looks like:

UIView.animateWithDuration(0.3,
delay: 0,
usingSpringWithDamping: 0.8,
initialSpringVelocity: 0,
options: nil,
animations: { // move layers, change opacity, etc },
completion: nil)

2. Open-sourced our default spring in Swift

It’s called the RK4 spring, and you can find our implementation on GitHub. When you use our RK4 spring, your developer can drop in our small RK4 spring library and use the same values you set in Flinto for Mac for a precise match of spring behavior.

These details can also be found in our documenation.

Learn more about Flinto for Mac.

--

--

Flinto
Flinto

Flinto lets designers quickly make interactive prototypes of their mobile, desktop, or web apps.