Unlock the future of design and animation.
At Abstrakt, we push the boundaries of what’s possible in digital design. These cutting-edge tools empower us to create engaging, interactive, and immersive experiences that truly captivate users.
Rive is an 2D interactive design and animation tool, used for creating animations for digital interfaces like websites, games, and apps. Animations are exported as code-friendly files, which can then be integrated easily. It users a blazing-fast vector renderer so illustrations always appear crisp and clear. Rive also features State Machine Technology, so we can make your animations highly interactive.
On the other hand, Spline is a 3D design platform that enables creators to design, build, and ship interactive experiences across multiple platforms. Whilst these are not as file efficient as using 2D animations, it uses <iframe> embed files so we can still maximise your website performance without compromising visual finesse. With limitless three dimensional potential, you can bring anything to life with Spline.
Whether you have an existing style or not, we’ll either match it authentically or create a bespoke illustration style that sits hand in hand with your brand.
Rive features.
State machine technology
State Machines are a visual way to connect animations together and define the logic that drives the transitions. This provides a way to combine a set of animations and manage the transition between through inputs.
Hover on this animation to see it react to your mouse cursor.
Listeners
Listeners allow us to define click, hover, and mouse actions through defining an area or ‘target’. Here we’re using a hit box area that changes the actions of the animation.
This animation has it’s own independent animation, but you’ll notice it change when your mouse goes over the hit box.
Constraints
Constraints are a way to control the properties of an object through another target object. We’ve set up two constraints on this example, one in front and the other behind the artwork. This creates a parallax effect when interacting.
The facial expressions move independently, but you can still interact and change the animation by hovering over the hit box area.
Spline features.
Scroll interactions
Scroll events require the user to scroll in order to go through the transitions. We can fine tune the amount of scroll needed by adjusting the steps in between.
This interaction is great for showcasing 3D products at any angle. Scrolling will pull this product apart.
Shape blending
Shape blending allows us to create interactive effects like fluids and liquid shapes.
This is a brand new feature in Spline. It involves combining SDF (Signed Distance Fields) with a polygonal-based system which creates fluid simulations. Give it a try!
Orbit & zoom
The play settings allow us to control a lot of different properties on the scene. These include allowing the camera to orbit, pan or zoom, and create custom touch settings for mobile devices.
Here the camera has been given an orbit behaviour with custom sensitivity and damping setting to stop it acting to quickly.